it('isLeaf', () => {
const withoutLoadData = render(
<Tree showIcon={false} defaultExpandAll>
<TreeNode isLeaf>
<TreeNode isLeaf />
</TreeNode>
</Tree>
);
expect(renderToJson(withoutLoadData)).toMatchSnapshot();
const withLoadData = render(
<Tree defaultExpandAll>
<TreeNode isLeaf>
<TreeNode isLeaf />
</TreeNode>
</Tree>
);
expect(renderToJson(withLoadData)).toMatchSnapshot();
const forceNoLeaf = render(
<Tree defaultExpandAll>
<TreeNode>
<TreeNode isLeaf={false} />
</TreeNode>
</Tree>
);
expect(renderToJson(forceNoLeaf)).toMatchSnapshot();
});
it('prefixCls', () => {
const withoutPrefix = render(
<Tree />
);
expect(renderToJson(withoutPrefix)).toMatchSnapshot();
const withPrefix = render(
<Tree prefixCls="test-prefix" />
);
expect(renderToJson(withPrefix)).toMatchSnapshot();
});
it('checkStrictly', () => {
const handleOnCheck = jest.fn();
const withCheckStrictlyBase = (
<Tree
onCheck={handleOnCheck}
defaultExpandedKeys={['0-0']}
checkable
checkStrictly
>
<TreeNode key="0-0">
<TreeNode key="0-0-0" />
</TreeNode>
</Tree>
);
expect(renderToJson(render(withCheckStrictlyBase))).toMatchSnapshot();
const withCheckStrictly = mount(withCheckStrictlyBase);
const parentNode = withCheckStrictly.find(TreeNode).first();
const targetNode = parentNode.find(TreeNode).last();
// Click Leaf
targetNode.find('.rc-tree-checkbox').simulate('click');
expect(handleOnCheck).toBeCalledWith({
checked: ['0-0-0'],
halfChecked: [],
}, expect.objectContaining({
event: 'check',
checked: true,
node: targetNode.instance(),
checkedNodes: [parentNode.props().children],
nativeEvent: expect.objectContaining({}),
}));
});
it('without selectable', () => {
const handleOnSelect = jest.fn();
const handleOnCheck = jest.fn();
const withCheckableBase = (
<Tree
onSelect={handleOnSelect}
onCheck={handleOnCheck}
defaultExpandedKeys={['0-0']}
selectable={false}
checkable
>
<TreeNode key="0-0">
<TreeNode key="0-0-0" />
</TreeNode>
</Tree>
);
expect(renderToJson(render(withCheckableBase))).toMatchSnapshot();
const withCheckable = mount(withCheckableBase);
const parentNode = withCheckable.find(TreeNode).first();
const targetNode = parentNode.find(TreeNode).last();
// Click leaf
targetNode.find('.rc-tree-node-content-wrapper').simulate('click');
expect(handleOnCheck).toBeCalledWith(['0-0-0', '0-0'], expect.objectContaining({
event: 'check',
checked: true,
node: targetNode.instance(),
checkedNodes: [nodeMatcher({ key: '0-0-0' }), nodeMatcher({ key: '0-0' })],
nativeEvent: expect.objectContaining({}),
}));
expect(handleOnSelect).not.toBeCalled();
});
testMethod(`renders ${file} correctly`, () => {
MockDate.set(new Date('2016-11-22').getTime());
const demo = require(`../.${file}`).default; // eslint-disable-line global-require, import/no-dynamic-require
const wrapper = render(demo);
expect(renderToJson(wrapper)).toMatchSnapshot();
MockDate.reset();
});
testMethod(`renders ${file} correctly`, () => {
MockDate.set(new Date('2016-11-22').getTime() + new Date().getTimezoneOffset() * 60 * 1000);
const demo = require('../.' + file);
const wrapper = render(demo);
expect(renderToJson(wrapper)).toMatchSnapshot();
MockDate.reset();
});
test('renders ./components/date-picker/demo/locale.md correctly', () => {
MockDate.set(new Date('2016-11-22').getTime());
const LocaleDemo = require('../../components/date-picker/demo/locale');
const wrapper = render(LocaleDemo);
expect(renderToJson(wrapper)).toMatchSnapshot();
MockDate.reset();
});
it('renders correctly', () => {
const wrapper = render(
<Pagination total={5} current={3} />,
);
expect(renderToJson(wrapper)).toMatchSnapshot();
expect(wrapper.find('.am-pagination')).toHaveLength(1);
});
testMethod(`renders ${file} correctly`, () => {
// https://github.com/boblauer/MockDate#api
MockDate.set('11/22/2016', -60); // Set an arbitrary time zone
const demo = require(`../.${file}`).default; // eslint-disable-line global-require, import/no-dynamic-require
const wrapper = render(demo);
expect(renderToJson(wrapper)).toMatchSnapshot();
MockDate.reset();
});
it('hide icon', () => {
const withoutLoadData = render(
<Tree showIcon={false} defaultExpandAll>
<TreeNode icon={<span className="cust-icon" />} />
</Tree>
);
expect(renderToJson(withoutLoadData)).toMatchSnapshot();
});
it('render with default selection correctly', () => {
const rowSelection = {
selections: true,
};
const wrapper = mount(createTable({ rowSelection }));
const dropdownWrapper = render(wrapper.find('Trigger').node.getComponent());
expect(renderToJson(dropdownWrapper)).toMatchSnapshot();
});
it('renders dropdown correctly', () => {
const wrapper = mount(select);
wrapper.find('.select-test').simulate('click');
expect(wrapper.find('.select-test').props().className).toContain('-open');
const dropdownWrapper = render(wrapper.find('Trigger').node.getComponent());
expect(renderToJson(dropdownWrapper)).toMatchSnapshot();
});
it('renders dot prop correctly', () => {
const wrapper = render(
<Badge dot>
<span style={{ width: '0.52rem', height: '0.52rem', background: '#ddd', display: 'inline-block' }} />
</Badge>,
);
expect(renderToJson(wrapper)).toMatchSnapshot();
expect(wrapper.find('.am-badge-dot')).toHaveLength(1);
});
it('no search', () => {
const wrapper = render(
<Select showSearch={false} value="1">
<Option value="1">1</Option>
<Option value="2">2</Option>
</Select>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('renders correctly', () => {
const wrapper = render(
<Select combobox placeholder="Search">
<Option value="1">1</Option>
<Option value="2">2</Option>
</Select>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('renders correctly', () => {
const wrapper = render(
<Result
imgUrl="https://zos.alipayobjects.com/rmsportal/qlMpMyJTcSjMpKAgtcEt.png"
title="验证成功"
message="所提交内容已成功完成验证"
/>,
);
expect(renderToJson(wrapper)).toMatchSnapshot();
expect(wrapper.find('.am-result')).toHaveLength(1);
});
it('defaultExpandAll', () => {
const wrapper = render(
<Tree defaultExpandAll>
<TreeNode key="0-0">
<TreeNode key="0-0-0" />
</TreeNode>
</Tree>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('component', () => {
const Icon = () => (
<span className="cust-icon" />
);
const withoutLoadData = render(
<Tree defaultExpandAll>
<TreeNode icon={Icon} />
</Tree>
);
expect(renderToJson(withoutLoadData)).toMatchSnapshot();
});
it('multiple', () => {
const handleOnSelect = jest.fn();
const multipleBase = (
<Tree
onSelect={handleOnSelect}
defaultExpandAll
multiple
>
<TreeNode key="0-0">
<TreeNode key="0-0-0" />
</TreeNode>
</Tree>
);
expect(renderToJson(render(multipleBase))).toMatchSnapshot();
const wrapper = mount(multipleBase);
const parentNode = wrapper.find(TreeNode).first();
const targetNode = parentNode.find(TreeNode).last();
// Leaf select
targetNode.find('.rc-tree-node-content-wrapper').simulate('click');
expect(handleOnSelect).toBeCalledWith(['0-0-0'], {
event: 'select',
selected: true,
node: targetNode.instance(),
selectedNodes: [parentNode.props().children],
nativeEvent: expect.objectContaining({}),
});
handleOnSelect.mockReset();
// Parent select
parentNode.find('.rc-tree-node-content-wrapper').first().simulate('click');
expect(handleOnSelect).toBeCalledWith(['0-0-0', '0-0'], expect.objectContaining({
event: 'select',
selected: true,
node: parentNode.instance(),
selectedNodes: [nodeMatcher({ key: '0-0-0' }), nodeMatcher({ key: '0-0' })],
nativeEvent: expect.objectContaining({}),
}));
handleOnSelect.mockReset();
// Leaf un-select
targetNode.find('.rc-tree-node-content-wrapper').simulate('click');
expect(handleOnSelect).toBeCalledWith(['0-0'], {
event: 'select',
selected: false,
node: targetNode.instance(),
selectedNodes: [nodeMatcher({ key: '0-0' })],
nativeEvent: expect.objectContaining({}),
});
});
it('icon', () => {
// Node icon has much higher priority
const wrapper = render(
<Tree defaultExpandAll icon={<span>ROOT ICON</span>}>
<TreeNode key="0-0">
<TreeNode key="0-0-0" icon={<span>CUSTOMIZE ICON</span>} />
</TreeNode>
</Tree>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('showIcon', () => {
const withIcon = render(
<Tree>
<TreeNode>
<TreeNode>
<TreeNode />
</TreeNode>
<TreeNode />
</TreeNode>
<TreeNode />
</Tree>
);
expect(renderToJson(withIcon)).toMatchSnapshot();
const withoutIcon = render(
<Tree showIcon={false}>
<TreeNode>
<TreeNode>
<TreeNode />
</TreeNode>
<TreeNode />
</TreeNode>
<TreeNode />
</Tree>
);
expect(renderToJson(withoutIcon)).toMatchSnapshot();
const withOpenIcon = render(
<Tree defaultExpandedKeys={['0-0']}>
<TreeNode>
<TreeNode key="0-0">
<TreeNode />
</TreeNode>
<TreeNode />
</TreeNode>
<TreeNode />
</Tree>
);
expect(renderToJson(withOpenIcon)).toMatchSnapshot();
});
it('match snapshot', () => {
const wrapper = render(
<Accordion>
<Accordion.Panel header="标题一">
内容一
</Accordion.Panel>
<Accordion.Panel header="标题二">
内容二
</Accordion.Panel>
</Accordion>,
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('renders opaque children correctly', () => {
const wrapper = render(
<Tree>
<TreeNode title="0" key="0">
{[1, 2].map(i =>
<TreeNode title={i} key={i} />
)}
<TreeNode title="3" key="3" />
</TreeNode>
</Tree>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('renders correctly', () => {
const wrapper = render(
<Popover overlay={[
(<Item key="4" value="scan">扫一扫</Item>),
(<Item key="5" value="special">我的二维码</Item>),
(<Item key="6" value="button ct">帮助</Item>),
]} mask visible
>
<div>trigger</div>
</Popover>,
);
expect(renderToJson(wrapper)).toMatchSnapshot();
expect(wrapper.find('.am-popover')).toHaveLength(0);
});
it('show month panel according to value', () => {
const birthday = moment('2000-01-01', 'YYYY-MM-DD');
const wrapper = mount(
<RangePicker
getCalendarContainer={trigger => trigger}
format="YYYY/MM/DD"
showTime open
/>
);
wrapper.setProps({ value: [birthday, birthday] });
expect(renderToJson(render(wrapper.find('Trigger').node.getComponent())))
.toMatchSnapshot();
});
it('renders aria attributes on li', () => {
const wrapper = render(
<Tree defaultExpandAll>
<TreeNode key="0-0" aria-label="0-0">
<TreeNode key="0-0-0" className="tree-node-cls" aria-label="0-0-0">
<TreeNode aria-label="0-0-0-0"/>
</TreeNode>
<TreeNode key="0-0-1" aria-label="0-0-1" />
</TreeNode>
<TreeNode key="0-1" aria-label="0-1" />
</Tree>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('className', () => {
const wrapper = render(
<Tree defaultExpandAll>
<TreeNode key="0-0">
<TreeNode key="0-0-0" className="tree-node-cls">
<TreeNode />
</TreeNode>
<TreeNode key="0-0-1" />
</TreeNode>
<TreeNode key="0-1" />
</Tree>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('match snapshot', () => {
const wrapper = render(
<Drawer
className="my-drawer"
style={{ minHeight: document.documentElement.clientHeight - 200 }}
dragHandleStyle={{ display: 'none' }}
contentStyle={{ color: '#A6A6A6', textAlign: 'center', paddingTop: 42 }}
sidebar={<span>sidebar content</span>}
position="left"
open={false}
>
Click upper-left corner icon
</Drawer>,
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('renders correctly', () => {
const menuItems = [
<MenuItemGroup key="group1">
<MenuItem key="1">1</MenuItem>
</MenuItemGroup>,
<MenuItemGroup key="group2">
<MenuItem key="2">2</MenuItem>
</MenuItemGroup>,
];
const wrapper = render(
<DropdownMenu
menuItems={menuItems}
value={[{ key: '1' }]}
/>
);
expect(renderToJson(wrapper)).toMatchSnapshot();
});
it('switch to corresponding month panel when click presetted ranges', () => {
const birthday = moment('2000-01-01', 'YYYY-MM-DD');
const wrapper = mount(
<RangePicker
ranges={{
'My Birthday': [birthday, birthday],
}}
getCalendarContainer={trigger => trigger}
format="YYYY/MM/DD"
showTime open
/>
);
const rangeCalendarWrapper = mount(wrapper.find('Trigger').node.getComponent());
rangeCalendarWrapper.find('.ant-calendar-range-quick-selector a')
.simulate('click');
expect(renderToJson(render(wrapper.find('Trigger').node.getComponent())))
.toMatchSnapshot();
});