diff --git a/.gitignore b/.gitignore index fcc3d98669..9566912c1b 100644 --- a/.gitignore +++ b/.gitignore @@ -31,3 +31,4 @@ components/**/*.js components/**/*.jsx /.vscode/ /coverage +!components/**/__tests__/* diff --git a/components/affix/__tests__/demo.test.js b/components/affix/__tests__/demo.test.js new file mode 100644 index 0000000000..58fcda3f82 --- /dev/null +++ b/components/affix/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('affix'); diff --git a/components/alert/__tests__/demo.test.js b/components/alert/__tests__/demo.test.js new file mode 100644 index 0000000000..0810864015 --- /dev/null +++ b/components/alert/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('alert'); diff --git a/components/anchor/__tests__/Anchor.test.js b/components/anchor/__tests__/Anchor.test.js new file mode 100644 index 0000000000..54db866a7d --- /dev/null +++ b/components/anchor/__tests__/Anchor.test.js @@ -0,0 +1,20 @@ +import React from 'react'; +import { mount } from 'enzyme'; +import Anchor from '..'; + +const { Link } = Anchor; + +describe('Anchor Render', () => { + it('Anchor render perfectly', () => { + const wrapper = mount( + + + + ); + + wrapper.find('a[href="#API"]').simulate('click'); + + wrapper.node.handleScroll(); + expect(wrapper.node.state).not.toBe(null); + }); +}); diff --git a/components/anchor/__tests__/demo.test.js b/components/anchor/__tests__/demo.test.js new file mode 100644 index 0000000000..302081fcbe --- /dev/null +++ b/components/anchor/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('anchor'); diff --git a/components/auto-complete/__tests__/demo.test.js b/components/auto-complete/__tests__/demo.test.js new file mode 100644 index 0000000000..7386ce505f --- /dev/null +++ b/components/auto-complete/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('auto-complete'); diff --git a/components/back-top/__tests__/demo.test.js b/components/back-top/__tests__/demo.test.js new file mode 100644 index 0000000000..0c60d8fb26 --- /dev/null +++ b/components/back-top/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('back-top'); diff --git a/components/badge/__tests__/demo.test.js b/components/badge/__tests__/demo.test.js new file mode 100644 index 0000000000..e1bdd02d5e --- /dev/null +++ b/components/badge/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('badge'); diff --git a/components/breadcrumb/__tests__/demo.test.js b/components/breadcrumb/__tests__/demo.test.js new file mode 100644 index 0000000000..1be7a7f397 --- /dev/null +++ b/components/breadcrumb/__tests__/demo.test.js @@ -0,0 +1,12 @@ +import { render } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import demoTest from '../../../tests/shared/demoTest'; +import routerDemo from '../demo/router.md'; + +demoTest('breadcrumb', { skip: ['router.md'] }); + +const testMethod = typeof window !== 'undefined' ? test : test.skip; +testMethod('renders ./components/breadcrumb/demo/router.md correctly', () => { + const wrapper = render(routerDemo); + expect(renderToJson(wrapper)).toMatchSnapshot(); +}); diff --git a/components/calendar/__tests__/demo.test.js b/components/calendar/__tests__/demo.test.js new file mode 100644 index 0000000000..3043717671 --- /dev/null +++ b/components/calendar/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('calendar'); diff --git a/components/card/__tests__/demo.test.js b/components/card/__tests__/demo.test.js new file mode 100644 index 0000000000..de86307564 --- /dev/null +++ b/components/card/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('card'); diff --git a/components/carousel/__tests__/demo.test.js b/components/carousel/__tests__/demo.test.js new file mode 100644 index 0000000000..b8748485df --- /dev/null +++ b/components/carousel/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('carousel'); diff --git a/components/cascader/__tests__/demo.test.js b/components/cascader/__tests__/demo.test.js new file mode 100644 index 0000000000..dcf87a5abc --- /dev/null +++ b/components/cascader/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('cascader'); diff --git a/components/checkbox/__tests__/demo.test.js b/components/checkbox/__tests__/demo.test.js new file mode 100644 index 0000000000..479f957c88 --- /dev/null +++ b/components/checkbox/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('checkbox'); diff --git a/components/checkbox/__tests__/index.test.js b/components/checkbox/__tests__/index.test.js new file mode 100644 index 0000000000..46bfcbbec4 --- /dev/null +++ b/components/checkbox/__tests__/index.test.js @@ -0,0 +1,23 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import Checkbox from '..'; + +describe('Checkbox', () => { + it('responses hover events', () => { + const onMouseEnter = jest.fn(); + const onMouseLeave = jest.fn(); + + const wrapper = shallow( + + ); + + wrapper.simulate('mouseenter'); + expect(onMouseEnter).toHaveBeenCalled(); + + wrapper.simulate('mouseleave'); + expect(onMouseLeave).toHaveBeenCalled(); + }); +}); diff --git a/components/collapse/__tests__/demo.test.js b/components/collapse/__tests__/demo.test.js new file mode 100644 index 0000000000..9c5ca5d469 --- /dev/null +++ b/components/collapse/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('collapse'); diff --git a/components/date-picker/__tests__/.demo.test.js.swp b/components/date-picker/__tests__/.demo.test.js.swp new file mode 100644 index 0000000000..0d79fd2b95 Binary files /dev/null and b/components/date-picker/__tests__/.demo.test.js.swp differ diff --git a/components/date-picker/__tests__/demo.test.js b/components/date-picker/__tests__/demo.test.js new file mode 100644 index 0000000000..0558b0281d --- /dev/null +++ b/components/date-picker/__tests__/demo.test.js @@ -0,0 +1,14 @@ +import { render } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import MockDate from 'mockdate'; +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('date-picker', { skip: ['locale.md'] }); + +test('renders ./components/date-picker/demo/locale.md correctly', () => { + MockDate.set(new Date('2016-11-22').getTime()); + const LocaleDemo = require('../demo/locale'); // eslint-disable-line global-require + const wrapper = render(LocaleDemo); + expect(renderToJson(wrapper)).toMatchSnapshot(); + MockDate.reset(); +}); diff --git a/components/dropdown/__tests__/demo.test.js b/components/dropdown/__tests__/demo.test.js new file mode 100644 index 0000000000..b99e23f3b0 --- /dev/null +++ b/components/dropdown/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('dropdown'); diff --git a/components/dropdown/__tests__/dropdown-button.test.js b/components/dropdown/__tests__/dropdown-button.test.js new file mode 100644 index 0000000000..5ba096e6b4 --- /dev/null +++ b/components/dropdown/__tests__/dropdown-button.test.js @@ -0,0 +1,36 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import Dropdown from '..'; +import Menu from '../../menu'; + +describe('DropdownButton', () => { + it('pass appropriate props to Dropdown', () => { + const props = { + align: { + offset: [10, 20], + }, + overlay: ( + + foo + + ), + trigger: ['hover'], + visible: true, + onVisibleChange: () => {}, + }; + + const wrapper = shallow(); + const dropdownProps = wrapper.find(Dropdown).props(); + + Object.keys(props).forEach((key) => { + expect(dropdownProps[key]).toBe(props[key]); + }); + }); + + it('don\'t pass visible to Dropdown if it\'s not exits', () => { + const wrapper = shallow(); + const dropdownProps = wrapper.find(Dropdown).props(); + + expect('visible' in dropdownProps).toBe(false); + }); +}); diff --git a/components/form/__tests__/demo.test.js b/components/form/__tests__/demo.test.js new file mode 100644 index 0000000000..0247d5d309 --- /dev/null +++ b/components/form/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('form'); diff --git a/components/grid/__tests__/demo.test.js b/components/grid/__tests__/demo.test.js new file mode 100644 index 0000000000..9d35d8ceee --- /dev/null +++ b/components/grid/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('grid'); diff --git a/components/grid/__tests__/index.test.js b/components/grid/__tests__/index.test.js new file mode 100644 index 0000000000..8a0aadbc7b --- /dev/null +++ b/components/grid/__tests__/index.test.js @@ -0,0 +1,20 @@ +import React from 'react'; +import TestUtils from 'react-addons-test-utils'; +import { Col, Row } from '..'; + +describe('Grid', () => { + it('should render Col', () => { + const col = TestUtils.renderIntoDocument( + + ); + const colNode = TestUtils.findRenderedDOMComponentWithTag(col, 'DIV'); + expect(colNode.className).toBe('ant-col-2'); + }); + it('should render Row', () => { + const row = TestUtils.renderIntoDocument( + + ); + const rowNode = TestUtils.findRenderedDOMComponentWithTag(row, 'DIV'); + expect(rowNode.className).toBe('ant-row'); + }); +}); diff --git a/components/icon/__tests__/index.test.js b/components/icon/__tests__/index.test.js new file mode 100644 index 0000000000..6c074c653c --- /dev/null +++ b/components/icon/__tests__/index.test.js @@ -0,0 +1,25 @@ +import React from 'react'; +import TestUtils from 'react-addons-test-utils'; +import { wrap } from 'react-stateless-wrapper'; +import AntIcon from '..'; + +const Icon = wrap(AntIcon); + +describe('Icon', () => { + let icon; + let iconNode; + + beforeEach(() => { + icon = TestUtils.renderIntoDocument( + + ); + iconNode = TestUtils.findRenderedDOMComponentWithTag(icon, 'I'); + }); + + it('should render to a ', () => { + expect(iconNode.tagName).toBe('I'); + expect(iconNode.className).toContain('my-icon-classname'); + expect(iconNode.className).toContain('anticon'); + expect(iconNode.className).toContain('anticon-appstore'); + }); +}); diff --git a/components/input-number/__tests__/demo.test.js b/components/input-number/__tests__/demo.test.js new file mode 100644 index 0000000000..a83426938b --- /dev/null +++ b/components/input-number/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('input-number'); diff --git a/components/input/__tests__/demo.test.js b/components/input/__tests__/demo.test.js new file mode 100644 index 0000000000..28e21b7a5f --- /dev/null +++ b/components/input/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('input'); diff --git a/components/locale-provider/__tests__/demo.test.js b/components/locale-provider/__tests__/demo.test.js new file mode 100644 index 0000000000..49a5f38dcf --- /dev/null +++ b/components/locale-provider/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('locale-provider'); diff --git a/components/mention/__tests__/demo.test.js b/components/mention/__tests__/demo.test.js new file mode 100644 index 0000000000..60b45b7af3 --- /dev/null +++ b/components/mention/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('mention', { skip: true }); diff --git a/components/menu/__tests__/demo.test.js b/components/menu/__tests__/demo.test.js new file mode 100644 index 0000000000..ad45d65880 --- /dev/null +++ b/components/menu/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('menu'); diff --git a/components/message/__tests__/demo.test.js b/components/message/__tests__/demo.test.js new file mode 100644 index 0000000000..c4a9586c16 --- /dev/null +++ b/components/message/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('message'); diff --git a/components/modal/__tests__/demo.test.js b/components/modal/__tests__/demo.test.js new file mode 100644 index 0000000000..65333d266b --- /dev/null +++ b/components/modal/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('modal'); diff --git a/components/notification/__tests__/demo.test.js b/components/notification/__tests__/demo.test.js new file mode 100644 index 0000000000..ac1f4612e4 --- /dev/null +++ b/components/notification/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('notification'); diff --git a/components/pagination/__tests__/demo.test.js b/components/pagination/__tests__/demo.test.js new file mode 100644 index 0000000000..4a989e4480 --- /dev/null +++ b/components/pagination/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('pagination'); diff --git a/components/popconfirm/__tests__/demo.test.js b/components/popconfirm/__tests__/demo.test.js new file mode 100644 index 0000000000..9d51a978ee --- /dev/null +++ b/components/popconfirm/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('popconfirm'); diff --git a/components/popover/__tests__/demo.test.js b/components/popover/__tests__/demo.test.js new file mode 100644 index 0000000000..2ce75d3c37 --- /dev/null +++ b/components/popover/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('popover'); diff --git a/components/popover/__tests__/index.test.js b/components/popover/__tests__/index.test.js new file mode 100644 index 0000000000..ba816e5a55 --- /dev/null +++ b/components/popover/__tests__/index.test.js @@ -0,0 +1,25 @@ +import React from 'react'; +import TestUtils from 'react-addons-test-utils'; +import Popover from '..'; + +describe('Popover', () => { + it('should show overlay when trigger is clicked', () => { + const popover = TestUtils.renderIntoDocument( + + show me your code + + ); + + expect(popover.getPopupDomNode()).toBe(null); + + TestUtils.Simulate.click( + TestUtils.findRenderedDOMComponentWithTag(popover, 'span') + ); + + const popup = popover.getPopupDomNode(); + expect(popup).not.toBe(null); + expect(popup.className).toContain('ant-popover-placement-top'); + expect(popup.innerHTML).toMatch(/
code<\/div>/); + expect(popup.innerHTML).toMatch(/
console\.log\('hello world'\)<\/div>/); + }); +}); diff --git a/components/progress/__tests__/demo.test.js b/components/progress/__tests__/demo.test.js new file mode 100644 index 0000000000..6beec6e434 --- /dev/null +++ b/components/progress/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('progress'); diff --git a/components/radio/__tests__/demo.test.js b/components/radio/__tests__/demo.test.js new file mode 100644 index 0000000000..80dd304410 --- /dev/null +++ b/components/radio/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('radio'); diff --git a/components/radio/__tests__/group.test.js b/components/radio/__tests__/group.test.js new file mode 100644 index 0000000000..4ad4ebaaf5 --- /dev/null +++ b/components/radio/__tests__/group.test.js @@ -0,0 +1,26 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import Radio from '../radio'; +import RadioGroup from '../group'; + +describe('Radio', () => { + it('responses hover events', () => { + const onMouseEnter = jest.fn(); + const onMouseLeave = jest.fn(); + + const wrapper = shallow( + + + + ); + + wrapper.simulate('mouseenter'); + expect(onMouseEnter).toHaveBeenCalled(); + + wrapper.simulate('mouseleave'); + expect(onMouseLeave).toHaveBeenCalled(); + }); +}); diff --git a/components/radio/__tests__/radio.test.js b/components/radio/__tests__/radio.test.js new file mode 100644 index 0000000000..34746a84c5 --- /dev/null +++ b/components/radio/__tests__/radio.test.js @@ -0,0 +1,23 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import Radio from '../radio'; + +describe('Radio', () => { + it('responses hover events', () => { + const onMouseEnter = jest.fn(); + const onMouseLeave = jest.fn(); + + const wrapper = shallow( + + ); + + wrapper.simulate('mouseenter'); + expect(onMouseEnter).toHaveBeenCalled(); + + wrapper.simulate('mouseleave'); + expect(onMouseLeave).toHaveBeenCalled(); + }); +}); diff --git a/components/rate/__tests__/demo.test.js b/components/rate/__tests__/demo.test.js new file mode 100644 index 0000000000..ddc04f61fd --- /dev/null +++ b/components/rate/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('rate'); diff --git a/components/select/__tests__/demo.test.js b/components/select/__tests__/demo.test.js new file mode 100644 index 0000000000..80444be801 --- /dev/null +++ b/components/select/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('select'); diff --git a/components/slider/__tests__/demo.test.js b/components/slider/__tests__/demo.test.js new file mode 100644 index 0000000000..53042e86ef --- /dev/null +++ b/components/slider/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('slider'); diff --git a/components/spin/__tests__/demo.test.js b/components/spin/__tests__/demo.test.js new file mode 100644 index 0000000000..92b2ef7f3e --- /dev/null +++ b/components/spin/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('spin'); diff --git a/components/steps/__tests__/demo.test.js b/components/steps/__tests__/demo.test.js new file mode 100644 index 0000000000..4240dd9ddd --- /dev/null +++ b/components/steps/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('steps'); diff --git a/components/switch/__tests__/demo.test.js b/components/switch/__tests__/demo.test.js new file mode 100644 index 0000000000..212cd1b8ba --- /dev/null +++ b/components/switch/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('switch'); diff --git a/components/table/__tests__/SelectionBox.test.js b/components/table/__tests__/SelectionBox.test.js new file mode 100644 index 0000000000..6b501d4f3b --- /dev/null +++ b/components/table/__tests__/SelectionBox.test.js @@ -0,0 +1,87 @@ +import React from 'react'; +import { mount } from 'enzyme'; +import createStore from '../createStore'; +import SelectionBox from '../SelectionBox'; + +describe('SelectionBox', () => { + it('unchecked by selectedRowKeys ', () => { + const store = createStore({ + selectedRowKeys: [], + selectionDirty: false, + }); + + const wrapper = mount( + {}} + defaultSelection={[]} + /> + ); + + expect(wrapper.state()).toEqual({ checked: false }); + }); + + it('checked by selectedRowKeys ', () => { + const store = createStore({ + selectedRowKeys: ['1'], + selectionDirty: false, + }); + + const wrapper = mount( + {}} + defaultSelection={[]} + /> + ); + + expect(wrapper.state()).toEqual({ checked: true }); + }); + + it('checked by defaultSelection', () => { + const store = createStore({ + selectedRowKeys: [], + selectionDirty: false, + }); + + const wrapper = mount( + {}} + defaultSelection={['1']} + /> + ); + + expect(wrapper.state()).toEqual({ checked: true }); + }); + + it('checked when store change', () => { + const store = createStore({ + selectedRowKeys: [], + selectionDirty: false, + }); + + const wrapper = mount( + {}} + defaultSelection={[]} + /> + ); + + store.setState({ + selectedRowKeys: ['1'], + selectionDirty: true, + }); + + expect(wrapper.state()).toEqual({ checked: true }); + }); +}); diff --git a/components/table/__tests__/Table.filter.test.js b/components/table/__tests__/Table.filter.test.js new file mode 100644 index 0000000000..60ee846626 --- /dev/null +++ b/components/table/__tests__/Table.filter.test.js @@ -0,0 +1,141 @@ +import React from 'react'; +import { render, mount } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import Table from '../table'; + +describe('Table.filter', () => { + const filterFn = (value, record) => record.name === 'Lucy'; + const column = { + title: 'Name', + dataIndex: 'name', + filters: [ + { text: 'Boy', value: 'boy' }, + { text: 'Girl', value: 'girl' }, + { + text: 'Title', + value: 'title', + children: [ + { text: 'Designer', value: 'designer' }, + { text: 'Coder', value: 'coder' }, + ], + }, + ], + onFilter: filterFn, + }; + + const data = [ + { key: 0, name: 'Jack' }, + { key: 1, name: 'Lucy' }, + { key: 2, name: 'Tom' }, + { key: 3, name: 'Jerry' }, + ]; + + function createTable(props) { + return ( + + ); + } + + it('renders filter correctly', () => { + const wrapper = render(createTable()); + + expect(renderToJson(wrapper)).toMatchSnapshot(); + }); + + it('renders menu correctly', () => { + const wrapper = mount(createTable()); + const dropdownWrapper = render(wrapper.find('Trigger').node.getComponent()); + expect(renderToJson(dropdownWrapper)).toMatchSnapshot(); + }); + + it('renders radio filter correctly', () => { + const wrapper = mount(createTable({ + columns: [{ + ...column, + filterMultiple: false, + }], + })); + const dropdownWrapper = render(wrapper.find('Trigger').node.getComponent()); + expect(renderToJson(dropdownWrapper)).toMatchSnapshot(); + }); + + it('renders custom content correctly', () => { + const filter = ( +
+ custom filter +
+ ); + const wrapper = mount(createTable({ + columns: [{ + ...column, + filterDropdown: filter, + }], + })); + + const dropdownWrapper = render(wrapper.find('Trigger').node.getComponent()); + expect(renderToJson(dropdownWrapper)).toMatchSnapshot(); + }); + + it('can be controlled by filterDropdownVisible', () => { + const wrapper = mount(createTable({ + columns: [{ + ...column, + filterDropdownVisible: true, + }], + })); + const dropdown = wrapper.find('Dropdown').first(); + + expect(dropdown.props().visible).toBe(true); + wrapper.setProps({ columns: [{ + ...column, + filterDropdownVisible: false, + }] }); + expect(dropdown.props().visible).toBe(false); + }); + + it('fires change event when visible change', () => { + const handleChange = jest.fn(); + const wrapper = mount(createTable({ + columns: [{ + ...column, + onFilterDropdownVisibleChange: handleChange, + }], + })); + + wrapper.find('Dropdown').first().simulate('click'); + + expect(handleChange).toBeCalledWith(true); + }); + + it('can be controlled by filteredValue', () => { + const wrapper = mount(createTable({ + columns: [{ + ...column, + filteredValue: ['girl'], + }], + })); + + expect(wrapper.find('tbody tr').length).toBe(1); + wrapper.setProps({ columns: [{ + ...column, + filteredValue: [], + }] }); + expect(wrapper.find('tbody tr').length).toBe(4); + }); + + it('fires change event', () => { + const handleChange = jest.fn(); + const wrapper = mount(createTable({ onChange: handleChange })); + const dropdownWrapper = mount(wrapper.find('Trigger').node.getComponent()); + + dropdownWrapper.find('MenuItem').first().simulate('click'); + dropdownWrapper.find('.confirm').simulate('click'); + + expect(handleChange).toBeCalledWith({}, { name: ['boy'] }, {}); + }); +}); diff --git a/components/table/__tests__/Table.pagination.test.js b/components/table/__tests__/Table.pagination.test.js new file mode 100644 index 0000000000..e9ac7fe52c --- /dev/null +++ b/components/table/__tests__/Table.pagination.test.js @@ -0,0 +1,78 @@ +import React from 'react'; +import { render, mount } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import Table from '../table'; + +describe('Table.pagination', () => { + const columns = [{ + title: 'Name', + dataIndex: 'name', + }]; + + const data = [ + { key: 0, name: 'Jack' }, + { key: 1, name: 'Lucy' }, + { key: 2, name: 'Tom' }, + { key: 3, name: 'Jerry' }, + ]; + + const pagination = { pageSize: 2 }; + + function createTable(props) { + return ( +
+ ); + } + + function renderedNames(wrapper) { + return wrapper.find('TableRow').map(row => row.props().record.name); + } + + it('renders pagination correctly', () => { + const wrapper = render(createTable()); + expect(renderToJson(wrapper)).toMatchSnapshot(); + }); + + it('paginate data', () => { + const wrapper = mount(createTable()); + + expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy']); + wrapper.find('Pager').last().simulate('click'); + expect(renderedNames(wrapper)).toEqual(['Tom', 'Jerry']); + }); + + + it('repaginates when pageSize change', () => { + const wrapper = mount(createTable()); + + wrapper.setProps({ pagination: { pageSize: 1 } }); + expect(renderedNames(wrapper)).toEqual(['Jack']); + }); + + it('fires change event', () => { + const handleChange = jest.fn(); + const noop = () => {}; + const wrapper = mount(createTable({ + pagination: { ...pagination, onChange: noop, onShowSizeChange: noop }, + onChange: handleChange, + })); + + wrapper.find('Pager').last().simulate('click'); + + expect(handleChange).toBeCalledWith( + { + current: 2, + onChange: noop, + onShowSizeChange: noop, + pageSize: 2, + }, + {}, + {} + ); + }); +}); diff --git a/components/table/__tests__/Table.rowSelection.test.js b/components/table/__tests__/Table.rowSelection.test.js new file mode 100644 index 0000000000..7ac98b2b76 --- /dev/null +++ b/components/table/__tests__/Table.rowSelection.test.js @@ -0,0 +1,166 @@ +import React from 'react'; +import { mount } from 'enzyme'; +import Table from '../table'; + +describe('Table.rowSelection', () => { + const columns = [{ + title: 'Name', + dataIndex: 'name', + }]; + + const data = [ + { key: 0, name: 'Jack' }, + { key: 1, name: 'Lucy' }, + { key: 2, name: 'Tom' }, + { key: 3, name: 'Jerry' }, + ]; + + function createTable(props = {}) { + return ( +
+ ); + } + + it('select by checkbox', () => { + const wrapper = mount(createTable()); + const checkboxes = wrapper.find('input'); + const checkboxAll = checkboxes.first(); + + checkboxAll.simulate('change', { target: { checked: true } }); + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [0, 1, 2, 3], + selectionDirty: true, + }); + + checkboxes.at(1).simulate('change', { target: { checked: false } }); + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [1, 2, 3], + selectionDirty: true, + }); + + checkboxes.at(1).simulate('change', { target: { checked: true } }); + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [1, 2, 3, 0], + selectionDirty: true, + }); + }); + + it('select by radio', () => { + const wrapper = mount(createTable({ rowSelection: { type: 'radio' } })); + const radios = wrapper.find('input'); + + expect(radios.length).toBe(4); + + radios.first().simulate('change', { target: { checked: true } }); + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [0], + selectionDirty: true, + }); + + radios.last().simulate('change', { target: { checked: true } }); + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [3], + selectionDirty: true, + }); + }); + + it('pass getCheckboxProps to checkbox', () => { + const rowSelection = { + getCheckboxProps: record => ({ + disabled: record.name === 'Lucy', + }), + }; + + const wrapper = mount(createTable({ rowSelection })); + const checkboxes = wrapper.find('input'); + + expect(checkboxes.at(1).props().disabled).toBe(false); + expect(checkboxes.at(2).props().disabled).toBe(true); + }); + + it('works with pagination', () => { + const wrapper = mount(createTable({ pagination: { pageSize: 2 } })); + + const checkboxAll = wrapper.find('SelectionCheckboxAll'); + const pagers = wrapper.find('Pager'); + + checkboxAll.find('input').simulate('change', { target: { checked: true } }); + expect(checkboxAll.node.state).toEqual({ checked: true, indeterminate: false }); + + pagers.at(1).simulate('click'); + expect(checkboxAll.node.state).toEqual({ checked: false, indeterminate: false }); + + pagers.at(0).simulate('click'); + expect(checkboxAll.node.state).toEqual({ checked: true, indeterminate: false }); + }); + + // https://github.com/ant-design/ant-design/issues/4020 + it('handles defaultChecked', () => { + const rowSelection = { + getCheckboxProps: record => ({ + defaultChecked: record.key === 0, + }), + }; + + const wrapper = mount(createTable({ rowSelection })); + + const checkboxs = wrapper.find('input'); + expect(checkboxs.at(1).props().checked).toBe(true); + expect(checkboxs.at(2).props().checked).toBe(false); + + checkboxs.at(2).simulate('change', { target: { checked: true } }); + expect(checkboxs.at(1).props().checked).toBe(true); + expect(checkboxs.at(2).props().checked).toBe(true); + }); + + it('can be controlled', () => { + const wrapper = mount(createTable({ rowSelection: { selectedRowKeys: [0] } })); + + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [0], + selectionDirty: false, + }); + + wrapper.setProps({ rowSelection: { selectedRowKeys: [1] } }); + + expect(wrapper.instance().store.getState()).toEqual({ + selectedRowKeys: [1], + selectionDirty: false, + }); + }); + + it('fires change & select events', () => { + const handleChange = jest.fn(); + const handleSelect = jest.fn(); + const rowSelection = { + onChange: handleChange, + onSelect: handleSelect, + }; + const wrapper = mount(createTable({ rowSelection })); + + wrapper.find('input').last().simulate('change', { target: { checked: true } }); + + expect(handleChange).toBeCalledWith([3], [{ key: 3, name: 'Jerry' }]); + expect(handleSelect).toBeCalledWith( + { key: 3, name: 'Jerry' }, + true, + [{ key: 3, name: 'Jerry' }] + ); + }); + + it('fires selectAll event', () => { + const handleSelectAll = jest.fn(); + const rowSelection = { + onSelectAll: handleSelectAll, + }; + const wrapper = mount(createTable({ rowSelection })); + + wrapper.find('input').first().simulate('change', { target: { checked: true } }); + expect(handleSelectAll).toBeCalledWith(true, data, data); + }); +}); diff --git a/components/table/__tests__/Table.sorter.test.js b/components/table/__tests__/Table.sorter.test.js new file mode 100644 index 0000000000..1680379305 --- /dev/null +++ b/components/table/__tests__/Table.sorter.test.js @@ -0,0 +1,71 @@ +import React from 'react'; +import { render, mount } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import Table from '../table'; + +describe('Table.sorter', () => { + const sorterFn = (a, b) => a.name[0].charCodeAt() - b.name[0].charCodeAt(); + + const column = { + title: 'Name', + dataIndex: 'name', + sorter: sorterFn, + }; + + const data = [ + { key: 0, name: 'Jack' }, + { key: 1, name: 'Lucy' }, + { key: 2, name: 'Tom' }, + { key: 3, name: 'Jerry' }, + ]; + + function createTable(props) { + return ( +
+ ); + } + + function renderedNames(wrapper) { + return wrapper.find('TableRow').map(row => row.props().record.name); + } + + it('renders sorter icon correctly', () => { + const wrapper = render(createTable()); + expect(renderToJson(wrapper.find('thead'))).toMatchSnapshot(); + }); + + it('sort records', () => { + const wrapper = mount(createTable()); + + wrapper.find('.ant-table-column-sorter-up').simulate('click'); + expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']); + + wrapper.find('.ant-table-column-sorter-down').simulate('click'); + expect(renderedNames(wrapper)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']); + }); + + it('can be controlled by sortOrder', () => { + const wrapper = mount(createTable({ + columns: [{ ...column, sortOrder: 'ascend' }], + })); + expect(renderedNames(wrapper)).toEqual(['Jack', 'Jerry', 'Lucy', 'Tom']); + }); + + it('fires change event', () => { + const handleChange = jest.fn(); + const wrapper = mount(createTable({ onChange: handleChange })); + + wrapper.find('.ant-table-column-sorter-up').simulate('click'); + + const sorter = handleChange.mock.calls[0][2]; + expect(sorter.column.dataIndex).toBe('name'); + expect(sorter.order).toBe('ascend'); + expect(sorter.field).toBe('name'); + expect(sorter.columnKey).toBe('name'); + }); +}); diff --git a/components/table/__tests__/Table.test.js b/components/table/__tests__/Table.test.js new file mode 100644 index 0000000000..fc5778d078 --- /dev/null +++ b/components/table/__tests__/Table.test.js @@ -0,0 +1,63 @@ +import React from 'react'; +import { render, shallow } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import Table from '../table'; + +const { Column, ColumnGroup } = Table; + +describe('Table', () => { + it('renders JSX correctly', () => { + const data = [{ + key: '1', + firstName: 'John', + lastName: 'Brown', + age: 32, + }, { + key: '2', + firstName: 'Jim', + lastName: 'Green', + age: 42, + }]; + + const wrapper = render( +
+ + + + + +
+ ); + + expect(renderToJson(wrapper)).toMatchSnapshot(); + }); + + it('updates columns when receiving props', () => { + const columns = [{ + title: 'Name', + key: 'name', + dataIndex: 'name', + }]; + const wrapper = shallow(); + const newColumns = [{ + title: 'Title', + key: 'title', + dataIndex: 'title', + }]; + wrapper.setProps({ columns: newColumns }); + + expect(wrapper.instance().columns).toBe(newColumns); + }); +}); diff --git a/components/table/__tests__/demo.test.js b/components/table/__tests__/demo.test.js new file mode 100644 index 0000000000..6e3d96d1b2 --- /dev/null +++ b/components/table/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('table'); diff --git a/components/tabs/__tests__/demo.test.js b/components/tabs/__tests__/demo.test.js new file mode 100644 index 0000000000..c991dd50dd --- /dev/null +++ b/components/tabs/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('tabs'); diff --git a/components/tag/__tests__/demo.test.js b/components/tag/__tests__/demo.test.js new file mode 100644 index 0000000000..826b8a9d2e --- /dev/null +++ b/components/tag/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('tag'); diff --git a/components/time-picker/__tests__/demo.test.js b/components/time-picker/__tests__/demo.test.js new file mode 100644 index 0000000000..26bc8764c9 --- /dev/null +++ b/components/time-picker/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('time-picker'); diff --git a/components/time-picker/__tests__/index.test.js b/components/time-picker/__tests__/index.test.js new file mode 100644 index 0000000000..6b0dedb336 --- /dev/null +++ b/components/time-picker/__tests__/index.test.js @@ -0,0 +1,16 @@ +import React from 'react'; +import { mount, render } from 'enzyme'; +import { renderToJson } from 'enzyme-to-json'; +import RcTimePicker from 'rc-time-picker/lib/TimePicker'; +import TimePicker from '..'; + +describe('TimePicker', () => { + it('renders addon correctly', () => { + const addon = () => (); + const wrapper = mount(); + const rcTimePicker = wrapper.find(RcTimePicker); + const addonWrapper = render(rcTimePicker.props().addon()); + + expect(renderToJson(addonWrapper)).toMatchSnapshot(); + }); +}); diff --git a/components/timeline/__tests__/demo.test.js b/components/timeline/__tests__/demo.test.js new file mode 100644 index 0000000000..c3607e93b6 --- /dev/null +++ b/components/timeline/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('timeline'); diff --git a/components/tooltip/__tests__/demo.test.js b/components/tooltip/__tests__/demo.test.js new file mode 100644 index 0000000000..2ebb359ed9 --- /dev/null +++ b/components/tooltip/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('tooltip'); diff --git a/components/transfer/__tests__/demo.test.js b/components/transfer/__tests__/demo.test.js new file mode 100644 index 0000000000..24d908fb42 --- /dev/null +++ b/components/transfer/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('transfer'); diff --git a/components/transfer/__tests__/search.test.js b/components/transfer/__tests__/search.test.js new file mode 100644 index 0000000000..8bb27c5b6c --- /dev/null +++ b/components/transfer/__tests__/search.test.js @@ -0,0 +1,16 @@ +import React from 'react'; +import { mount } from 'enzyme'; +import { mountToJson } from 'enzyme-to-json'; +import Search from '../search'; + +describe('Search', () => { + it('should show cross icon when input value exists', () => { + const wrapper = mount(); + + expect(mountToJson(wrapper)).toMatchSnapshot(); + + wrapper.setProps({ value: 'a' }); + + expect(mountToJson(wrapper)).toMatchSnapshot(); + }); +}); diff --git a/components/tree-select/__tests__/demo.test.js b/components/tree-select/__tests__/demo.test.js new file mode 100644 index 0000000000..c59fb528de --- /dev/null +++ b/components/tree-select/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('tree-select'); diff --git a/components/tree/__tests__/demo.test.js b/components/tree/__tests__/demo.test.js new file mode 100644 index 0000000000..b7cd9eab87 --- /dev/null +++ b/components/tree/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('tree'); diff --git a/components/upload/__tests__/demo.test.js b/components/upload/__tests__/demo.test.js new file mode 100644 index 0000000000..16ea9f2bde --- /dev/null +++ b/components/upload/__tests__/demo.test.js @@ -0,0 +1,3 @@ +import demoTest from '../../../tests/shared/demoTest'; + +demoTest('upload');