test: move test cases to testing lib for Switch (#36326)

* add

* test: wave

* fix: type

components/switch/__tests__/index.test.js → components/switch/__tests__/index.test.tsx

@@ -1,10 +1,9 @@
-import { mount } from 'enzyme';
 import React from 'react';
 import Switch from '..';
 import focusTest from '../../../tests/shared/focusTest';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
-import { sleep } from '../../../tests/utils';
+import { sleep, fireEvent, render } from '../../../tests/utils';
 import { resetWarned } from '../../_util/warning';
 
 describe('Switch', () => {
@@ -13,17 +12,18 @@ describe('Switch', () => {
   rtlTest(Switch);
 
   it('should has click wave effect', async () => {
-    const wrapper = mount(<Switch />);
+    const { container } = render(<Switch />);
-    wrapper.find('.ant-switch').getDOMNode().click();
+    fireEvent.click(container.querySelector('.ant-switch')!);
     await sleep(0);
-    expect(wrapper.find('button').getDOMNode().getAttribute('ant-click-animating')).toBe('true');
+    expect(container.querySelector('button')!.getAttribute('ant-click-animating')).toBe('true');
   });
 
   it('warning if set `value`', () => {
     resetWarned();
 
     const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
-    mount(<Switch value />);
+    const props = { value: true } as any;
+    render(<Switch {...props} />);
     expect(errorSpy).toHaveBeenCalledWith(
       'Warning: [antd: Switch] `value` is not a valid prop, do you mean `checked`?',
     );

components/switch/__tests__/wave.test.js

@@ -1,27 +0,0 @@
-import { mount } from 'enzyme';
-import React from 'react';
-import Switch from '..';
-import { sleep } from '../../../tests/utils';
-
-describe('click wave effect', () => {
-  async function click(wrapper) {
-    wrapper.find('.ant-switch').getDOMNode().click();
-    wrapper.find('.ant-switch').getDOMNode().dispatchEvent(new Event('transitionstart'));
-    await sleep(20);
-    wrapper.find('.ant-switch').getDOMNode().dispatchEvent(new Event('animationend'));
-    await sleep(20);
-  }
-
-  it('should have click wave effect', async () => {
-    const wrapper = mount(<Switch />);
-    await click(wrapper);
-    const waveInstance = wrapper.find('InternalWave').instance();
-    const resetEffect = jest.spyOn(waveInstance, 'resetEffect');
-    await click(wrapper);
-    expect(resetEffect).toHaveBeenCalledTimes(1);
-    const event = new Event('animationend');
-    Object.assign(event, { animationName: 'fadeEffect' });
-    wrapper.find('.ant-switch').getDOMNode().dispatchEvent(event);
-    resetEffect.mockRestore();
-  });
-});

components/switch/__tests__/wave.test.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import Switch from '..';
+import { sleep, render, fireEvent } from '../../../tests/utils';
+
+describe('click wave effect', () => {
+  async function click(container: HTMLElement) {
+    fireEvent.click(container.querySelector('.ant-switch')!);
+    container.querySelector('.ant-switch')!.dispatchEvent(new Event('transitionstart'));
+    await sleep(20);
+    container.querySelector('.ant-switch')!.dispatchEvent(new Event('animationend'));
+    await sleep(20);
+  }
+
+  it('should have click wave effect', async () => {
+    const { container } = render(<Switch />);
+    await click(container);
+    await click(container);
+
+    expect(
+      container.querySelector('.ant-switch')!.getAttribute('ant-switch-click-animating'),
+    ).toBeFalsy();
+
+    const event = new Event('animationend');
+    Object.assign(event, { animationName: 'fadeEffect' });
+    container.querySelector('.ant-switch')!.dispatchEvent(event);
+  });
+});

components/switch/index.tsx

@@ -10,7 +10,10 @@ import warning from '../_util/warning';
 import Wave from '../_util/wave';
 
 export type SwitchSize = 'small' | 'default';
-export type SwitchChangeEventHandler = (checked: boolean, event: MouseEvent) => void;
+export type SwitchChangeEventHandler = (
+  checked: boolean,
+  event: React.MouseEvent<HTMLButtonElement>,
+) => void;
 export type SwitchClickEventHandler = SwitchChangeEventHandler;
 
 export interface SwitchProps {
@@ -37,7 +40,7 @@ interface CompoundedComponent
   __ANT_SWITCH: boolean;
 }
 
-const Switch = React.forwardRef<unknown, SwitchProps>(
+const Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(
   (
     {
       prefixCls: customizePrefixCls,

typings/custom-typings.d.ts

@@ -24,8 +24,6 @@ declare module 'rc-checkbox';
 
 declare module 'rc-rate';
 
-declare module 'rc-switch';
-
 declare module '*.json' {
   const value: any;
   export const version: string;