Update tests

packages/redux-devtools-ui/test/Button.test.tsx

@@ -9,11 +9,11 @@ describe('Button', function () {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should handle the click event', () => {
+  it('should handle the click event', async () => {
     const onClick = jest.fn();
     render(<Button onClick={onClick}>ClickMe</Button>);
 
-    userEvent.click(screen.getByRole('button'));
+    await userEvent.click(screen.getByRole('button'));
     expect(onClick).toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/ContextMenu.test.tsx

@@ -18,13 +18,13 @@ describe('ContextMenu', function () {
     );
     expect(container.firstChild).toMatchSnapshot();
   });
-  it('should handle the click event', () => {
+  it('should handle the click event', async () => {
     const onClick = jest.fn();
     render(
       <ContextMenu items={items} onClick={onClick} x={100} y={100} visible />
     );
 
-    userEvent.click(screen.getByRole('button', { name: 'Menu Item 1' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Menu Item 1' }));
     expect(onClick).toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/Dialog.test.tsx

@@ -52,7 +52,7 @@ describe('Dialog', function () {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should handle dismiss event', () => {
+  it('should handle dismiss event', async () => {
     const onDismiss = jest.fn();
     render(
       <Dialog
@@ -64,11 +64,11 @@ describe('Dialog', function () {
       />
     );
 
-    userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
     expect(onDismiss).toHaveBeenCalled();
   });
 
-  it('should handle submit event', () => {
+  it('should handle submit event', async () => {
     const onSubmit = jest.fn();
     render(
       <Dialog
@@ -80,7 +80,7 @@ describe('Dialog', function () {
       />
     );
 
-    userEvent.click(screen.getByRole('button', { name: 'Submit' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Submit' }));
     expect(onSubmit).toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/Form.test.tsx

@@ -44,7 +44,7 @@ describe('Form', function () {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should handle the submit event', () => {
+  it('should handle the submit event', async () => {
     const onSubmit = jest.fn();
     render(
       <Form
@@ -55,7 +55,7 @@ describe('Form', function () {
       />
     );
 
-    userEvent.click(screen.getByRole('button', { name: 'Submit' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Submit' }));
     expect(onSubmit).toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/Notification.test.tsx

@@ -23,11 +23,11 @@ describe('Notification', function () {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should handle the click event', () => {
+  it('should handle the click event', async () => {
     const onClose = jest.fn();
     render(<Notification onClose={onClose}>Message</Notification>);
 
-    userEvent.click(screen.getByRole('button'));
+    await userEvent.click(screen.getByRole('button'));
     expect(onClose).toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/SegmentedControl.test.tsx

@@ -17,7 +17,7 @@ describe('SegmentedControl', function () {
     );
     expect(container.firstChild).toMatchSnapshot();
   });
-  it('should handle the click event', () => {
+  it('should handle the click event', async () => {
     const onClick = jest.fn();
     render(
       <SegmentedControl
@@ -28,7 +28,7 @@ describe('SegmentedControl', function () {
       />
     );
 
-    userEvent.click(screen.getByRole('button', { name: 'Button1' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Button1' }));
     expect(onClick).toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/Select.test.tsx

@@ -37,27 +37,27 @@ describe('Select', function () {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should select another option', () => {
+  it('should select another option', async () => {
     const onChange = jest.fn();
     const { container } = render(
       <Select options={options} onChange={onChange} />
     );
 
-    userEvent.type(screen.getByRole('combobox'), 'two');
+    await userEvent.type(screen.getByRole('combobox'), 'two');
     expect(container.firstChild).toMatchSnapshot();
-    userEvent.type(screen.getByRole('combobox'), '{enter}');
+    await userEvent.type(screen.getByRole('combobox'), '{enter}');
     expect(onChange).toHaveBeenCalled();
   });
 
-  it("shouldn't find any results", () => {
+  it("shouldn't find any results", async () => {
     const onChange = jest.fn();
     const { container } = render(
       <Select options={options} onChange={onChange} />
     );
 
-    userEvent.type(screen.getByRole('combobox'), 'text');
+    await userEvent.type(screen.getByRole('combobox'), 'text');
     expect(container.firstChild).toMatchSnapshot();
-    userEvent.type(screen.getByRole('combobox'), '{enter}');
+    await userEvent.type(screen.getByRole('combobox'), '{enter}');
     expect(onChange).not.toHaveBeenCalled();
   });
 });

packages/redux-devtools-ui/test/Tabs.test.tsx

@@ -43,11 +43,11 @@ describe('Tabs', function () {
     expect(container.firstChild).toMatchSnapshot();
   });
 
-  it('should select tab', () => {
+  it('should select tab', async () => {
     const onClick = jest.fn();
     render(<Tabs tabs={tabs} onClick={onClick} />);
 
-    userEvent.click(screen.getByRole('button', { name: 'Tab1' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Tab1' }));
     expect(onClick).toHaveBeenCalled();
   });
 });