react-component · afc163 · Jan 15, 2023 · Jan 15, 2023
diff --git a/tests/FixedColumn.spec.js b/tests/FixedColumn.spec.js
@@ -3,11 +3,14 @@ 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';
 
 describe('Table.FixedColumn', () => {
   let domSpy;
-
+  beforeEach(() => {
+    jest.useFakeTimers();
+  });
   beforeAll(() => {
     domSpy = spyElementPrototypes(HTMLElement, {
       offsetParent: {
@@ -86,18 +89,14 @@ describe('Table.FixedColumn', () => {
                 },
               ]);
           });
-          await act(async () => {
-            jest.runAllTimers();
-            await Promise.resolve();
-            wrapper.update();
-          });
+          await safeAct(wrapper);
           expect(wrapper.render()).toMatchSnapshot();
           jest.useRealTimers();
         });
       });
     });
 
-    it('all column has width should use it', () => {
+    it('all column has width should use it', async () => {
       const wrapper = mount(
         <Table
           columns={[
@@ -108,16 +107,19 @@ describe('Table.FixedColumn', () => {
           scroll={{ x: 'max-content' }}
         />,
       );
+
+      await safeAct(wrapper);
 
       expect(wrapper.find('colgroup').render()).toMatchSnapshot();
     });
   });
 
-  it('has correct scroll classNames when table resize', () => {
+  it('has correct scroll classNames when table resize', async () => {
     const wrapper = mount(
       <Table columns={columns} data={data} scroll={{ x: true }} style={{ width: 2000 }} />,
     );
 
+    await safeAct(wrapper);
     // Use `onScroll` directly since simulate not support `currentTarget`
     act(() => {
       wrapper
@@ -203,7 +205,7 @@ describe('Table.FixedColumn', () => {
       errorSpy.mockRestore();
     });
 
-    it('left', () => {
+    it('left', async () => {
       mount(<Table columns={[{}, { fixed: 'left' }, {}]} />);
       expect(errorSpy).toHaveBeenCalledWith(
         "Warning: Index 0 of `columns` missing `fixed='left'` prop.",
@@ -231,11 +233,12 @@ describe('Table.FixedColumn', () => {
     expect(wrapper.find('tr td').find('.rc-table-cell-content')).toHaveLength(data.length);
   });
 
-  it('fixed column renders correctly RTL', () => {
+  it('fixed column renders correctly RTL', async () => {
     const wrapper = mount(
       <Table columns={columns} data={data} direction="rtl" scroll={{ x: 1 }} />,
     );
     expect(wrapper.render()).toMatchSnapshot();
+    await safeAct(wrapper);
   });
 
   it('has correct scroll classNames when table direction is RTL', () => {
@@ -264,17 +267,19 @@ describe('Table.FixedColumn', () => {
     ).toBeTruthy();
   });
 
-  it('not break measure count', () => {
+  it('not break measure count', async () => {
     const wrapper = mount(<Table columns={columns.slice(0, 5)} data={data} scroll={{ x: 1000 }} />);
+    await safeAct(wrapper);
     expect(wrapper.find('.rc-table-measure-row td')).toHaveLength(5);
 
     wrapper.setProps({ columns: columns.slice(0, 4) });
     wrapper.update();
     expect(wrapper.find('.rc-table-measure-row td')).toHaveLength(4);
   });
 
-  it('when all columns fixed left,cell should has classname rc-table-cell-fix-left-all', () => {
+  it('when all columns fixed left,cell should has classname rc-table-cell-fix-left-all', async () => {
     const wrapper = mount(<Table columns={columns.slice(0, 2)} data={data} scroll={{ x: 1000 }} />);
+    await safeAct(wrapper);
     expect(wrapper.find('.rc-table-cell-fix-left-all')).toHaveLength(10);
   });
 });
diff --git a/tests/FixedHeader.spec.js b/tests/FixedHeader.spec.js
@@ -3,6 +3,7 @@ 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';
 
 describe('Table.FixedHeader', () => {
@@ -16,6 +17,7 @@ describe('Table.FixedHeader', () => {
   });
 
   beforeEach(() => {
+    jest.useFakeTimers();
     visible = true;
   });
 
@@ -24,7 +26,6 @@ describe('Table.FixedHeader', () => {
   });
 
   it('should work', async () => {
-    jest.useFakeTimers();
     const col1 = { dataIndex: 'light', width: 100 };
     const col2 = { dataIndex: 'bamboo', width: 200 };
     const col3 = { dataIndex: 'empty', width: 0 };
@@ -35,7 +36,6 @@ describe('Table.FixedHeader', () => {
         scroll={{ y: 10 }}
       />,
     );
-
     wrapper
       .find(RcResizeObserver.Collection)
       .first()
@@ -54,12 +54,7 @@ describe('Table.FixedHeader', () => {
           size: { width: 0, offsetWidth: 0 },
         },
       ]);
-
-    await act(async () => {
-      jest.runAllTimers();
-      await Promise.resolve();
-      wrapper.update();
-    });
+    await safeAct(wrapper);
 
     expect(wrapper.find('.rc-table-header table').props().style.visibility).toBeFalsy();
 
@@ -78,7 +73,7 @@ describe('Table.FixedHeader', () => {
     jest.useRealTimers();
   });
 
-  it('INTERNAL_COL_DEFINE', () => {
+  it('INTERNAL_COL_DEFINE', async () => {
     const col1 = {
       dataIndex: 'light',
       width: 100,
@@ -92,6 +87,7 @@ describe('Table.FixedHeader', () => {
         scroll={{ y: 10 }}
       />,
     );
+    await safeAct(wrapper);
 
     expect(wrapper.find('table').last().find('colgroup col').first().props().className).toEqual(
       'test-internal',
@@ -101,7 +97,7 @@ describe('Table.FixedHeader', () => {
     );
   });
 
-  it('show header when data is null', () => {
+  it('show header when data is null', async () => {
     const columns = [
       {
         title: 'Name',
@@ -125,13 +121,14 @@ describe('Table.FixedHeader', () => {
         }}
       />,
     );
-
+
+    await safeAct(wrapper);
     expect(wrapper.find('.rc-table-header table').props().style).toEqual(
       expect.objectContaining({ visibility: null }),
     );
   });
 
-  it('rtl', () => {
+  it('rtl', async () => {
     const wrapper = mount(
       <Table
         columns={[{ dataIndex: 'light', width: 100 }]}
@@ -142,6 +139,7 @@ describe('Table.FixedHeader', () => {
         }}
       />,
     );
+    await safeAct(wrapper);
 
     expect(wrapper.find('Header').props().stickyOffsets).toEqual(
       expect.objectContaining({
@@ -152,8 +150,6 @@ describe('Table.FixedHeader', () => {
   });
 
   it('invisible should not change width', async () => {
-    jest.useFakeTimers();
-
     const col1 = { dataIndex: 'light', width: 93 };
     const wrapper = mount(
       <Table
@@ -173,11 +169,7 @@ describe('Table.FixedHeader', () => {
           size: { width: 93, offsetWidth: 93 },
         },
       ]);
-    await act(async () => {
-      jest.runAllTimers();
-      await Promise.resolve();
-      wrapper.update();
-    });
+    await safeAct(wrapper);
 
     expect(wrapper.find('FixedHolder col').first().props().style).toEqual(
       expect.objectContaining({ width: 93 }),
@@ -209,7 +201,7 @@ describe('Table.FixedHeader', () => {
     jest.useRealTimers();
   });
 
-  it('do not mask as ant-table-cell-fix-left-last in nested table parent cell', () => {
+  it('do not mask as ant-table-cell-fix-left-last in nested table parent cell', async () => {
     const columns = [
       {
         title: '父表头右侧的阴影导致整个表格最右侧有空隙',
@@ -262,6 +254,7 @@ describe('Table.FixedHeader', () => {
         scroll={{ x: true }}
       />,
     );
+    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');
 

diff --git a/tests/Sticky.spec.js b/tests/Sticky.spec.js
@@ -3,10 +3,13 @@ import { act } from 'react-dom/test-utils';
 import { mount } from 'enzyme';
 import { spyElementPrototypes } from 'rc-util/lib/test/domHook';
 import Table from '../src';
+import { safeAct } from './utils';
 
 describe('Table.Sticky', () => {
-  it('Sticky Header', () => {
+  beforeEach(() => {
     jest.useFakeTimers();
+  });
+  it('Sticky Header', async () => {
     const col1 = { dataIndex: 'light', width: 100 };
     const col2 = { dataIndex: 'bamboo', width: 200 };
 
@@ -37,10 +40,12 @@ describe('Table.Sticky', () => {
       'rc-table-header rc-table-sticky-holder',
     );
 
-    wrapper.setProps({
-      sticky: {
-        offsetHeader: 10,
-      },
+    await safeAct(wrapper, () => {
+      wrapper.setProps({
+        sticky: {
+          offsetHeader: 10,
+        },
+      });
     });
 
     expect(wrapper.find('.rc-table-header').last().prop('style')).toEqual({
@@ -52,7 +57,6 @@ describe('Table.Sticky', () => {
   });
 
   it('Sticky scroll', async () => {
-    jest.useFakeTimers();
     window.pageYOffset = 900;
     document.documentElement.scrollTop = 200;
     let scrollLeft = 100;
@@ -208,8 +212,7 @@ describe('Table.Sticky', () => {
     jest.useRealTimers();
   });
 
-  it('Sticky Header with border classname', () => {
-    jest.useFakeTimers();
+  it('Sticky Header with border classname', async () => {
 
     const TableDemo = props => {
       return (
@@ -239,21 +242,19 @@ describe('Table.Sticky', () => {
       );
     };
     const wrapper = mount(<TableDemo />);
-
+    await safeAct(wrapper);
     expect(
       wrapper.find('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').prop('style'),
     ).toEqual({
       position: 'sticky',
       right: 0,
     });
-
     expect(wrapper.find('.rc-table-cell-fix-sticky')).not.toBe(undefined);
 
     jest.useRealTimers();
   });
 
-  it('Sticky Header with scroll-y', () => {
-    jest.useFakeTimers();
+  it('Sticky Header with scroll-y', async () => {
 
     const TableDemo = props => {
       return (
@@ -284,7 +285,7 @@ describe('Table.Sticky', () => {
       );
     };
     const wrapper = mount(<TableDemo />);
-
+    await safeAct(wrapper);
     expect(
       wrapper.find('.rc-table-cell-fix-right-first.rc-table-cell-fix-sticky').prop('style'),
     ).toEqual({
@@ -296,10 +297,10 @@ describe('Table.Sticky', () => {
   });
 
   it('Sticky scroll with getContainer', async () => {
-    jest.useFakeTimers();
+
     window.pageYOffset = 900;
     document.documentElement.scrollTop = 200;
-    const container = document.createElement('p');
+    const container = document.createElement('ol');
     container.style = 'height: 500px;overflow: scroll';
     document.body.appendChild(container);
     let scrollLeft = 100;
@@ -324,7 +325,7 @@ describe('Table.Sticky', () => {
       },
     });
 
-    const sectionSpy = spyElementPrototypes(HTMLParagraphElement, {
+    const sectionSpy = spyElementPrototypes(HTMLOListElement, {
       scrollLeft: {
         get: () => scrollLeft,
         set: left => {

diff --git a/tests/utils.js b/tests/utils.js
@@ -0,0 +1,10 @@
+import { act } from 'react-dom/test-utils';
+
+export function safeAct(wrapper, cb) {
+  return act(async () => {
+    cb && cb();
+    jest.runAllTimers();
+    await Promise.resolve();
+    wrapper.update();
+  });
+}