test: wrap React.StrictMode for test cases

ant-design · Apr 14, 2022 · 095ca78 · 095ca78
1 parent 4c8041d
commit 095ca78
Show file tree

Hide file tree

Showing 6 changed files with 69 additions and 20 deletions.
diff --git a/tests/shared/accessibilityTest.tsx b/tests/shared/accessibilityTest.tsx
@@ -7,7 +7,11 @@ export default function accessibilityTest(Component: React.ComponentType) {
   describe(`accessibility`, () => {
     it(`component does not have any violations`, async () => {
       jest.useRealTimers();
-      const wrapper = mount(<Component />);
+      const wrapper = mount(
+        <React.StrictMode>
+          <Component />
+        </React.StrictMode>,
+      );
       const results = await axe(wrapper.getDOMNode());
       expect(results).toHaveNoViolations();
     });

diff --git a/tests/shared/demoTest.tsx b/tests/shared/demoTest.tsx
@@ -85,7 +85,7 @@ function baseText(doInject: boolean, component: string, options: Options = {}) {
           );
         }
 
-        const wrapper = render(Demo);
+        const wrapper = render(<React.StrictMode>{Demo}</React.StrictMode>);
 
         // Convert aria related content
         ariaConvert(wrapper);

diff --git a/tests/shared/focusTest.tsx b/tests/shared/focusTest.tsx
@@ -31,7 +31,11 @@ export default function focusTest(
       it('Test: focus() and onFocus', () => {
         const handleFocus = jest.fn();
         const ref = React.createRef<any>();
-        const { unmount } = render(<Component onFocus={handleFocus} ref={ref} />);
+        const { unmount } = render(
+          <React.StrictMode>
+            <Component onFocus={handleFocus} ref={ref} />
+          </React.StrictMode>,
+        );
         ref.current.focus();
         expect(handleFocus).toHaveBeenCalled();
 
@@ -41,7 +45,11 @@ export default function focusTest(
       it('Test: blur() and onBlur', async () => {
         const handleBlur = jest.fn();
         const ref = React.createRef<any>();
-        const { unmount } = render(<Component ref={ref} onBlur={handleBlur} />);
+        const { unmount } = render(
+          <React.StrictMode>
+            <Component ref={ref} onBlur={handleBlur} />
+          </React.StrictMode>,
+        );
         ref.current.focus();
         ref.current.blur();
         expect(handleBlur).toHaveBeenCalled();
@@ -51,7 +59,11 @@ export default function focusTest(
 
       it('Test: autoFocus', () => {
         const handleFocus = jest.fn();
-        const { unmount } = render(<Component autoFocus onFocus={handleFocus} />);
+        const { unmount } = render(
+          <React.StrictMode>
+            <Component autoFocus onFocus={handleFocus} />
+          </React.StrictMode>,
+        );
         expect(handleFocus).toHaveBeenCalled();
 
         unmount();
@@ -97,9 +109,11 @@ export default function focusTest(
         const onFocus = jest.fn();
         const ref = React.createRef<any>();
         const wrapper = mount(
-          <div>
-            <Component onFocus={onFocus} ref={ref} />
-          </div>,
+          <React.StrictMode>
+            <div>
+              <Component onFocus={onFocus} ref={ref} />
+            </div>
+          </React.StrictMode>,
         );
         ref.current.focus();
         expect(focused).toBeTruthy();
@@ -113,9 +127,11 @@ export default function focusTest(
         const onBlur = jest.fn();
         const ref = React.createRef<any>();
         const wrapper = mount(
-          <div>
-            <Component onBlur={onBlur} ref={ref} />
-          </div>,
+          <React.StrictMode>
+            <div>
+              <Component onBlur={onBlur} ref={ref} />
+            </div>
+          </React.StrictMode>,
         );
 
         ref.current.blur();
@@ -128,7 +144,11 @@ export default function focusTest(
 
       it('Ref: autoFocus', () => {
         const onFocus = jest.fn();
-        const wrapper = mount(<Component autoFocus onFocus={onFocus} />);
+        const wrapper = mount(
+          <React.StrictMode>
+            <Component autoFocus onFocus={onFocus} />
+          </React.StrictMode>,
+        );
 
         expect(focused).toBeTruthy();
 
@@ -138,15 +158,25 @@ export default function focusTest(
     } else {
       it('focus() and onFocus', () => {
         const handleFocus = jest.fn();
-        const wrapper = mount(<Component onFocus={handleFocus} />, { attachTo: container });
+        const wrapper = mount(
+          <React.StrictMode>
+            <Component onFocus={handleFocus} />
+          </React.StrictMode>,
+          { attachTo: container },
+        );
         (wrapper.instance() as any).focus();
         expect(handleFocus).toHaveBeenCalled();
       });
 
       it('blur() and onBlur', async () => {
         jest.useRealTimers();
         const handleBlur = jest.fn();
-        const wrapper = mount(<Component onBlur={handleBlur} />, { attachTo: container });
+        const wrapper = mount(
+          <React.StrictMode>
+            <Component onBlur={handleBlur} />
+          </React.StrictMode>,
+          { attachTo: container },
+        );
         (wrapper.instance() as any).focus();
         await sleep(0);
         (wrapper.instance() as any).blur();
@@ -156,7 +186,12 @@ export default function focusTest(
 
       it('autoFocus', () => {
         const handleFocus = jest.fn();
-        mount(<Component autoFocus onFocus={handleFocus} />, { attachTo: container });
+        mount(
+          <React.StrictMode>
+            <Component autoFocus onFocus={handleFocus} />
+          </React.StrictMode>,
+          { attachTo: container },
+        );
         expect(handleFocus).toHaveBeenCalled();
       });
     }

diff --git a/tests/shared/imageTest.tsx b/tests/shared/imageTest.tsx
@@ -62,7 +62,11 @@ export function imageDemoTest(component: string, options: Options = {}) {
       // eslint-disable-next-line global-require,import/no-dynamic-require
       let Demo = require(`../.${file}`).default;
       if (typeof Demo === 'function') {
-        Demo = <Demo />;
+        Demo = (
+          <React.StrictMode>
+            <Demo />
+          </React.StrictMode>
+        );
       }
       imageTest(Demo);
     });

diff --git a/tests/shared/mountTest.tsx b/tests/shared/mountTest.tsx
@@ -6,7 +6,11 @@ export default function mountTest(Component: React.ComponentType) {
   describe(`mount and unmount`, () => {
     // https://github.com/ant-design/ant-design/pull/18441
     it(`component could be updated and unmounted without errors`, () => {
-      const wrapper = mount(<Component />);
+      const wrapper = mount(
+        <React.StrictMode>
+          <Component />
+        </React.StrictMode>,
+      );
       expect(() => {
         wrapper.setProps({});
         wrapper.unmount();

diff --git a/tests/shared/rtlTest.tsx b/tests/shared/rtlTest.tsx
@@ -12,9 +12,11 @@ export default function rtlTest(Component: React.ComponentType, mockDate?: boole
         MockDate.set(Moment('2000-09-28').valueOf());
       }
       const wrapper = mount(
-        <ConfigProvider direction="rtl">
-          <Component />
-        </ConfigProvider>,
+        <React.StrictMode>
+          <ConfigProvider direction="rtl">
+            <Component />
+          </ConfigProvider>
+        </React.StrictMode>,
       );
       expect(wrapper.render()).toMatchSnapshot();
       if (mockDate) {