From e1a861821609e7c7b301d48bf4bca7a09a7d8b9e Mon Sep 17 00:00:00 2001 From: Dunqing Date: Sat, 6 May 2023 16:11:04 +0800 Subject: [PATCH 01/11] feat: first --- .github/workflows/main.yml | 2 +- jest.config.js | 4 - package.json | 12 +- tests/{ColSpan.spec.js => ColSpan.spec.jsx} | 0 tests/{Colgroup.spec.js => Colgroup.spec.jsx} | 2 +- ...Deprecated.spec.js => Deprecated.spec.jsx} | 6 +- .../{ExpandRow.spec.js => ExpandRow.spec.jsx} | 34 +- ...umn-IE.spec.js => FixedColumn-IE.spec.jsx} | 12 +- ...xedColumn.spec.js => FixedColumn.spec.jsx} | 12 +- ...xedHeader.spec.js => FixedHeader.spec.jsx} | 27 +- ...lumns.spec.js => GroupingColumns.spec.jsx} | 2 +- tests/Hover.spec.tsx | 6 +- tests/{Internal.spec.js => Internal.spec.jsx} | 0 tests/{Scroll.spec.js => Scroll.spec.jsx} | 23 +- tests/{Sticky.spec.js => Sticky.spec.jsx} | 40 +- tests/Summary.spec.tsx | 2 +- tests/{Table.spec.js => Table.spec.jsx} | 26 +- tests/__snapshots__/ExpandRow.spec.js.snap | 1284 ------- tests/__snapshots__/ExpandRow.spec.jsx.snap | 1554 ++++++++ tests/__snapshots__/FixedColumn.spec.js.snap | 2965 ---------------- tests/__snapshots__/FixedColumn.spec.jsx.snap | 3145 +++++++++++++++++ tests/__snapshots__/Summary.spec.tsx.snap | 82 +- tests/__snapshots__/Table.spec.js.snap | 918 ----- tests/__snapshots__/Table.spec.jsx.snap | 1319 +++++++ tests/setup.js | 7 - tests/setup.ts | 21 + tests/utils.js | 2 +- tsconfig.json | 3 +- typings.d.ts | 1 + vitest.config.ts | 13 + 30 files changed, 6214 insertions(+), 5310 deletions(-) delete mode 100644 jest.config.js rename tests/{ColSpan.spec.js => ColSpan.spec.jsx} (100%) rename tests/{Colgroup.spec.js => Colgroup.spec.jsx} (100%) rename tests/{Deprecated.spec.js => Deprecated.spec.jsx} (90%) rename tests/{ExpandRow.spec.js => ExpandRow.spec.jsx} (96%) rename tests/{FixedColumn-IE.spec.js => FixedColumn-IE.spec.jsx} (95%) rename tests/{FixedColumn.spec.js => FixedColumn.spec.jsx} (97%) rename tests/{FixedHeader.spec.js => FixedHeader.spec.jsx} (95%) rename tests/{GroupingColumns.spec.js => GroupingColumns.spec.jsx} (100%) rename tests/{Internal.spec.js => Internal.spec.jsx} (100%) rename tests/{Scroll.spec.js => Scroll.spec.jsx} (91%) rename tests/{Sticky.spec.js => Sticky.spec.jsx} (96%) rename tests/{Table.spec.js => Table.spec.jsx} (98%) delete mode 100644 tests/__snapshots__/ExpandRow.spec.js.snap create mode 100644 tests/__snapshots__/ExpandRow.spec.jsx.snap delete mode 100644 tests/__snapshots__/FixedColumn.spec.js.snap create mode 100644 tests/__snapshots__/FixedColumn.spec.jsx.snap delete mode 100644 tests/__snapshots__/Table.spec.js.snap create mode 100644 tests/__snapshots__/Table.spec.jsx.snap delete mode 100644 tests/setup.js create mode 100644 tests/setup.ts create mode 100644 vitest.config.ts diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index a13a97238..bd2a5f2e9 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -108,6 +108,6 @@ jobs: key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }} - name: coverage - run: npm test -- --coverage && bash <(curl -s https://codecov.io/bash) + run: npm run coverage && bash <(curl -s https://codecov.io/bash) needs: setup diff --git a/jest.config.js b/jest.config.js deleted file mode 100644 index 86627c33b..000000000 --- a/jest.config.js +++ /dev/null @@ -1,4 +0,0 @@ -module.exports = { - setupFiles: ['./tests/setup.js'], - snapshotSerializers: [require.resolve('enzyme-to-json/serializer')], -}; diff --git a/package.json b/package.json index a26e93c16..1e54808c4 100644 --- a/package.json +++ b/package.json @@ -40,8 +40,8 @@ "compile": "father build && lessc assets/index.less assets/index.css", "deploy": "npm run docs:build && npm run docs:deploy", "prettier": "prettier --write \"**/*.{js,jsx,tsx,ts,less,md,json}\"", - "test": "rc-test", - "coverage": "rc-test --coverage", + "test": "vitest", + "coverage": "vitest run --coverage", "prepublishOnly": "npm run compile && np --no-cleanup --yolo --no-publish", "lint": "eslint src/ --ext .tsx,.ts", "lint:tsc": "tsc -p tsconfig.json --noEmit", @@ -63,7 +63,6 @@ "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^12.1.5", "@types/enzyme": "^3.10.5", - "@types/jest": "^28.1.2", "@types/react": "^17.0.35", "@types/react-dom": "^18.0.5", "@types/responselike": "^1.0.0", @@ -86,7 +85,6 @@ "rc-animate": "^3.0.0", "rc-dropdown": "~4.0.1", "rc-menu": "~9.6.0", - "rc-test": "^7.0.14", "rc-tooltip": "^5.2.1", "react": "^16.0.0", "react-dnd": "^2.5.4", @@ -97,7 +95,11 @@ "react-window": "^1.8.5", "regenerator-runtime": "^0.13.7", "styled-components": "^5.0.1", - "typescript": "^4.8.4" + "typescript": "^4.8.4", + "@vitest/coverage-c8": "^0.31.0", + "@types/testing-library__jest-dom": "^5.14.5", + "jsdom": "^22.0.0", + "vitest": "^0.31.0" }, "lint-staged": { "**/*.{js,jsx,tsx,ts,md,json}": [ diff --git a/tests/ColSpan.spec.js b/tests/ColSpan.spec.jsx similarity index 100% rename from tests/ColSpan.spec.js rename to tests/ColSpan.spec.jsx diff --git a/tests/Colgroup.spec.js b/tests/Colgroup.spec.jsx similarity index 100% rename from tests/Colgroup.spec.js rename to tests/Colgroup.spec.jsx index 1b88224f6..e112721a6 100644 --- a/tests/Colgroup.spec.js +++ b/tests/Colgroup.spec.jsx @@ -1,5 +1,5 @@ -import React from 'react'; import { mount } from 'enzyme'; +import React from 'react'; import Table, { INTERNAL_COL_DEFINE } from '../src'; describe('Table.ColGroup', () => { diff --git a/tests/Deprecated.spec.js b/tests/Deprecated.spec.jsx similarity index 90% rename from tests/Deprecated.spec.js rename to tests/Deprecated.spec.jsx index 12cb00988..274c6b546 100644 --- a/tests/Deprecated.spec.js +++ b/tests/Deprecated.spec.jsx @@ -1,13 +1,13 @@ -import React from 'react'; import { mount } from 'enzyme'; import { resetWarned } from 'rc-util/lib/warning'; +import React from 'react'; import Table from '../src'; describe('Table.Deprecated', () => { let errorSpy; beforeAll(() => { - errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); }); beforeEach(() => { @@ -34,7 +34,7 @@ describe('Table.Deprecated', () => { removedProp => { it(`warning for '${removedProp}'`, () => { const props = { - [removedProp]: jest.fn(), + [removedProp]: vi.fn(), }; mount(); diff --git a/tests/ExpandRow.spec.js b/tests/ExpandRow.spec.jsx similarity index 96% rename from tests/ExpandRow.spec.js rename to tests/ExpandRow.spec.jsx index 7dbb9593d..0fd701f7f 100644 --- a/tests/ExpandRow.spec.js +++ b/tests/ExpandRow.spec.jsx @@ -1,8 +1,8 @@ -import React from 'react'; import { mount } from 'enzyme'; -import { act } from 'react-dom/test-utils'; -import { resetWarned } from 'rc-util/lib/warning'; import { spyElementPrototype } from 'rc-util/lib/test/domHook'; +import { resetWarned } from 'rc-util/lib/warning'; +import React from 'react'; +import { act } from 'react-dom/test-utils'; import Table from '../src'; describe('Table.Expand', () => { @@ -22,7 +22,7 @@ describe('Table.Expand', () => { it('renders expand row correctly', () => { resetWarned(); - const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount(createTable({ expandedRowRender })); expect(wrapper.find('tbody tr')).toHaveLength(2); expect(errorSpy).toHaveBeenCalledWith( @@ -32,7 +32,7 @@ describe('Table.Expand', () => { }); it('pass proper parameters to expandedRowRender', () => { - const rowRender = jest.fn(() =>
expanded row
); + const rowRender = vi.fn(() =>
expanded row
); const expandableProps = props => ({ expandable: { expandedRowRender: rowRender, ...props } }); const wrapper = mount(createTable(expandableProps())); wrapper.setProps(expandableProps({ expandedRowKeys: [0] })); @@ -232,7 +232,7 @@ describe('Table.Expand', () => { describe('config expand column index', () => { it('not show EXPAND_COLUMN if expandable is false', () => { resetWarned(); - const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount( createTable({ @@ -250,7 +250,7 @@ describe('Table.Expand', () => { it('renders expand icon to the specify column', () => { resetWarned(); - const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount( createTable({ @@ -287,7 +287,7 @@ describe('Table.Expand', () => { it('de-duplicate of EXPAND_COLUMN', () => { resetWarned(); - const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount( createTable({ @@ -400,7 +400,7 @@ describe('Table.Expand', () => { }); it('renders expend row class correctly', () => { - const expandedRowClassName = jest.fn().mockReturnValue('expand-row-test-class-name'); + const expandedRowClassName = vi.fn().mockReturnValue('expand-row-test-class-name'); const wrapper = mount( createTable({ expandable: { @@ -431,7 +431,7 @@ describe('Table.Expand', () => { }); it('fires expand change event', () => { - const onExpand = jest.fn(); + const onExpand = vi.fn(); const wrapper = mount( createTable({ expandable: { @@ -448,7 +448,7 @@ describe('Table.Expand', () => { }); it('fires onExpandedRowsChange event', () => { - const onExpandedRowsChange = jest.fn(); + const onExpandedRowsChange = vi.fn(); const wrapper = mount( createTable({ expandedRowRender, @@ -473,7 +473,7 @@ describe('Table.Expand', () => { }); it('expandRowByClick', () => { - const onExpand = jest.fn(); + const onExpand = vi.fn(); const wrapper = mount( createTable({ expandable: { @@ -533,7 +533,7 @@ describe('Table.Expand', () => { // https://github.com/ant-design/ant-design/issues/23894 it('should be collapsible when use `expandIcon` & `expandRowByClick`', () => { const data = [{ key: 0, name: 'Lucy', age: 27 }]; - const onExpand = jest.fn(); + const onExpand = vi.fn(); const wrapper = mount( createTable({ expandable: { @@ -561,7 +561,7 @@ describe('Table.Expand', () => { // https://github.com/ant-design/ant-design/issues/23894 it('should be collapsible when `expandRowByClick` without custom `expandIcon`', () => { const data = [{ key: 0, name: 'Lucy', age: 27 }]; - const onExpand = jest.fn(); + const onExpand = vi.fn(); const wrapper = mount( createTable({ expandable: { @@ -582,7 +582,7 @@ describe('Table.Expand', () => { it('should be collapsible when `expandRowByClick` with custom `expandIcon` and event.stopPropagation', () => { const data = [{ key: 0, name: 'Lucy', age: 27 }]; - const onExpand = jest.fn(); + const onExpand = vi.fn(); const wrapper = mount( createTable({ expandable: { @@ -612,7 +612,7 @@ describe('Table.Expand', () => { it('support invalid expandIcon', () => { const data = [{ key: 0, name: 'Lucy', age: 27 }]; - const onExpand = jest.fn(); + const onExpand = vi.fn(); const wrapper = mount( createTable({ expandable: { @@ -629,7 +629,7 @@ describe('Table.Expand', () => { it('warning for use `expandedRowRender` and nested table in the same time', () => { resetWarned(); - const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); mount(createTable({ expandedRowRender, data: [{ children: [] }] })); expect(errorSpy).toHaveBeenCalledWith( 'Warning: `expandedRowRender` should not use with nested Table', diff --git a/tests/FixedColumn-IE.spec.js b/tests/FixedColumn-IE.spec.jsx similarity index 95% rename from tests/FixedColumn-IE.spec.js rename to tests/FixedColumn-IE.spec.jsx index 6c3565939..feff1ca19 100644 --- a/tests/FixedColumn-IE.spec.js +++ b/tests/FixedColumn-IE.spec.jsx @@ -1,12 +1,12 @@ -import React from 'react'; import { mount } from 'enzyme'; -import { act } from 'react-dom/test-utils'; import { spyElementPrototype } from 'rc-util/lib/test/domHook'; +import React from 'react'; +import { act } from 'react-dom/test-utils'; // eslint-disable-next-line @typescript-eslint/no-unused-vars -import Table from '../src'; import RcResizeObserver from 'rc-resize-observer'; +import Table from '../src'; -jest.mock('rc-util/lib/Dom/styleChecker', () => { +vi.mock('rc-util/lib/Dom/styleChecker', () => { return { isStyleSupport: (name, val) => val !== 'sticky', }; @@ -42,7 +42,7 @@ describe('Table.FixedColumn', () => { const data = [{ a: '123', b: 'xxxxxxxx', d: 3, key: '1' }]; it('not sticky', async () => { - jest.useFakeTimers(); + vi.useFakeTimers(); const wrapper = mount(
); act(() => { @@ -59,7 +59,7 @@ describe('Table.FixedColumn', () => { }); await act(async () => { - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); diff --git a/tests/FixedColumn.spec.js b/tests/FixedColumn.spec.jsx similarity index 97% rename from tests/FixedColumn.spec.js rename to tests/FixedColumn.spec.jsx index 18eb60451..a0f7eb47a 100644 --- a/tests/FixedColumn.spec.js +++ b/tests/FixedColumn.spec.jsx @@ -3,13 +3,13 @@ import RcResizeObserver from 'rc-resize-observer'; import { spyElementPrototypes } from 'rc-util/lib/test/domHook'; import { resetWarned } from 'rc-util/lib/warning'; import { act } from 'react-dom/test-utils'; -import { safeAct } from './utils'; import Table from '../src'; +import { safeAct } from './utils'; describe('Table.FixedColumn', () => { let domSpy; beforeEach(() => { - jest.useFakeTimers(); + vi.useFakeTimers(); }); beforeAll(() => { domSpy = spyElementPrototypes(HTMLElement, { @@ -70,7 +70,7 @@ describe('Table.FixedColumn', () => { { name: 'without data', data: [] }, ].forEach(({ name, data: testData }) => { it(`${scrollName} - ${name}`, async () => { - jest.useFakeTimers(); + vi.useFakeTimers(); const wrapper = mount(
); act(() => { @@ -91,7 +91,7 @@ describe('Table.FixedColumn', () => { }); await safeAct(wrapper); expect(wrapper.render()).toMatchSnapshot(); - jest.useRealTimers(); + vi.useRealTimers(); }); }); }); @@ -107,7 +107,7 @@ describe('Table.FixedColumn', () => { scroll={{ x: 'max-content' }} />, ); - + await safeAct(wrapper); expect(wrapper.find('colgroup').render()).toMatchSnapshot(); @@ -193,7 +193,7 @@ describe('Table.FixedColumn', () => { let errorSpy; beforeAll(() => { - errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); }); beforeEach(() => { diff --git a/tests/FixedHeader.spec.js b/tests/FixedHeader.spec.jsx similarity index 95% rename from tests/FixedHeader.spec.js rename to tests/FixedHeader.spec.jsx index 842c9f45e..a4dbbfa8d 100644 --- a/tests/FixedHeader.spec.js +++ b/tests/FixedHeader.spec.jsx @@ -3,8 +3,8 @@ import RcResizeObserver from 'rc-resize-observer'; import { spyElementPrototype } from 'rc-util/lib/test/domHook'; import React from 'react'; import { act } from 'react-dom/test-utils'; -import { safeAct } from './utils'; import Table, { INTERNAL_COL_DEFINE } from '../src'; +import { safeAct } from './utils'; describe('Table.FixedHeader', () => { let domSpy; @@ -17,7 +17,7 @@ describe('Table.FixedHeader', () => { }); beforeEach(() => { - jest.useFakeTimers(); + vi.useFakeTimers(); visible = true; }); @@ -58,9 +58,9 @@ describe('Table.FixedHeader', () => { expect(wrapper.find('.rc-table-header table').props().style.visibility).toBeFalsy(); - expect(); expect(wrapper.find('colgroup col').at(0).props().style.width).toEqual(100); expect(wrapper.find('colgroup col').at(1).props().style.width).toEqual(200); + console.log(wrapper.find('colgroup col').at(1).props()); expect(wrapper.find('colgroup col').at(2).props().style.width).toEqual(0); // Update columns @@ -70,7 +70,7 @@ describe('Table.FixedHeader', () => { expect(wrapper.find('colgroup col').at(0).props().style.width).toEqual(200); expect(wrapper.find('colgroup col').at(1).props().style.width).toEqual(100); - jest.useRealTimers(); + vi.useRealTimers(); }); it('INTERNAL_COL_DEFINE', async () => { @@ -121,7 +121,7 @@ describe('Table.FixedHeader', () => { }} />, ); - + await safeAct(wrapper); expect(wrapper.find('.rc-table-header table').props().style).toEqual( expect.objectContaining({ visibility: null }), @@ -190,7 +190,7 @@ describe('Table.FixedHeader', () => { ]); act(() => { - jest.runAllTimers(); + vi.runAllTimers(); wrapper.update(); }); @@ -198,7 +198,7 @@ describe('Table.FixedHeader', () => { expect.objectContaining({ width: 93 }), ); - jest.useRealTimers(); + vi.useRealTimers(); }); it('do not mask as ant-table-cell-fix-left-last in nested table parent cell', async () => { @@ -247,16 +247,11 @@ describe('Table.FixedHeader', () => { name: 'Jack1', }, ]; - const wrapper = mount( -
, - ); + const wrapper = mount(
); await safeAct(wrapper); expect(wrapper.find('td').at(9).props().className).toContain('rc-table-cell-fix-left-last'); - expect(wrapper.find('th').first().props().className).not.toContain('rc-table-cell-fix-left-last'); - + expect(wrapper.find('th').first().props().className).not.toContain( + 'rc-table-cell-fix-left-last', + ); }); }); diff --git a/tests/GroupingColumns.spec.js b/tests/GroupingColumns.spec.jsx similarity index 100% rename from tests/GroupingColumns.spec.js rename to tests/GroupingColumns.spec.jsx index 2f69d74e5..7300265f7 100644 --- a/tests/GroupingColumns.spec.js +++ b/tests/GroupingColumns.spec.jsx @@ -1,5 +1,5 @@ -import React from 'react'; import { mount } from 'enzyme'; +import React from 'react'; import Table from '../src'; describe('Table with grouping columns', () => { diff --git a/tests/Hover.spec.tsx b/tests/Hover.spec.tsx index 7f49160c3..01162e7b1 100644 --- a/tests/Hover.spec.tsx +++ b/tests/Hover.spec.tsx @@ -1,7 +1,7 @@ -import React from 'react'; import { mount } from 'enzyme'; -import { resetWarned } from 'rc-util/lib/warning'; import toArray from 'rc-util/lib/Children/toArray'; +import { resetWarned } from 'rc-util/lib/warning'; +import React from 'react'; import Table from '../src'; import type { TableProps } from '../src/Table'; @@ -41,7 +41,7 @@ describe('Table.Hover', () => { it('warning if use `render` for rowSpan', () => { resetWarned(); - const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount( createTable({ diff --git a/tests/Internal.spec.js b/tests/Internal.spec.jsx similarity index 100% rename from tests/Internal.spec.js rename to tests/Internal.spec.jsx diff --git a/tests/Scroll.spec.js b/tests/Scroll.spec.jsx similarity index 91% rename from tests/Scroll.spec.js rename to tests/Scroll.spec.jsx index c5e243658..a4511d6cb 100644 --- a/tests/Scroll.spec.js +++ b/tests/Scroll.spec.jsx @@ -1,11 +1,14 @@ -import React from 'react'; import { mount } from 'enzyme'; -import { act } from 'react-dom/test-utils'; import { spyElementPrototypes } from 'rc-util/lib/test/domHook'; +import React from 'react'; +import { act } from 'react-dom/test-utils'; import Table from '../src'; describe('Table.Scroll', () => { - const data = [{ key: 'key0', name: 'Lucy' }, { key: 'key1', name: 'Jack' }]; + const data = [ + { key: 'key0', name: 'Lucy' }, + { key: 'key1', name: 'Jack' }, + ]; const createTable = props => { const columns = [{ title: 'Name', dataIndex: 'name', key: 'name' }]; @@ -36,14 +39,14 @@ describe('Table.Scroll', () => { }); it('fire scroll event', () => { - jest.useFakeTimers(); + vi.useFakeTimers(); let scrollLeft = 0; let scrollTop = 0; - const setScrollLeft = jest.fn((_, val) => { + const setScrollLeft = vi.fn((_, val) => { scrollLeft = val; }); - const setScrollTop = jest.fn((_, val) => { + const setScrollTop = vi.fn((_, val) => { scrollTop = val; }); @@ -85,7 +88,7 @@ describe('Table.Scroll', () => { />, ); - jest.runAllTimers(); + vi.runAllTimers(); // Use `onScroll` directly since simulate not support `currentTarget` act(() => { const headerDiv = wrapper.find('div.rc-table-header').instance(); @@ -96,7 +99,7 @@ describe('Table.Scroll', () => { }); headerDiv.dispatchEvent(wheelEvent); - jest.runAllTimers(); + vi.runAllTimers(); }); expect(setScrollLeft).toHaveBeenCalledWith(undefined, 10); @@ -114,11 +117,11 @@ describe('Table.Scroll', () => { }, }); }); - jest.runAllTimers(); + vi.runAllTimers(); expect(setScrollLeft).toHaveBeenCalledWith(undefined, 33); setScrollLeft.mockReset(); domSpy.mockRestore(); - jest.useRealTimers(); + vi.useRealTimers(); }); }); diff --git a/tests/Sticky.spec.js b/tests/Sticky.spec.jsx similarity index 96% rename from tests/Sticky.spec.js rename to tests/Sticky.spec.jsx index f1ccbda2c..fee181c9f 100644 --- a/tests/Sticky.spec.js +++ b/tests/Sticky.spec.jsx @@ -1,13 +1,13 @@ -import React from 'react'; -import { act } from 'react-dom/test-utils'; import { mount } from 'enzyme'; import { spyElementPrototypes } from 'rc-util/lib/test/domHook'; +import React from 'react'; +import { act } from 'react-dom/test-utils'; import Table from '../src'; import { safeAct } from './utils'; describe('Table.Sticky', () => { beforeEach(() => { - jest.useFakeTimers(); + vi.useFakeTimers(); }); it('Sticky Header', async () => { const col1 = { dataIndex: 'light', width: 100 }; @@ -53,7 +53,7 @@ describe('Table.Sticky', () => { top: 10, }); - jest.useRealTimers(); + vi.useRealTimers(); }); it('Sticky scroll', async () => { @@ -120,10 +120,11 @@ describe('Table.Sticky', () => { ); await act(async () => { - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); }); + console.log(wrapper.find('.rc-table-sticky-scroll').get(0), 'shouldUndefined'); expect(wrapper.find('.rc-table-sticky-scroll').get(0)).not.toBeUndefined(); const oldInnerHeight = global.innerHeight; @@ -133,7 +134,7 @@ describe('Table.Sticky', () => { await act(async () => { global.dispatchEvent(resizeEvent); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); @@ -143,12 +144,12 @@ describe('Table.Sticky', () => { await act(async () => { global.innerHeight = oldInnerHeight; global.dispatchEvent(resizeEvent); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); - const mockFn = jest.fn(); + const mockFn = vi.fn(); wrapper .find('.rc-table-sticky-scroll-bar') @@ -165,7 +166,7 @@ describe('Table.Sticky', () => { await act(async () => { document.body.dispatchEvent(mousemoveEvent); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); @@ -179,7 +180,7 @@ describe('Table.Sticky', () => { mousemoveEvent.pageX = -50; document.body.dispatchEvent(mousemoveEvent); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); @@ -193,7 +194,7 @@ describe('Table.Sticky', () => { mousemoveEvent.buttons = 0; document.body.dispatchEvent(mousemoveEvent); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); @@ -209,11 +210,10 @@ describe('Table.Sticky', () => { window.pageYOffset = 0; mockFn.mockRestore(); domSpy.mockRestore(); - jest.useRealTimers(); + vi.useRealTimers(); }); it('Sticky Header with border classname', async () => { - const TableDemo = props => { return (
{ }); expect(wrapper.find('.rc-table-cell-fix-sticky')).not.toBe(undefined); - jest.useRealTimers(); + vi.useRealTimers(); }); it('Sticky Header with scroll-y', async () => { - const TableDemo = props => { return (
{ right: 15, }); - jest.useRealTimers(); + vi.useRealTimers(); }); it('Sticky scroll with getContainer', async () => { - window.pageYOffset = 900; document.documentElement.scrollTop = 200; const container = document.createElement('ol'); @@ -393,7 +391,7 @@ describe('Table.Sticky', () => { ); await act(async () => { - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); }); @@ -405,7 +403,7 @@ describe('Table.Sticky', () => { transform: 'translate3d(0px, 0, 0)', }); - const mockFn = jest.fn(); + const mockFn = vi.fn(); wrapper .find('.rc-table-sticky-scroll-bar') @@ -420,7 +418,7 @@ describe('Table.Sticky', () => { await act(async () => { document.body.dispatchEvent(mousemoveEvent); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); @@ -436,6 +434,6 @@ describe('Table.Sticky', () => { domSpy.mockRestore(); sectionSpy.mockRestore(); mockFn.mockRestore(); - jest.useRealTimers(); + vi.useRealTimers(); }); }); diff --git a/tests/Summary.spec.tsx b/tests/Summary.spec.tsx index 826a80c64..61d9b9a6c 100644 --- a/tests/Summary.spec.tsx +++ b/tests/Summary.spec.tsx @@ -54,7 +54,7 @@ describe('Table.Summary', () => { }); it('summary row click', async () => { - const onClick = jest.fn(); + const onClick = vi.fn(); const wrapper = mount(
{ describe('dataIndex', () => { it("pass record to render when it's falsy", () => { [null, undefined, '', []].forEach(dataIndex => { - const cellRender = jest.fn(); + const cellRender = vi.fn(); const columns = [ { title: 'Name', @@ -504,7 +504,7 @@ describe('Table.Basic', () => { }); it('shows error if no rowKey specify', () => { - const spy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const spy = vi.spyOn(console, 'error').mockImplementation(() => {}); const localData = [{ name: 'Lucy' }, { name: 'Jack' }]; mount(createTable({ data: localData })); expect(spy.mock.calls[0][0]).toMatch( @@ -595,7 +595,7 @@ describe('Table.Basic', () => { }); it('renders onHeaderRow correctly', () => { - const onHeaderRow = jest.fn((columns, index) => ({ + const onHeaderRow = vi.fn((columns, index) => ({ id: `header-row-${index}`, })); const wrapper = mount(createTable({ onHeaderRow })); @@ -666,7 +666,7 @@ describe('Table.Basic', () => { describe('scroll content', () => { it('with scroll', () => { resetWarned(); - const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount( createTable({ columns: [{ dataIndex: 'a' }, { dataIndex: 'b', width: 903 }], @@ -686,7 +686,7 @@ describe('Table.Basic', () => { it('without scroll', () => { resetWarned(); - const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); mount( createTable({ components: { @@ -703,7 +703,7 @@ describe('Table.Basic', () => { it('without warning - columns is empty', () => { resetWarned(); - const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {}); mount( createTable({ columns: [], @@ -775,7 +775,7 @@ describe('Table.Basic', () => { let spy; beforeAll(() => { - spy = jest.spyOn(console, 'error').mockImplementation(() => {}); + spy = vi.spyOn(console, 'error').mockImplementation(() => {}); }); afterEach(() => { @@ -787,7 +787,7 @@ describe('Table.Basic', () => { }); it('fires row click event', () => { - const onClick = jest.fn(); + const onClick = vi.fn(); const wrapper = mount(createTable({ onRow: () => ({ onClick }) })); const tr = wrapper.find('tbody tr').first(); @@ -800,7 +800,7 @@ describe('Table.Basic', () => { }); it('fires double row click event', () => { - const onDoubleClick = jest.fn(); + const onDoubleClick = vi.fn(); const wrapper = mount(createTable({ onRow: () => ({ onDoubleClick }) })); const tr = wrapper.find('tbody tr').first(); @@ -813,7 +813,7 @@ describe('Table.Basic', () => { }); it('fires row contextmenu event', () => { - const onContextMenu = jest.fn(); + const onContextMenu = vi.fn(); const wrapper = mount(createTable({ onRow: () => ({ onContextMenu }) })); const tr = wrapper.find('tbody tr').first(); @@ -826,7 +826,7 @@ describe('Table.Basic', () => { }); it('fires onRowMouseEnter', () => { - const onMouseEnter = jest.fn(); + const onMouseEnter = vi.fn(); const wrapper = mount( createTable({ onRow: () => ({ onMouseEnter }), @@ -844,7 +844,7 @@ describe('Table.Basic', () => { }); it('fires onRowMouseLeave', () => { - const onMouseLeave = jest.fn(); + const onMouseLeave = vi.fn(); const wrapper = mount( createTable({ onRow: () => ({ onMouseLeave }), @@ -1055,7 +1055,7 @@ describe('Table.Basic', () => { }); it('not block nest children', () => { - const onExpandedRowsChange = jest.fn(); + const onExpandedRowsChange = vi.fn(); const wrapper = mount(
-
-
-
- - - - - - - - - - - - - - - - - - - - - -
- Name - - Age -
- - - Lucy - - 27 -
- - - Jim - - 1 -
- - - Jack - - 28 -
- - - -`; - -exports[`Table.Expand does not crash if scroll is not set 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - Name - - Age - - Gender -
- - - Lucy - - 27 - - F -
- - - Jack - - 28 - - M -
-
-
-
-`; - -exports[`Table.Expand does not crash if scroll is not set 2`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - Name - - Age - - Gender -
- - - Lucy - - 27 - - F -
- - - Jack - - 28 - - M -
-
-
-
-`; - -exports[`Table.Expand not use nest when children is invalidate 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - -
- Name - - Age -
- Jack - - 28 -
- Jack - - 28 -
- Jack - - 28 -
-
-
-
-`; - -exports[`Table.Expand renders fixed column correctly work 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - Name - - Age - - Gender -
- - - Lucy - - 27 - - F -
-
-

- extra data -

-
-
- - - Jack - - 28 - - M -
-
-

- extra data -

-
-
-
-
-
-`; - -exports[`Table.Expand renders tree row correctly 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - -
- Name - - Age -
- - - Lucy - - 27 -
- - - Jim - - 1 -
- - - Jack - - 28 -
-
-
-
-`; - -exports[`Table.Expand renders tree row correctly with different children 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Name - - Age -
- - - Lucy - - 27 -
- - - Jack - - 28 -
- - - Jack - - 28 -
- - - Jack - - 28 -
- - - Jack - - 28 -
- - - Jack - - 28 -
-
-
-
-`; - -exports[`Table.Expand work in expandable fix 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - Name - - Age - - Gender -
- - - Lucy - - 27 - - F -
- - - Jack - - 28 - - M -
-
-
-
-`; - -exports[`Table.Expand work in expandable fix 2`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Name - - Age - - Gender - -
- Lucy - - 27 - - F - - -
- Jack - - 28 - - M - - -
-
-
-
-`; diff --git a/tests/__snapshots__/ExpandRow.spec.jsx.snap b/tests/__snapshots__/ExpandRow.spec.jsx.snap new file mode 100644 index 000000000..96f841d8f --- /dev/null +++ b/tests/__snapshots__/ExpandRow.spec.jsx.snap @@ -0,0 +1,1554 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`Table.Expand > childrenColumnName 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + +
+ Name + + Age +
+ + + Lucy + + 27 +
+ + + Jim + + 1 +
+ + + Jack + + 28 +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > does not crash if scroll is not set 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + Name + + Age + + Gender +
+ + + Lucy + + 27 + + F +
+ + + Jack + + 28 + + M +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > does not crash if scroll is not set 2`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + Name + + Age + + Gender +
+ + + Lucy + + 27 + + F +
+ + + Jack + + 28 + + M +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > not use nest when children is invalidate 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + +
+ Name + + Age +
+ Jack + + 28 +
+ Jack + + 28 +
+ Jack + + 28 +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > renders fixed column correctly > work 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + Name + + Age + + Gender +
+ + + Lucy + + 27 + + F +
+
+

+ extra data +

+
+
+ + + Jack + + 28 + + M +
+
+

+ extra data +

+
+
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > renders tree row correctly 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + +
+ Name + + Age +
+ + + Lucy + + 27 +
+ + + Jim + + 1 +
+ + + Jack + + 28 +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > renders tree row correctly with different children 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Name + + Age +
+ + + Lucy + + 27 +
+ + + Jack + + 28 +
+ + + Jack + + 28 +
+ + + Jack + + 28 +
+ + + Jack + + 28 +
+ + + Jack + + 28 +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > work in expandable fix 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + Name + + Age + + Gender +
+ + + Lucy + + 27 + + F +
+ + + Jack + + 28 + + M +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Expand > work in expandable fix 2`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Name + + Age + + Gender + +
+ Lucy + + 27 + + F + + +
+ Jack + + 28 + + M + + +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; diff --git a/tests/__snapshots__/FixedColumn.spec.js.snap b/tests/__snapshots__/FixedColumn.spec.js.snap deleted file mode 100644 index 99648e662..000000000 --- a/tests/__snapshots__/FixedColumn.spec.js.snap +++ /dev/null @@ -1,2965 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Table.FixedColumn fixed column renders correctly RTL 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- title1 - - title2 - - title3 - - title4 - - title5 - - title6 - - title7 - - title8 - - title9 - - title10 - - title11 - - title12 -
- 123 - - - 1111 - - - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx -
- cdd - - - 1111 - - - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
- 133 - - - 1111 - - - edd12221 - - - - - - - - - -
-
-
-
-`; - -exports[`Table.FixedColumn renders correctly all column has width should use it 1`] = ` - - - - -`; - -exports[`Table.FixedColumn renders correctly scrollX - with data 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- title1 - - - title2 - - - title3 - - title4 - - title5 - - title6 - - title7 - - title8 - - title9 - - title10 - - title11 - - title12 -
- 123 - - - - 1111 - - - - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx -
- cdd - - - - 1111 - - - - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
-
-
-
-`; - -exports[`Table.FixedColumn renders correctly scrollX - without data 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- title1 - - - title2 - - - title3 - - title4 - - title5 - - title6 - - title7 - - title8 - - title9 - - title10 - - title11 - - title12 -
-
- No Data -
-
-
-
-
-`; - -exports[`Table.FixedColumn renders correctly scrollXY - with data 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- title1 - - - title2 - - - title3 - - title4 - - title5 - - title6 - - title7 - - title8 - - title9 - - title10 - - title11 - - title12 - -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- 123 - - - - 1111 - - - - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx - - xxxxxxxx -
- cdd - - - - 1111 - - - - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 - - edd12221 -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
- 133 - - - - 1111 - - - - edd12221 - - - - - - - - - -
-
-
-
-`; - -exports[`Table.FixedColumn renders correctly scrollXY - without data 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- title1 - - - title2 - - - title3 - - title4 - - title5 - - title6 - - title7 - - title8 - - title9 - - title10 - - title11 - - title12 - -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
- No Data -
-
-
-
-
-`; diff --git a/tests/__snapshots__/FixedColumn.spec.jsx.snap b/tests/__snapshots__/FixedColumn.spec.jsx.snap new file mode 100644 index 000000000..1fe978969 --- /dev/null +++ b/tests/__snapshots__/FixedColumn.spec.jsx.snap @@ -0,0 +1,3145 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`Table.FixedColumn > fixed column renders correctly RTL 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ title1 + + title2 + + title3 + + title4 + + title5 + + title6 + + title7 + + title8 + + title9 + + title10 + + title11 + + title12 +
+ 123 + + + 1111 + + + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx +
+ cdd + + + 1111 + + + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+ 133 + + + 1111 + + + edd12221 + + + + + + + + + +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.FixedColumn > renders correctly > all column has width should use it 1`] = ` +LoadedCheerio { + "0": + + + , + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.FixedColumn > renders correctly > scrollX - with data 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ title1 + + + title2 + + + title3 + + title4 + + title5 + + title6 + + title7 + + title8 + + title9 + + title10 + + title11 + + title12 +
+ 123 + + + + 1111 + + + + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx +
+ cdd + + + + 1111 + + + + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.FixedColumn > renders correctly > scrollX - without data 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ title1 + + + title2 + + + title3 + + title4 + + title5 + + title6 + + title7 + + title8 + + title9 + + title10 + + title11 + + title12 +
+
+ No Data +
+
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.FixedColumn > renders correctly > scrollXY - with data 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ title1 + + + title2 + + + title3 + + title4 + + title5 + + title6 + + title7 + + title8 + + title9 + + title10 + + title11 + + title12 + +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ 123 + + + + 1111 + + + + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx + + xxxxxxxx +
+ cdd + + + + 1111 + + + + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 + + edd12221 +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+ 133 + + + + 1111 + + + + edd12221 + + + + + + + + + +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.FixedColumn > renders correctly > scrollXY - without data 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ title1 + + + title2 + + + title3 + + title4 + + title5 + + title6 + + title7 + + title8 + + title9 + + title10 + + title11 + + title12 + +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ No Data +
+
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; diff --git a/tests/__snapshots__/Summary.spec.tsx.snap b/tests/__snapshots__/Summary.spec.tsx.snap index e72a20741..40aec2575 100644 --- a/tests/__snapshots__/Summary.spec.tsx.snap +++ b/tests/__snapshots__/Summary.spec.tsx.snap @@ -1,28 +1,58 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`Table.Summary support data type 1`] = ` - - - - Light - - - Bamboo - - - 112.5 - - - +exports[`Table.Summary > support data type 1`] = ` +LoadedCheerio { + "0": + + + Light + + + Bamboo + + + 112.5 + + + , + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} `; diff --git a/tests/__snapshots__/Table.spec.js.snap b/tests/__snapshots__/Table.spec.js.snap deleted file mode 100644 index 13d03fd8c..000000000 --- a/tests/__snapshots__/Table.spec.js.snap +++ /dev/null @@ -1,918 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Table.Basic columns support JSX condition 1`] = ` -[ - , -
-
-
- - - - - - - - - - - - - - - - - - -
- title - - title3 -
- 2 - - 3 -
- 2 - - 3 -
-
-
-
, -] -`; - -exports[`Table.Basic custom components renders correctly 1`] = ` -
-
-
- - - - - - - - - - - - - - - -
- Name -
- Lucy -
- Jack -
-
-
-
-`; - -exports[`Table.Basic custom components renders fixed column and header correctly 1`] = ` -
-
-
- - - - - - - - - -
- Name - - Age - - Gender - -
-
-
- - - - - - - - - - - - - - -
- Lucy - - 27 - - F -
-
-
-
-`; - -exports[`Table.Basic custom components scroll content with scroll 1`] = ` -
-
-
- - - - - - - - - - -
- - -
-
-

- Bamboo -

-
-
-`; - -exports[`Table.Basic internal api transformColumns basic 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - -
- before - - Name - - after -
- - Lucy - -
- - Jack - -
-
-
-
-`; - -exports[`Table.Basic renders colSpan correctly 1`] = ` -
-
-
- - - - - - - - - - - - - - - - -
- Name -
- John -
- Terry - - Garner -
-
-
-
-`; - -exports[`Table.Basic renders correctly RTL 1`] = ` -
-
-
- - - - - - - - - - - - - - - -
- Name -
- Lucy -
- Jack -
-
-
-
-`; - -exports[`Table.Basic renders correctly basic 1`] = ` -
-
-
- - - - - - - - - - - - - - - -
- Name -
- Lucy -
- Jack -
-
-
-
-`; - -exports[`Table.Basic renders correctly column children undefined 1`] = ` -
-
-
- - - - - - - - - - - - - - - - -
- 姓名 - - 年龄 -
- Lucy - -
- Jack - -
-
-
-
-`; - -exports[`Table.Basic renders correctly falsy columns 1`] = ` -
-
-
- - - - - - - - - - - - - - - -
- 姓名 -
- Lucy -
- Jack -
-
-
-
-`; - -exports[`Table.Basic renders correctly no columns 1`] = ` -
-
-
- - - - - - - - - - - - -
-
-
-
-
-
-
-`; - -exports[`Table.Basic renders rowSpan correctly 1`] = ` -
-
-
- - - - - - - - - - - - - - - - - -
- First Name - - Last Name -
- John - - Doe -
- Terry -
-
-
-
-`; - -exports[`Table.Basic should get scrollbar size 1`] = ` -
-
-
- - - - - - - - - - -
- Name - -
-
-
-
-`; - -exports[`Table.Basic syntactic sugar 1`] = ` -
-
-
- - - - - - - - - - - - - - - -
- total -
- Name -
- No Data -
-
-
-
-`; diff --git a/tests/__snapshots__/Table.spec.jsx.snap b/tests/__snapshots__/Table.spec.jsx.snap new file mode 100644 index 000000000..ba16fd958 --- /dev/null +++ b/tests/__snapshots__/Table.spec.jsx.snap @@ -0,0 +1,1319 @@ +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html + +exports[`Table.Basic > columns support JSX condition 1`] = ` +LoadedCheerio { + "0": , + "1":
+
+
+ + + + + + + + + + + + + + + + + + +
+ title + + title3 +
+ 2 + + 3 +
+ 2 + + 3 +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 2, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > custom components > renders correctly 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + +
+ Name +
+ Lucy +
+ Jack +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > custom components > renders fixed column and header correctly 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + +
+ Name + + Age + + Gender +
+
+
+ + + + + + + + + + + + + + +
+ Lucy + + 27 + + F +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > custom components > scroll content > with scroll 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + +
+ +
+
+

+ Bamboo +

+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > internal api > transformColumns > basic 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + +
+ before + + Name + + after +
+ + Lucy + +
+ + Jack + +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders colSpan correctly 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + +
+ Name +
+ John +
+ Terry + + Garner +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders correctly > RTL 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + +
+ Name +
+ Lucy +
+ Jack +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders correctly > basic 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + +
+ Name +
+ Lucy +
+ Jack +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders correctly > column children undefined 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + +
+ 姓名 + + 年龄 +
+ Lucy + +
+ Jack + +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders correctly > falsy columns 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + +
+ 姓名 +
+ Lucy +
+ Jack +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders correctly > no columns 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + +
+
+
+
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > renders rowSpan correctly 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + + + +
+ First Name + + Last Name +
+ John + + Doe +
+ Terry +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > should get scrollbar size 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + +
+ Name +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; + +exports[`Table.Basic > syntactic sugar 1`] = ` +LoadedCheerio { + "0":
+
+
+ + + + + + + + + + + + + + + +
+ total +
+ Name +
+ No Data +
+
+
+
, + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} +`; diff --git a/tests/setup.js b/tests/setup.js deleted file mode 100644 index 154da504f..000000000 --- a/tests/setup.js +++ /dev/null @@ -1,7 +0,0 @@ -global.requestAnimationFrame = cb => setTimeout(cb, 0); -require('regenerator-runtime'); - -const Enzyme = require('enzyme'); -const Adapter = require('enzyme-adapter-react-16'); - -Enzyme.configure({ adapter: new Adapter() }); diff --git a/tests/setup.ts b/tests/setup.ts new file mode 100644 index 000000000..cd26964fc --- /dev/null +++ b/tests/setup.ts @@ -0,0 +1,21 @@ +import type { TestingLibraryMatchers } from '@testing-library/jest-dom/matchers'; +import matchers from '@testing-library/jest-dom/matchers'; +import { expect } from 'vitest'; + +declare module 'vitest' { + interface Assertion extends jest.Matchers, TestingLibraryMatchers {} +} + +expect.extend(matchers); + +// https://github.com/nickcolley/jest-axe/issues/147#issuecomment-758804533 +const { getComputedStyle } = window; +window.getComputedStyle = elt => getComputedStyle(elt); + +global.requestAnimationFrame = cb => setTimeout(cb, 0); +require('regenerator-runtime'); + +const Enzyme = require('enzyme'); +const Adapter = require('enzyme-adapter-react-16'); + +Enzyme.configure({ adapter: new Adapter() }); diff --git a/tests/utils.js b/tests/utils.js index 8b6660ee0..ca13e158d 100644 --- a/tests/utils.js +++ b/tests/utils.js @@ -3,7 +3,7 @@ import { act } from 'react-dom/test-utils'; export function safeAct(wrapper, cb) { return act(async () => { cb && cb(); - jest.runAllTimers(); + vi.runAllTimers(); await Promise.resolve(); wrapper.update(); }); diff --git a/tsconfig.json b/tsconfig.json index 32b01dddc..857021e22 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -11,7 +11,8 @@ "@/*": ["src/*"], "@@/*": [".dumi/tmp/*"], "rc-table": ["src/index.ts"] - } + }, + "types": ["vitest/globals"] }, "include": [".dumi/**/*", ".dumirc.ts", "**/*.ts", "**/*.tsx"] } diff --git a/typings.d.ts b/typings.d.ts index 71e0e9f4c..8f41f6c9c 100644 --- a/typings.d.ts +++ b/typings.d.ts @@ -1,2 +1,3 @@ declare module '*.css'; declare module '*.less'; +// declare module 'enzyme-to-json/serializer'; diff --git a/vitest.config.ts b/vitest.config.ts new file mode 100644 index 000000000..a61325b92 --- /dev/null +++ b/vitest.config.ts @@ -0,0 +1,13 @@ +import { defineConfig } from 'vitest/config'; + +export default defineConfig({ + esbuild: { + jsx: 'automatic', + }, + test: { + include: ['**/tests/*.spec.*'], + globals: true, + setupFiles: './tests/setup.ts', + environment: 'jsdom', + }, +}); From 5bf696666e8103991e4d566366db0ee72b96aa09 Mon Sep 17 00:00:00 2001 From: Dunqing Date: Sat, 6 May 2023 16:45:19 +0800 Subject: [PATCH 02/11] fix: should get scrollbar size --- tests/Table.spec.jsx | 8 +++--- tests/__snapshots__/Table.spec.jsx.snap | 36 +++---------------------- 2 files changed, 9 insertions(+), 35 deletions(-) diff --git a/tests/Table.spec.jsx b/tests/Table.spec.jsx index 31611e7c1..bb233073a 100644 --- a/tests/Table.spec.jsx +++ b/tests/Table.spec.jsx @@ -1,3 +1,4 @@ +import { render } from '@testing-library/react'; import { mount } from 'enzyme'; import { resetWarned } from 'rc-util/lib/warning'; import React from 'react'; @@ -1159,7 +1160,8 @@ describe('Table.Basic', () => { }); it('should get scrollbar size', () => { const tColumns = [{ title: 'Name', dataIndex: 'name', key: 'name', width: 100 }]; - const wrapper = mount( + + const { container } = render( createTable({ columns: tColumns, scroll: { y: 100 }, @@ -1168,8 +1170,8 @@ describe('Table.Basic', () => { }, }), ); - expect(wrapper.render()).toMatchSnapshot(); - expect(wrapper.find('col')).toHaveLength(tColumns.length + 1); + expect(container).toMatchSnapshot(); + expect(container.getElementsByTagName('col')).toHaveLength(tColumns.length); }); it('columns support JSX condition', () => { const Example = () => { diff --git a/tests/__snapshots__/Table.spec.jsx.snap b/tests/__snapshots__/Table.spec.jsx.snap index ba16fd958..43146dd0e 100644 --- a/tests/__snapshots__/Table.spec.jsx.snap +++ b/tests/__snapshots__/Table.spec.jsx.snap @@ -1169,8 +1169,8 @@ LoadedCheerio { `; exports[`Table.Basic > should get scrollbar size 1`] = ` -LoadedCheerio { - "0":
+
-
, - "_root": LoadedCheerio { - "0": Document { - "children": [ - - - - , - ], - "endIndex": null, - "next": null, - "parent": null, - "prev": null, - "startIndex": null, - "type": "root", - "x-mode": "quirks", - }, - "_root": [Circular], - "length": 1, - "options": { - "decodeEntities": true, - "xml": false, - }, - }, - "length": 1, - "options": { - "decodeEntities": true, - "xml": false, - }, -} + + `; exports[`Table.Basic > syntactic sugar 1`] = ` From 97b071e954188f4ce43c21a4700720b4405e943e Mon Sep 17 00:00:00 2001 From: Dunqing Date: Sat, 6 May 2023 18:33:58 +0800 Subject: [PATCH 03/11] fix: Sticky scroll with getContainer --- tests/Sticky.spec.jsx | 58 +++++++++++++++++++++---------------------- 1 file changed, 28 insertions(+), 30 deletions(-) diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index fee181c9f..33c258a6c 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -1,7 +1,9 @@ +import { createEvent, fireEvent, render } from '@testing-library/react'; import { mount } from 'enzyme'; import { spyElementPrototypes } from 'rc-util/lib/test/domHook'; import React from 'react'; import { act } from 'react-dom/test-utils'; +import { vi } from 'vitest'; import Table from '../src'; import { safeAct } from './utils'; @@ -124,7 +126,6 @@ describe('Table.Sticky', () => { await Promise.resolve(); }); - console.log(wrapper.find('.rc-table-sticky-scroll').get(0), 'shouldUndefined'); expect(wrapper.find('.rc-table-sticky-scroll').get(0)).not.toBeUndefined(); const oldInnerHeight = global.innerHeight; @@ -155,6 +156,8 @@ describe('Table.Sticky', () => { .find('.rc-table-sticky-scroll-bar') .simulate('mousedown', { persist: mockFn, preventDefault: mockFn, pageX: 0 }); + console.log(mockFn.mock.calls); + expect(mockFn).toHaveBeenCalledTimes(2); expect(wrapper.find('.rc-table-sticky-scroll-bar-active').length).toBe(1); @@ -298,9 +301,10 @@ describe('Table.Sticky', () => { it('Sticky scroll with getContainer', async () => { window.pageYOffset = 900; document.documentElement.scrollTop = 200; - const container = document.createElement('ol'); - container.style = 'height: 500px;overflow: scroll'; - document.body.appendChild(container); + const ol = document.createElement('ol'); + ol.style = 'height: 500px;overflow: scroll'; + document.body.appendChild(ol); + let scrollLeft = 100; const domSpy = spyElementPrototypes(HTMLDivElement, { scrollLeft: { @@ -349,7 +353,7 @@ describe('Table.Sticky', () => { const col1 = { dataIndex: 'light', width: 1000 }; const col2 = { dataIndex: 'bamboo', width: 2000 }; - const wrapper = mount( + const { container, unmount } = render( { x: 10000, }} sticky={{ - getContainer: () => container, + getContainer: () => ol, }} />, { - attachTo: container, + container: ol, }, ); - await act(async () => { + await act(() => { vi.runAllTimers(); - await Promise.resolve(); }); - expect(wrapper.find('.rc-table-sticky-scroll').get(0)).toBeTruthy(); - expect(wrapper.find('.rc-table-sticky-scroll-bar').get(0)).toBeTruthy(); - - expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ + expect(container.querySelector('.rc-table-sticky-scroll')).toBeTruthy(); + expect(container.querySelector('.rc-table-sticky-scroll-bar')).toBeTruthy(); + expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ width: '50px', - transform: 'translate3d(0px, 0, 0)', + transform: 'translate3d(50px, 0, 0)', }); const mockFn = vi.fn(); + const node = container.querySelector('.rc-table-sticky-scroll-bar'); + const event = createEvent.mouseDown(node); + event.preventDefault = mockFn; + fireEvent(node, event); - wrapper - .find('.rc-table-sticky-scroll-bar') - .simulate('mousedown', { persist: mockFn, preventDefault: mockFn, pageX: 0 }); - - expect(mockFn).toHaveBeenCalledTimes(2); + expect(mockFn).toHaveBeenCalledTimes(1); - const mousemoveEvent = new Event('mousemove'); - - mousemoveEvent.buttons = 1; - mousemoveEvent.pageX = 50; - - await act(async () => { - document.body.dispatchEvent(mousemoveEvent); + await act(() => { + fireEvent.mouseMove(container, { + buttons: 1, + pageX: 50, + }); vi.runAllTimers(); - await Promise.resolve(); - wrapper.update(); }); - expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ + expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ width: '50px', transform: 'translate3d(50.5px, 0, 0)', }); - wrapper.unmount(); + unmount(); window.pageYOffset = 0; domSpy.mockRestore(); From 7c3c9e41017a6a6df567a87c2550591e5d695668 Mon Sep 17 00:00:00 2001 From: Dunqing Date: Sat, 6 May 2023 20:16:47 +0800 Subject: [PATCH 04/11] fix: sticky.spec.jsx tests --- tests/Sticky.spec.jsx | 98 +++++++++++++++++++------------------------ 1 file changed, 44 insertions(+), 54 deletions(-) diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index 33c258a6c..ae095b291 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -85,7 +85,7 @@ describe('Table.Sticky', () => { const col1 = { dataIndex: 'light', width: 1000 }; const col2 = { dataIndex: 'bamboo', width: 2000 }; - const wrapper = mount( + const { container, unmount } = render(
{ />, ); - await act(async () => { + await act(() => { vi.runAllTimers(); - await Promise.resolve(); }); - expect(wrapper.find('.rc-table-sticky-scroll').get(0)).not.toBeUndefined(); + expect(container.querySelector('.rc-table-sticky-scroll')).toBeTruthy(); + // const oldInnerHeight = document.body.innerHeight; const oldInnerHeight = global.innerHeight; const resizeEvent = new Event('resize'); global.innerHeight = 10000; - await act(async () => { + await act(() => { global.dispatchEvent(resizeEvent); vi.runAllTimers(); - await Promise.resolve(); - wrapper.update(); }); - expect(wrapper.find('.rc-table-sticky-scroll').get(0)).toBeFalsy(); + expect(container.querySelector('.rc-table-sticky-scroll')).toBeNull(); - await act(async () => { + await act(() => { global.innerHeight = oldInnerHeight; global.dispatchEvent(resizeEvent); vi.runAllTimers(); - await Promise.resolve(); - wrapper.update(); }); const mockFn = vi.fn(); + const node = container.querySelector('.rc-table-sticky-scroll-bar'); + const event = createEvent.mouseDown(node, { clientX: 0 }); + event.preventDefault = mockFn; + fireEvent(node, event); - wrapper - .find('.rc-table-sticky-scroll-bar') - .simulate('mousedown', { persist: mockFn, preventDefault: mockFn, pageX: 0 }); - - console.log(mockFn.mock.calls); - - expect(mockFn).toHaveBeenCalledTimes(2); - - expect(wrapper.find('.rc-table-sticky-scroll-bar-active').length).toBe(1); - - const mousemoveEvent = new Event('mousemove'); + expect(mockFn).toHaveBeenCalledTimes(1); - mousemoveEvent.buttons = 1; - mousemoveEvent.pageX = 50; + expect(container.querySelector('.rc-table-sticky-scroll-bar-active')).toBeTruthy(); - await act(async () => { - document.body.dispatchEvent(mousemoveEvent); + await act(() => { + fireEvent.mouseMove(container, { + buttons: 1, + clientX: 50, + }); vi.runAllTimers(); - await Promise.resolve(); - wrapper.update(); }); - expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ + expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ width: '50px', transform: 'translate3d(50.5px, 0, 0)', }); - await act(async () => { - mousemoveEvent.pageX = -50; - document.body.dispatchEvent(mousemoveEvent); - + await act(() => { + fireEvent.mouseMove(container, { + buttons: 1, + clientX: -50, + }); vi.runAllTimers(); - await Promise.resolve(); - wrapper.update(); }); - expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ + expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ width: '50px', transform: 'translate3d(0px, 0, 0)', }); - await act(async () => { - mousemoveEvent.buttons = 0; - document.body.dispatchEvent(mousemoveEvent); - + await act(() => { + fireEvent.mouseMove(container, { + buttons: 0, + clientX: -50, + }); vi.runAllTimers(); - await Promise.resolve(); - wrapper.update(); }); - expect(wrapper.find('.rc-table-sticky-scroll-bar-active').length).toBe(0); + expect(container.querySelector('.rc-table-sticky-scroll-bar-active')).toBeFalsy(); - const mouseupEvent = new Event('mouseup'); + fireEvent.mouseUp(container); - document.body.dispatchEvent(mouseupEvent); - - wrapper.unmount(); + unmount(); window.pageYOffset = 0; mockFn.mockRestore(); @@ -286,13 +272,17 @@ describe('Table.Sticky', () => { ); }; - const wrapper = mount(); - await safeAct(wrapper); + const { container } = render(); + + await act(() => { + vi.runAllTimers(); + }); + expect( - wrapper.find('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').prop('style'), - ).toEqual({ + container.querySelector('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').style, + ).toContain({ position: 'sticky', - right: 15, + right: '0px', }); vi.useRealTimers(); @@ -407,7 +397,7 @@ describe('Table.Sticky', () => { const mockFn = vi.fn(); const node = container.querySelector('.rc-table-sticky-scroll-bar'); - const event = createEvent.mouseDown(node); + const event = createEvent.mouseDown(node, { clientX: 0 }); event.preventDefault = mockFn; fireEvent(node, event); @@ -416,7 +406,7 @@ describe('Table.Sticky', () => { await act(() => { fireEvent.mouseMove(container, { buttons: 1, - pageX: 50, + clientX: 50, }); vi.runAllTimers(); }); From 248792329720f626c86a2dfb81e7d37db8185db7 Mon Sep 17 00:00:00 2001 From: Dunqing Date: Sat, 6 May 2023 20:37:20 +0800 Subject: [PATCH 05/11] fix: FixedHeader.spec.jsx tests --- tests/FixedHeader.spec.jsx | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/tests/FixedHeader.spec.jsx b/tests/FixedHeader.spec.jsx index a4dbbfa8d..a62221c7f 100644 --- a/tests/FixedHeader.spec.jsx +++ b/tests/FixedHeader.spec.jsx @@ -58,17 +58,17 @@ describe('Table.FixedHeader', () => { expect(wrapper.find('.rc-table-header table').props().style.visibility).toBeFalsy(); - expect(wrapper.find('colgroup col').at(0).props().style.width).toEqual(100); - expect(wrapper.find('colgroup col').at(1).props().style.width).toEqual(200); - console.log(wrapper.find('colgroup col').at(1).props()); - expect(wrapper.find('colgroup col').at(2).props().style.width).toEqual(0); + expect(wrapper.find('.rc-table-body colgroup col').at(0).props().style.width).toEqual(100); + expect(wrapper.find('.rc-table-body colgroup col').at(1).props().style.width).toEqual(200); + expect(wrapper.find('.rc-table-body colgroup col')).toHaveLength(2); // Update columns - wrapper.setProps({ columns: [col2, col1] }); + wrapper.setProps({ columns: [col2, col1, { ...col3, width: 300 }] }); wrapper.update(); - expect(wrapper.find('colgroup col').at(0).props().style.width).toEqual(200); - expect(wrapper.find('colgroup col').at(1).props().style.width).toEqual(100); + expect(wrapper.find('.rc-table-body colgroup col').at(0).props().style.width).toEqual(200); + expect(wrapper.find('.rc-table-body colgroup col').at(1).props().style.width).toEqual(100); + expect(wrapper.find('.rc-table-body colgroup col').at(2).props().style.width).toEqual(300); vi.useRealTimers(); }); From bf8d97f993baaba8dbb3d6121e5b5c2ed7a00e4f Mon Sep 17 00:00:00 2001 From: Dunqing Date: Sat, 6 May 2023 20:38:35 +0800 Subject: [PATCH 06/11] fix: remove comment --- typings.d.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/typings.d.ts b/typings.d.ts index 8f41f6c9c..71e0e9f4c 100644 --- a/typings.d.ts +++ b/typings.d.ts @@ -1,3 +1,2 @@ declare module '*.css'; declare module '*.less'; -// declare module 'enzyme-to-json/serializer'; From 1f0a1ee5cf00c52214451e7c56b69d604cd0be03 Mon Sep 17 00:00:00 2001 From: Dunqing Date: Wed, 10 May 2023 15:07:56 +0800 Subject: [PATCH 07/11] fix: should use clientX --- src/stickyScrollBar.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/stickyScrollBar.tsx b/src/stickyScrollBar.tsx index 712878283..7ce191fa5 100644 --- a/src/stickyScrollBar.tsx +++ b/src/stickyScrollBar.tsx @@ -1,10 +1,10 @@ +import { useContext } from '@rc-component/context'; import classNames from 'classnames'; import addEventListener from 'rc-util/lib/Dom/addEventListener'; import { getOffset } from 'rc-util/lib/Dom/css'; import getScrollBarSize from 'rc-util/lib/getScrollBarSize'; import * as React from 'react'; import TableContext from './context/TableContext'; -import { useContext } from '@rc-component/context'; import { useLayoutState } from './hooks/useFrame'; interface StickyScrollBarProps { @@ -46,7 +46,7 @@ const StickyScrollBar: React.ForwardRefRenderFunction = event => { event.persist(); - refState.current.delta = event.pageX - scrollState.scrollLeft; + refState.current.delta = event.clientX - scrollState.scrollLeft; refState.current.x = 0; setActive(true); event.preventDefault(); @@ -63,7 +63,7 @@ const StickyScrollBar: React.ForwardRefRenderFunction { From ad6b82734539f40e36b8a77185ff6c0bd342d30a Mon Sep 17 00:00:00 2001 From: Dunqing Date: Wed, 10 May 2023 15:18:37 +0800 Subject: [PATCH 08/11] fix: remove comment --- tests/Sticky.spec.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index ae095b291..b0d42c3f2 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -127,7 +127,6 @@ describe('Table.Sticky', () => { expect(container.querySelector('.rc-table-sticky-scroll')).toBeTruthy(); - // const oldInnerHeight = document.body.innerHeight; const oldInnerHeight = global.innerHeight; const resizeEvent = new Event('resize'); From 3fbb0c3566f917ab70d0e3219c7402b1ef95cd56 Mon Sep 17 00:00:00 2001 From: Dunqing Date: Wed, 10 May 2023 20:21:38 +0800 Subject: [PATCH 09/11] feat: update tests --- .gitignore | 4 ++-- .../rc-util/lib/getScrollBarSize.ts | 1 + tests/Sticky.spec.jsx | 2 +- tests/Table.spec.jsx | 2 +- tests/__snapshots__/FixedColumn.spec.jsx.snap | 10 ++++---- tests/__snapshots__/Table.spec.jsx.snap | 23 ++++++++++++++++--- tests/setup.ts | 2 ++ 7 files changed, 32 insertions(+), 12 deletions(-) rename {tests/__mocks__ => __mocks__}/rc-util/lib/getScrollBarSize.ts (69%) diff --git a/.gitignore b/.gitignore index 2c1b5ee4b..3111e398c 100644 --- a/.gitignore +++ b/.gitignore @@ -32,7 +32,7 @@ package-lock.json es/ .storybook .doc -!tests/__mocks__/rc-util/lib +!__mocks__/rc-util/lib examples/debug.tsx .history ~* @@ -42,4 +42,4 @@ examples/debug.tsx .umi-production .umi-test .env.local -.dumi \ No newline at end of file +.dumi diff --git a/tests/__mocks__/rc-util/lib/getScrollBarSize.ts b/__mocks__/rc-util/lib/getScrollBarSize.ts similarity index 69% rename from tests/__mocks__/rc-util/lib/getScrollBarSize.ts rename to __mocks__/rc-util/lib/getScrollBarSize.ts index e967052ef..130bd9d13 100644 --- a/tests/__mocks__/rc-util/lib/getScrollBarSize.ts +++ b/__mocks__/rc-util/lib/getScrollBarSize.ts @@ -1,6 +1,7 @@ export default () => 15; export const getTargetScrollBarSize = (target: HTMLElement) => { + console.log("🚀 ~ file: getScrollBarSize.ts:4 ~ getTargetScrollBarSize ~ target:", target) if (!target || !(target instanceof Element)) { return { width: 0, height: 0 }; } diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index b0d42c3f2..e55d67b9e 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -281,7 +281,7 @@ describe('Table.Sticky', () => { container.querySelector('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').style, ).toContain({ position: 'sticky', - right: '0px', + right: '15px', }); vi.useRealTimers(); diff --git a/tests/Table.spec.jsx b/tests/Table.spec.jsx index bb233073a..e0a8ec9e0 100644 --- a/tests/Table.spec.jsx +++ b/tests/Table.spec.jsx @@ -1171,7 +1171,7 @@ describe('Table.Basic', () => { }), ); expect(container).toMatchSnapshot(); - expect(container.getElementsByTagName('col')).toHaveLength(tColumns.length); + expect(container.getElementsByTagName('col')).toHaveLength(tColumns.length + 1); }); it('columns support JSX condition', () => { const Example = () => { diff --git a/tests/__snapshots__/FixedColumn.spec.jsx.snap b/tests/__snapshots__/FixedColumn.spec.jsx.snap index 1fe978969..249dfc2ef 100644 --- a/tests/__snapshots__/FixedColumn.spec.jsx.snap +++ b/tests/__snapshots__/FixedColumn.spec.jsx.snap @@ -1981,7 +1981,7 @@ LoadedCheerio { style="width: 1000px;" /> title12 @@ -2854,7 +2854,7 @@ LoadedCheerio { style="width: 1000px;" /> title12 @@ -3102,7 +3102,7 @@ LoadedCheerio { >
No Data
diff --git a/tests/__snapshots__/Table.spec.jsx.snap b/tests/__snapshots__/Table.spec.jsx.snap index 43146dd0e..42df31d1d 100644 --- a/tests/__snapshots__/Table.spec.jsx.snap +++ b/tests/__snapshots__/Table.spec.jsx.snap @@ -243,10 +243,15 @@ LoadedCheerio { class="rc-table-cell rc-table-cell-fix-right rc-table-cell-fix-right-first" name="my-header-cell" scope="col" - style="position: sticky; right: 0px;" + style="position: sticky; right: 15px;" > Gender +
@@ -379,7 +384,10 @@ LoadedCheerio { style="width: 0px;" /> + + @@ -1185,7 +1196,10 @@ exports[`Table.Basic > should get scrollbar size 1`] = ` > + should get scrollbar size 1`] = ` > Name + diff --git a/tests/setup.ts b/tests/setup.ts index cd26964fc..8597c2d9b 100644 --- a/tests/setup.ts +++ b/tests/setup.ts @@ -15,6 +15,8 @@ window.getComputedStyle = elt => getComputedStyle(elt); global.requestAnimationFrame = cb => setTimeout(cb, 0); require('regenerator-runtime'); +vi.mock('rc-util/lib/getScrollBarSize'); + const Enzyme = require('enzyme'); const Adapter = require('enzyme-adapter-react-16'); From a8283c6e2cd1425f55e8758893d20f8afd7cd35b Mon Sep 17 00:00:00 2001 From: Dunqing Date: Wed, 10 May 2023 20:31:48 +0800 Subject: [PATCH 10/11] test: update --- __mocks__/rc-util/lib/getScrollBarSize.ts | 1 - tests/FixedHeader.spec.jsx | 13 ++++---- tests/Table.spec.jsx | 8 ++--- tests/__snapshots__/Table.spec.jsx.snap | 36 ++++++++++++++++++++--- 4 files changed, 41 insertions(+), 17 deletions(-) diff --git a/__mocks__/rc-util/lib/getScrollBarSize.ts b/__mocks__/rc-util/lib/getScrollBarSize.ts index 130bd9d13..e967052ef 100644 --- a/__mocks__/rc-util/lib/getScrollBarSize.ts +++ b/__mocks__/rc-util/lib/getScrollBarSize.ts @@ -1,7 +1,6 @@ export default () => 15; export const getTargetScrollBarSize = (target: HTMLElement) => { - console.log("🚀 ~ file: getScrollBarSize.ts:4 ~ getTargetScrollBarSize ~ target:", target) if (!target || !(target instanceof Element)) { return { width: 0, height: 0 }; } diff --git a/tests/FixedHeader.spec.jsx b/tests/FixedHeader.spec.jsx index a62221c7f..adb4ed885 100644 --- a/tests/FixedHeader.spec.jsx +++ b/tests/FixedHeader.spec.jsx @@ -58,17 +58,16 @@ describe('Table.FixedHeader', () => { expect(wrapper.find('.rc-table-header table').props().style.visibility).toBeFalsy(); - expect(wrapper.find('.rc-table-body colgroup col').at(0).props().style.width).toEqual(100); - expect(wrapper.find('.rc-table-body colgroup col').at(1).props().style.width).toEqual(200); - expect(wrapper.find('.rc-table-body colgroup col')).toHaveLength(2); + expect(wrapper.find('colgroup col').at(0).props().style.width).toEqual(100); + expect(wrapper.find('colgroup col').at(1).props().style.width).toEqual(200); + expect(wrapper.find('colgroup col').at(2).props().style.width).toEqual(0); // Update columns - wrapper.setProps({ columns: [col2, col1, { ...col3, width: 300 }] }); + wrapper.setProps({ columns: [col2, col1] }); wrapper.update(); - expect(wrapper.find('.rc-table-body colgroup col').at(0).props().style.width).toEqual(200); - expect(wrapper.find('.rc-table-body colgroup col').at(1).props().style.width).toEqual(100); - expect(wrapper.find('.rc-table-body colgroup col').at(2).props().style.width).toEqual(300); + expect(wrapper.find('colgroup col').at(0).props().style.width).toEqual(200); + expect(wrapper.find('colgroup col').at(1).props().style.width).toEqual(100); vi.useRealTimers(); }); diff --git a/tests/Table.spec.jsx b/tests/Table.spec.jsx index e0a8ec9e0..31611e7c1 100644 --- a/tests/Table.spec.jsx +++ b/tests/Table.spec.jsx @@ -1,4 +1,3 @@ -import { render } from '@testing-library/react'; import { mount } from 'enzyme'; import { resetWarned } from 'rc-util/lib/warning'; import React from 'react'; @@ -1160,8 +1159,7 @@ describe('Table.Basic', () => { }); it('should get scrollbar size', () => { const tColumns = [{ title: 'Name', dataIndex: 'name', key: 'name', width: 100 }]; - - const { container } = render( + const wrapper = mount( createTable({ columns: tColumns, scroll: { y: 100 }, @@ -1170,8 +1168,8 @@ describe('Table.Basic', () => { }, }), ); - expect(container).toMatchSnapshot(); - expect(container.getElementsByTagName('col')).toHaveLength(tColumns.length + 1); + expect(wrapper.render()).toMatchSnapshot(); + expect(wrapper.find('col')).toHaveLength(tColumns.length + 1); }); it('columns support JSX condition', () => { const Example = () => { diff --git a/tests/__snapshots__/Table.spec.jsx.snap b/tests/__snapshots__/Table.spec.jsx.snap index 42df31d1d..3dc5283f0 100644 --- a/tests/__snapshots__/Table.spec.jsx.snap +++ b/tests/__snapshots__/Table.spec.jsx.snap @@ -1180,8 +1180,8 @@ LoadedCheerio { `; exports[`Table.Basic > should get scrollbar size 1`] = ` -
-
should get scrollbar size 1`] = `
-
- + , + "_root": LoadedCheerio { + "0": Document { + "children": [ + + + + , + ], + "endIndex": null, + "next": null, + "parent": null, + "prev": null, + "startIndex": null, + "type": "root", + "x-mode": "quirks", + }, + "_root": [Circular], + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, + }, + "length": 1, + "options": { + "decodeEntities": true, + "xml": false, + }, +} `; exports[`Table.Basic > syntactic sugar 1`] = ` From 1e956b7f20364c76b8b62aaa2e63222ce847e0b8 Mon Sep 17 00:00:00 2001 From: Dunqing Date: Wed, 10 May 2023 20:33:56 +0800 Subject: [PATCH 11/11] test: revert --- src/stickyScrollBar.tsx | 6 +- tests/Sticky.spec.jsx | 146 ++++++++++++++++++++++------------------ 2 files changed, 82 insertions(+), 70 deletions(-) diff --git a/src/stickyScrollBar.tsx b/src/stickyScrollBar.tsx index 7ce191fa5..6aa84777b 100644 --- a/src/stickyScrollBar.tsx +++ b/src/stickyScrollBar.tsx @@ -46,7 +46,7 @@ const StickyScrollBar: React.ForwardRefRenderFunction = event => { event.persist(); - refState.current.delta = event.clientX - scrollState.scrollLeft; + refState.current.delta = event.pageX - scrollState.scrollLeft; refState.current.x = 0; setActive(true); event.preventDefault(); @@ -63,7 +63,7 @@ const StickyScrollBar: React.ForwardRefRenderFunction { diff --git a/tests/Sticky.spec.jsx b/tests/Sticky.spec.jsx index e55d67b9e..34cc1cb8d 100644 --- a/tests/Sticky.spec.jsx +++ b/tests/Sticky.spec.jsx @@ -1,9 +1,7 @@ -import { createEvent, fireEvent, render } from '@testing-library/react'; import { mount } from 'enzyme'; import { spyElementPrototypes } from 'rc-util/lib/test/domHook'; import React from 'react'; import { act } from 'react-dom/test-utils'; -import { vi } from 'vitest'; import Table from '../src'; import { safeAct } from './utils'; @@ -85,7 +83,7 @@ describe('Table.Sticky', () => { const col1 = { dataIndex: 'light', width: 1000 }; const col2 = { dataIndex: 'bamboo', width: 2000 }; - const { container, unmount } = render( + const wrapper = mount( { />, ); - await act(() => { + await act(async () => { vi.runAllTimers(); + await Promise.resolve(); }); - expect(container.querySelector('.rc-table-sticky-scroll')).toBeTruthy(); + expect(wrapper.find('.rc-table-sticky-scroll').get(0)).not.toBeUndefined(); const oldInnerHeight = global.innerHeight; const resizeEvent = new Event('resize'); global.innerHeight = 10000; - await act(() => { + await act(async () => { global.dispatchEvent(resizeEvent); vi.runAllTimers(); + await Promise.resolve(); + wrapper.update(); }); - expect(container.querySelector('.rc-table-sticky-scroll')).toBeNull(); + expect(wrapper.find('.rc-table-sticky-scroll').get(0)).toBeFalsy(); - await act(() => { + await act(async () => { global.innerHeight = oldInnerHeight; global.dispatchEvent(resizeEvent); vi.runAllTimers(); + await Promise.resolve(); + wrapper.update(); }); const mockFn = vi.fn(); - const node = container.querySelector('.rc-table-sticky-scroll-bar'); - const event = createEvent.mouseDown(node, { clientX: 0 }); - event.preventDefault = mockFn; - fireEvent(node, event); - expect(mockFn).toHaveBeenCalledTimes(1); + wrapper + .find('.rc-table-sticky-scroll-bar') + .simulate('mousedown', { persist: mockFn, preventDefault: mockFn, pageX: 0 }); - expect(container.querySelector('.rc-table-sticky-scroll-bar-active')).toBeTruthy(); + expect(mockFn).toHaveBeenCalledTimes(2); - await act(() => { - fireEvent.mouseMove(container, { - buttons: 1, - clientX: 50, - }); + expect(wrapper.find('.rc-table-sticky-scroll-bar-active').length).toBe(1); + + const mousemoveEvent = new Event('mousemove'); + + mousemoveEvent.buttons = 1; + mousemoveEvent.pageX = 50; + + await act(async () => { + document.body.dispatchEvent(mousemoveEvent); vi.runAllTimers(); + await Promise.resolve(); + wrapper.update(); }); - expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ + expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ width: '50px', transform: 'translate3d(50.5px, 0, 0)', }); - await act(() => { - fireEvent.mouseMove(container, { - buttons: 1, - clientX: -50, - }); + await act(async () => { + mousemoveEvent.pageX = -50; + document.body.dispatchEvent(mousemoveEvent); + vi.runAllTimers(); + await Promise.resolve(); + wrapper.update(); }); - expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ + expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ width: '50px', transform: 'translate3d(0px, 0, 0)', }); - await act(() => { - fireEvent.mouseMove(container, { - buttons: 0, - clientX: -50, - }); + await act(async () => { + mousemoveEvent.buttons = 0; + document.body.dispatchEvent(mousemoveEvent); + vi.runAllTimers(); + await Promise.resolve(); + wrapper.update(); }); - expect(container.querySelector('.rc-table-sticky-scroll-bar-active')).toBeFalsy(); + expect(wrapper.find('.rc-table-sticky-scroll-bar-active').length).toBe(0); + + const mouseupEvent = new Event('mouseup'); - fireEvent.mouseUp(container); + document.body.dispatchEvent(mouseupEvent); - unmount(); + wrapper.unmount(); window.pageYOffset = 0; mockFn.mockRestore(); @@ -271,17 +282,13 @@ describe('Table.Sticky', () => { ); }; - const { container } = render(); - - await act(() => { - vi.runAllTimers(); - }); - + const wrapper = mount(); + await safeAct(wrapper); expect( - container.querySelector('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').style, - ).toContain({ + wrapper.find('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').prop('style'), + ).toEqual({ position: 'sticky', - right: '15px', + right: 15, }); vi.useRealTimers(); @@ -290,10 +297,9 @@ describe('Table.Sticky', () => { it('Sticky scroll with getContainer', async () => { window.pageYOffset = 900; document.documentElement.scrollTop = 200; - const ol = document.createElement('ol'); - ol.style = 'height: 500px;overflow: scroll'; - document.body.appendChild(ol); - + const container = document.createElement('ol'); + container.style = 'height: 500px;overflow: scroll'; + document.body.appendChild(container); let scrollLeft = 100; const domSpy = spyElementPrototypes(HTMLDivElement, { scrollLeft: { @@ -342,7 +348,7 @@ describe('Table.Sticky', () => { const col1 = { dataIndex: 'light', width: 1000 }; const col2 = { dataIndex: 'bamboo', width: 2000 }; - const { container, unmount } = render( + const wrapper = mount(
{ x: 10000, }} sticky={{ - getContainer: () => ol, + getContainer: () => container, }} />, { - container: ol, + attachTo: container, }, ); - await act(() => { + await act(async () => { vi.runAllTimers(); + await Promise.resolve(); }); - expect(container.querySelector('.rc-table-sticky-scroll')).toBeTruthy(); - expect(container.querySelector('.rc-table-sticky-scroll-bar')).toBeTruthy(); - expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ + expect(wrapper.find('.rc-table-sticky-scroll').get(0)).toBeTruthy(); + expect(wrapper.find('.rc-table-sticky-scroll-bar').get(0)).toBeTruthy(); + + expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ width: '50px', - transform: 'translate3d(50px, 0, 0)', + transform: 'translate3d(0px, 0, 0)', }); const mockFn = vi.fn(); - const node = container.querySelector('.rc-table-sticky-scroll-bar'); - const event = createEvent.mouseDown(node, { clientX: 0 }); - event.preventDefault = mockFn; - fireEvent(node, event); - expect(mockFn).toHaveBeenCalledTimes(1); + wrapper + .find('.rc-table-sticky-scroll-bar') + .simulate('mousedown', { persist: mockFn, preventDefault: mockFn, pageX: 0 }); - await act(() => { - fireEvent.mouseMove(container, { - buttons: 1, - clientX: 50, - }); + expect(mockFn).toHaveBeenCalledTimes(2); + + const mousemoveEvent = new Event('mousemove'); + + mousemoveEvent.buttons = 1; + mousemoveEvent.pageX = 50; + + await act(async () => { + document.body.dispatchEvent(mousemoveEvent); vi.runAllTimers(); + await Promise.resolve(); + wrapper.update(); }); - expect(container.querySelector('.rc-table-sticky-scroll-bar').style).toContain({ + expect(wrapper.find('.rc-table-sticky-scroll-bar').prop('style')).toEqual({ width: '50px', transform: 'translate3d(50.5px, 0, 0)', }); - unmount(); + wrapper.unmount(); window.pageYOffset = 0; domSpy.mockRestore();