test: replace testing-lib in focusTest (#37280)

* feat: replace testing-lib * feat: update for lint
ant-design · Aug 30, 2022 · 5a2c6ed · 5a2c6ed
1 parent 3c72aa0
commit 5a2c6ed
Showing 1 changed file with 22 additions and 32 deletions.
diff --git a/tests/shared/focusTest.tsx b/tests/shared/focusTest.tsx
@@ -1,7 +1,5 @@
 import React from 'react';
-import type { ReactWrapper } from 'enzyme';
-import { mount } from 'enzyme';
-import { sleep, render } from '../utils';
+import { sleep, render, fireEvent } from '../utils';
 
 // eslint-disable-next-line jest/no-export
 export default function focusTest(
@@ -60,10 +58,10 @@ export default function focusTest(
     }
 
     // ======================== Enzyme ========================
-    let container: HTMLElement;
+    let containerHtml: HTMLElement;
     beforeEach(() => {
-      container = document.createElement('div');
-      document.body.appendChild(container);
+      containerHtml = document.createElement('div');
+      document.body.appendChild(containerHtml);
       focused = false;
       blurred = false;
     });
@@ -74,44 +72,36 @@ export default function focusTest(
     });
 
     afterEach(() => {
-      document.body.removeChild(container);
+      document.body.removeChild(containerHtml);
     });
 
-    const getElement = (wrapper: ReactWrapper) => {
-      let ele = wrapper.find('input').first();
-      if (ele.length === 0) {
-        ele = wrapper.find('button').first();
-      }
-      if (ele.length === 0) {
-        ele = wrapper.find('textarea').first();
-      }
-      if (ele.length === 0) {
-        ele = wrapper.find('div[tabIndex]').first();
-      }
-      return ele;
-    };
+    const getElement = (container: { querySelector: Function }) =>
+      container.querySelector('input') ||
+      container.querySelector('button') ||
+      container.querySelector('textarea') ||
+      container.querySelector('div[tabIndex]');
 
     if (refFocus) {
       it('Ref: focus() and onFocus', () => {
         const onFocus = jest.fn();
         const ref = React.createRef<any>();
-        const wrapper = mount(
+        const { container } = render(
           <div>
             <Component onFocus={onFocus} ref={ref} />
           </div>,
         );
         ref.current.focus();
         expect(focused).toBeTruthy();
 
-        getElement(wrapper).simulate('focus');
+        fireEvent.focus(getElement(container));
         expect(onFocus).toHaveBeenCalled();
       });
 
       it('Ref: blur() and onBlur', async () => {
         jest.useRealTimers();
         const onBlur = jest.fn();
         const ref = React.createRef<any>();
-        const wrapper = mount(
+        const { container } = render(
           <div>
             <Component onBlur={onBlur} ref={ref} />
           </div>,
@@ -120,42 +110,42 @@ export default function focusTest(
         ref.current.blur();
         expect(blurred).toBeTruthy();
 
-        getElement(wrapper).simulate('blur');
+        fireEvent.blur(getElement(container));
         await sleep(0);
         expect(onBlur).toHaveBeenCalled();
       });
 
       it('Ref: autoFocus', () => {
         const onFocus = jest.fn();
-        const wrapper = mount(<Component autoFocus onFocus={onFocus} />);
+        const { container } = render(<Component autoFocus onFocus={onFocus} />);
 
         expect(focused).toBeTruthy();
 
-        getElement(wrapper).simulate('focus');
+        fireEvent.focus(getElement(container));
         expect(onFocus).toHaveBeenCalled();
       });
     } else {
       it('focus() and onFocus', () => {
         const handleFocus = jest.fn();
-        const wrapper = mount(<Component onFocus={handleFocus} />, { attachTo: container });
-        (wrapper.instance() as any).focus();
+        const { container } = render(<Component onFocus={handleFocus} />);
+        fireEvent.focus(getElement(container));
         expect(handleFocus).toHaveBeenCalled();
       });
 
       it('blur() and onBlur', async () => {
         jest.useRealTimers();
         const handleBlur = jest.fn();
-        const wrapper = mount(<Component onBlur={handleBlur} />, { attachTo: container });
-        (wrapper.instance() as any).focus();
+        const { container } = render(<Component onBlur={handleBlur} />);
+        fireEvent.focus(getElement(container));
         await sleep(0);
-        (wrapper.instance() as any).blur();
+        fireEvent.blur(getElement(container));
         await sleep(0);
         expect(handleBlur).toHaveBeenCalled();
       });
 
       it('autoFocus', () => {
         const handleFocus = jest.fn();
-        mount(<Component autoFocus onFocus={handleFocus} />, { attachTo: container });
+        render(<Component autoFocus onFocus={handleFocus} />);
         expect(handleFocus).toHaveBeenCalled();
       });
     }