[test](SqlManagementException): Add unit test case

Author: zzyangh

packages/sqle/src/page/SqlManagementException/Common/Form/__tests__/__snapshots__/index.test.tsx.snap

@@ -0,0 +1,76 @@
+import {
+  renderWithReduxAndTheme,
+  renderHooksWithTheme
+} from '@actiontech/shared/lib/testUtil/customRender';
+import { Form } from 'antd';
+import SqlManagementExceptionForm from '../index';
+import { SqlManagementExceptionFormFieldType } from '../../../index.type';
+import instance from '../../../../../testUtils/mockApi/instance';
+import { mockUseDbServiceDriver } from '@actiontech/shared/lib/testUtil/mockHook/mockUseDbServiceDriver';
+import { cleanup, act, screen, fireEvent } from '@testing-library/react';
+import { getBySelector } from '@actiontech/shared/lib/testUtil/customQuery';
+
+describe('sqle/SqlManagementException/SqlManagementExceptionForm', () => {
+  let getInstanceTipListSpy: jest.SpyInstance;
+  beforeEach(() => {
+    jest.useFakeTimers();
+    mockUseDbServiceDriver();
+    getInstanceTipListSpy = instance.getInstanceTipList();
+  });
+
+  afterEach(() => {
+    jest.useRealTimers();
+    cleanup();
+  });
+
+  const customRender = () => {
+    const { result } = renderHooksWithTheme(() =>
+      Form.useForm<SqlManagementExceptionFormFieldType>()
+    );
+    return renderWithReduxAndTheme(
+      <SqlManagementExceptionForm form={result.current[0]} />
+    );
+  };
+
+  it('should match snapshot', () => {
+    const { baseElement } = customRender();
+    expect(baseElement).toMatchSnapshot();
+    expect(getInstanceTipListSpy).toHaveBeenCalledTimes(1);
+    expect(screen.getByLabelText('字符串')).toBeChecked();
+    expect(screen.getByLabelText('SQL语句')).toBeInTheDocument();
+  });
+
+  it('render switch match type ', async () => {
+    const { baseElement } = customRender();
+    await act(async () => jest.advanceTimersByTime(3000));
+
+    expect(screen.getByLabelText('字符串')).toBeChecked();
+    expect(screen.getByLabelText('SQL语句')).toBeInTheDocument();
+
+    fireEvent.click(screen.getByText('SQL指纹'));
+    await act(async () => jest.advanceTimersByTime(0));
+    expect(screen.getByLabelText('SQL指纹')).toBeChecked();
+    expect(screen.getByLabelText('SQL语句')).toBeInTheDocument();
+    expect(baseElement).toMatchSnapshot();
+
+    fireEvent.click(screen.getByText('IP'));
+    await act(async () => jest.advanceTimersByTime(0));
+    expect(getBySelector('#ip')).toBeInTheDocument();
+    expect(baseElement).toMatchSnapshot();
+
+    fireEvent.click(screen.getByText('网段'));
+    await act(async () => jest.advanceTimersByTime(0));
+    expect(getBySelector('#cidr')).toBeInTheDocument();
+    expect(baseElement).toMatchSnapshot();
+
+    fireEvent.click(screen.getByText('主机名'));
+    await act(async () => jest.advanceTimersByTime(0));
+    expect(getBySelector('#host')).toBeInTheDocument();
+    expect(baseElement).toMatchSnapshot();
+
+    fireEvent.click(screen.getByText('数据源'));
+    await act(async () => jest.advanceTimersByTime(0));
+    expect(getBySelector('#instance')).toBeInTheDocument();
+    expect(baseElement).toMatchSnapshot();
+  });
+});

packages/sqle/src/page/SqlManagementException/Common/Form/__tests__/index.test.tsx

@@ -69,13 +69,13 @@ const SqlManagementExceptionForm: React.FC<SqlManagementExceptionFormProps> = ({
             },
             ...whiteSpaceSql()
           ]}
+          initialValue="/* input your sql */"
         >
           <MonacoEditor
             width="100%"
             height="500px"
             language="sql"
             onMount={editorDidMount}
-            defaultValue="/* input your sql */"
           />
         </Form.Item>
       </EmptyBox>