From 3b440553f50e630f9c58d2ca313d2933fa030ed3 Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Sun, 6 Oct 2024 21:25:54 +0200
Subject: [PATCH 1/5] [test] Add missing async

---
 .../src/Checkbox/Root/CheckboxRoot.test.tsx   | 24 +++----
 .../src/Dialog/Root/DialogRoot.test.tsx       |  4 +-
 .../CheckboxItem/MenuCheckboxItem.test.tsx    |  6 +-
 .../mui-base/src/Menu/Item/MenuItem.test.tsx  |  2 +-
 .../src/Menu/RadioItem/MenuRadioItem.test.tsx |  4 +-
 .../mui-base/src/Menu/Root/MenuRoot.test.tsx  | 28 ++++----
 .../src/Menu/Trigger/MenuTrigger.test.tsx     |  2 +-
 .../RadioGroup/Root/RadioGroupRoot.test.tsx   |  2 +-
 .../src/Slider/Root/SliderRoot.test.tsx       | 72 +++++++++----------
 .../src/Switch/Root/SwitchRoot.test.tsx       | 18 ++---
 .../mui-base/src/Tabs/Root/TabsRoot.test.tsx  | 46 ++++++------
 .../src/Tabs/TabsList/TabsList.test.tsx       |  6 +-
 12 files changed, 107 insertions(+), 107 deletions(-)

diff --git a/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx b/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx
index a45c771944..5f136f54be 100644
--- a/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx
+++ b/packages/mui-base/src/Checkbox/Root/CheckboxRoot.test.tsx
@@ -30,14 +30,14 @@ describe('<Checkbox.Root />', () => {
     expect(checkbox).to.have.attribute('aria-checked', 'false');
     expect(input.checked).to.equal(false);
 
-    await act(() => {
+    await act(async () => {
       checkbox.click();
     });
 
     expect(checkbox).to.have.attribute('aria-checked', 'true');
     expect(input.checked).to.equal(true);
 
-    await act(() => {
+    await act(async () => {
       checkbox.click();
     });
 
@@ -61,13 +61,13 @@ describe('<Checkbox.Root />', () => {
     const button = getByText('Toggle');
 
     expect(checkbox).to.have.attribute('aria-checked', 'false');
-    await act(() => {
+    await act(async () => {
       button.click();
     });
 
     expect(checkbox).to.have.attribute('aria-checked', 'true');
 
-    await act(() => {
+    await act(async () => {
       button.click();
     });
 
@@ -79,7 +79,7 @@ describe('<Checkbox.Root />', () => {
     const { getAllByRole } = await render(<Checkbox.Root onCheckedChange={handleChange} />);
     const [checkbox] = getAllByRole('checkbox');
 
-    await act(() => {
+    await act(async () => {
       checkbox.click();
     });
 
@@ -104,7 +104,7 @@ describe('<Checkbox.Root />', () => {
 
       expect(checkbox).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         checkbox.click();
       });
 
@@ -129,7 +129,7 @@ describe('<Checkbox.Root />', () => {
 
       expect(checkbox).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         checkbox.click();
       });
 
@@ -149,7 +149,7 @@ describe('<Checkbox.Root />', () => {
 
       expect(checkbox).to.have.attribute('aria-checked', 'mixed');
 
-      await act(() => {
+      await act(async () => {
         checkbox.click();
       });
 
@@ -177,7 +177,7 @@ describe('<Checkbox.Root />', () => {
     const [checkbox] = getAllByRole('checkbox');
     const input = container.querySelector('input[type=checkbox]') as HTMLInputElement;
 
-    await act(() => {
+    await act(async () => {
       input.click();
     });
 
@@ -231,7 +231,7 @@ describe('<Checkbox.Root />', () => {
 
       expect(checkbox).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         label.click();
       });
 
@@ -258,7 +258,7 @@ describe('<Checkbox.Root />', () => {
 
       expect(checkbox).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         label.click();
       });
 
@@ -294,7 +294,7 @@ describe('<Checkbox.Root />', () => {
 
     expect(stringifiedFormData).to.equal('test-checkbox=off');
 
-    await act(() => {
+    await act(async () => {
       checkbox.click();
     });
 
diff --git a/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx b/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx
index aad67629ad..0c7afd8481 100644
--- a/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx
+++ b/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx
@@ -20,7 +20,7 @@ describe('<Dialog.Root />', () => {
       const button = getByRole('button');
       expect(queryByRole('dialog')).to.equal(null);
 
-      await act(() => {
+      await act(async () => {
         button.click();
       });
 
@@ -191,7 +191,7 @@ describe('<Dialog.Root />', () => {
       );
 
       const trigger = getByText('Open');
-      await act(() => {
+      await act(async () => {
         trigger.click();
       });
 
diff --git a/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx b/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx
index 06773890d7..9593007d2c 100644
--- a/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx
+++ b/packages/mui-base/src/Menu/CheckboxItem/MenuCheckboxItem.test.tsx
@@ -88,7 +88,7 @@ describe('<Menu.CheckboxItem />', () => {
     );
 
     const menuItems = getAllByRole('menuitemcheckbox');
-    await act(() => {
+    await act(async () => {
       menuItems[0].focus();
     });
 
@@ -191,7 +191,7 @@ describe('<Menu.CheckboxItem />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Open' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
       await user.keyboard('[ArrowDown]');
@@ -221,7 +221,7 @@ describe('<Menu.CheckboxItem />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Open' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
diff --git a/packages/mui-base/src/Menu/Item/MenuItem.test.tsx b/packages/mui-base/src/Menu/Item/MenuItem.test.tsx
index 004bdc79cb..ccb335ca15 100644
--- a/packages/mui-base/src/Menu/Item/MenuItem.test.tsx
+++ b/packages/mui-base/src/Menu/Item/MenuItem.test.tsx
@@ -88,7 +88,7 @@ describe('<Menu.Item />', () => {
     );
 
     const menuItems = getAllByRole('menuitem');
-    await act(() => {
+    await act(async () => {
       menuItems[0].focus();
     });
 
diff --git a/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx b/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx
index 795b2bc41b..7819cbc12e 100644
--- a/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx
+++ b/packages/mui-base/src/Menu/RadioItem/MenuRadioItem.test.tsx
@@ -116,7 +116,7 @@ describe('<Menu.RadioItem />', () => {
     );
 
     const menuItems = getAllByRole('menuitemradio');
-    await act(() => {
+    await act(async () => {
       menuItems[0].focus();
     });
 
@@ -190,7 +190,7 @@ describe('<Menu.RadioItem />', () => {
         );
 
         const trigger = getByRole('button', { name: 'Open' });
-        await act(() => {
+        await act(async () => {
           trigger.focus();
         });
         await user.keyboard('[ArrowDown]');
diff --git a/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx b/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx
index b97d0dbdd9..b3b41ad617 100644
--- a/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx
+++ b/packages/mui-base/src/Menu/Root/MenuRoot.test.tsx
@@ -26,7 +26,7 @@ describe('<Menu.Root />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Toggle' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -71,7 +71,7 @@ describe('<Menu.Root />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Toggle' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -110,7 +110,7 @@ describe('<Menu.Root />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Toggle' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -157,7 +157,7 @@ describe('<Menu.Root />', () => {
 
         const items = getAllByRole('menuitem');
 
-        await act(() => {
+        await act(async () => {
           items[0].focus();
         });
 
@@ -256,7 +256,7 @@ describe('<Menu.Root />', () => {
 
         const items = getAllByRole('menuitem');
 
-        await act(() => {
+        await act(async () => {
           items[0].focus();
         });
 
@@ -295,7 +295,7 @@ describe('<Menu.Root />', () => {
 
         const items = getAllByRole('menuitem');
 
-        await act(() => {
+        await act(async () => {
           items[0].focus();
         });
 
@@ -334,7 +334,7 @@ describe('<Menu.Root />', () => {
 
         const items = getAllByRole('menuitem');
 
-        await act(() => {
+        await act(async () => {
           items[0].focus();
         });
 
@@ -368,7 +368,7 @@ describe('<Menu.Root />', () => {
 
         const items = getAllByRole('menuitem');
 
-        await act(() => {
+        await act(async () => {
           items[0].focus();
         });
 
@@ -414,7 +414,7 @@ describe('<Menu.Root />', () => {
 
         const submenuTrigger = getByTestId('submenu-trigger');
 
-        await act(() => {
+        await act(async () => {
           submenuTrigger.focus();
         });
 
@@ -459,7 +459,7 @@ describe('<Menu.Root />', () => {
       const { getAllByRole, getByRole } = await render(<Test />);
 
       const trigger = getByRole('button', { name: 'Toggle' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -478,7 +478,7 @@ describe('<Menu.Root />', () => {
       const { getByRole, getAllByRole } = await render(<Test />);
 
       const trigger = getByRole('button', { name: 'Toggle' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -497,7 +497,7 @@ describe('<Menu.Root />', () => {
 
       const trigger = getByRole('button', { name: 'Toggle' });
 
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -593,7 +593,7 @@ describe('<Menu.Root />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Open' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
@@ -640,7 +640,7 @@ describe('<Menu.Root />', () => {
       );
 
       const trigger = getByRole('button', { name: 'Open' });
-      await act(() => {
+      await act(async () => {
         trigger.focus();
       });
 
diff --git a/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx b/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx
index 91892d6392..16b2500104 100644
--- a/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx
+++ b/packages/mui-base/src/Menu/Trigger/MenuTrigger.test.tsx
@@ -118,7 +118,7 @@ describe('<Menu.Trigger />', () => {
           );
 
           const button = getByRole('button', { name: 'Open' });
-          await act(() => {
+          await act(async () => {
             button.focus();
           });
 
diff --git a/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx b/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx
index a1cafaf64e..ff9cc5b449 100644
--- a/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx
+++ b/packages/mui-base/src/RadioGroup/Root/RadioGroupRoot.test.tsx
@@ -186,7 +186,7 @@ describe('<RadioGroup.Root />', () => {
 
     expect(stringifiedFormData).to.equal('group=');
 
-    await act(() => {
+    await act(async () => {
       radioA.click();
     });
 
diff --git a/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx b/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx
index d106d49fea..6a1741c2b7 100644
--- a/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx
+++ b/packages/mui-base/src/Slider/Root/SliderRoot.test.tsx
@@ -145,7 +145,7 @@ describe('<Slider.Root />', () => {
     it('should update aria-valuenow', async () => {
       const { getByRole } = await render(<TestSlider defaultValue={50} />);
       const slider = getByRole('slider');
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -206,7 +206,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -229,7 +229,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -252,7 +252,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -275,7 +275,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -464,7 +464,7 @@ describe('<Slider.Root />', () => {
       );
       const slider = getByRole('slider');
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -484,7 +484,7 @@ describe('<Slider.Root />', () => {
       );
       const slider = getByRole('slider');
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -493,7 +493,7 @@ describe('<Slider.Root />', () => {
         () => GETBOUNDINGCLIENTRECT_HORIZONTAL_SLIDER_RETURN_VAL,
       );
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -523,7 +523,7 @@ describe('<Slider.Root />', () => {
       );
       const slider = getByRole('slider');
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -532,7 +532,7 @@ describe('<Slider.Root />', () => {
         () => GETBOUNDINGCLIENTRECT_HORIZONTAL_SLIDER_RETURN_VAL,
       );
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -556,7 +556,7 @@ describe('<Slider.Root />', () => {
       );
       const slider = getByRole('slider');
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -565,7 +565,7 @@ describe('<Slider.Root />', () => {
         () => GETBOUNDINGCLIENTRECT_HORIZONTAL_SLIDER_RETURN_VAL,
       );
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -603,7 +603,7 @@ describe('<Slider.Root />', () => {
       );
 
       const slider = getByRole('slider');
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -623,7 +623,7 @@ describe('<Slider.Root />', () => {
       );
 
       const slider = getByRole('slider');
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -678,7 +678,7 @@ describe('<Slider.Root />', () => {
         <TestSlider defaultValue={150} step={100} max={750} min={MIN} />,
       );
       const slider = getByRole('slider');
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -690,7 +690,7 @@ describe('<Slider.Root />', () => {
         <TestSlider defaultValue={150} step={100} max={750} min={MIN} />,
       );
       const slider = getByRole('slider');
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -715,7 +715,7 @@ describe('<Slider.Root />', () => {
       const thumbOne = getByTestId('thumb-0');
       const thumbTwo = getByTestId('thumb-1');
 
-      await act(() => {
+      await act(async () => {
         thumbOne.focus();
       });
 
@@ -725,7 +725,7 @@ describe('<Slider.Root />', () => {
       fireEvent.keyDown(thumbOne, { key: 'ArrowUp' });
       expect(handleValueChange.callCount).to.equal(1);
 
-      await act(() => {
+      await act(async () => {
         thumbTwo.focus();
       });
 
@@ -774,7 +774,7 @@ describe('<Slider.Root />', () => {
       expect(handleValueCommitted.callCount).to.equal(1);
       expect(handleValueCommitted.args[0][0]).to.equal(10);
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
 
@@ -1120,7 +1120,7 @@ describe('<Slider.Root />', () => {
       );
 
       const button = getByText('Submit');
-      await act(() => {
+      await act(async () => {
         button.click();
       });
     });
@@ -1257,7 +1257,7 @@ describe('<Slider.Root />', () => {
       );
       const slider = getByRole('slider');
 
-      await act(() => {
+      await act(async () => {
         slider.focus();
       });
       fireEvent.change(slider, {
@@ -1286,7 +1286,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1309,7 +1309,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1332,7 +1332,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1355,7 +1355,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1379,7 +1379,7 @@ describe('<Slider.Root />', () => {
 
         fireEvent.keyDown(document.body, { key: 'TAB' });
 
-        await act(() => {
+        await act(async () => {
           (input as HTMLInputElement).focus();
         });
 
@@ -1397,7 +1397,7 @@ describe('<Slider.Root />', () => {
         const thumbOne = getByTestId('thumb-0');
         const thumbTwo = getByTestId('thumb-1');
 
-        await act(() => {
+        await act(async () => {
           thumbOne.focus();
         });
 
@@ -1407,7 +1407,7 @@ describe('<Slider.Root />', () => {
         fireEvent.keyDown(thumbOne, { key: 'End' });
         expect(handleValueChange.callCount).to.equal(1);
 
-        await act(() => {
+        await act(async () => {
           thumbTwo.focus();
         });
 
@@ -1428,7 +1428,7 @@ describe('<Slider.Root />', () => {
 
         fireEvent.keyDown(document.body, { key: 'TAB' });
 
-        await act(() => {
+        await act(async () => {
           (input as HTMLInputElement).focus();
         });
 
@@ -1446,7 +1446,7 @@ describe('<Slider.Root />', () => {
         const thumbOne = getByTestId('thumb-0');
         const thumbTwo = getByTestId('thumb-1');
 
-        await act(() => {
+        await act(async () => {
           thumbTwo.focus();
         });
 
@@ -1456,7 +1456,7 @@ describe('<Slider.Root />', () => {
         fireEvent.keyDown(thumbTwo, { key: 'Home' });
         expect(handleValueChange.callCount).to.equal(1);
 
-        await act(() => {
+        await act(async () => {
           thumbOne.focus();
         });
 
@@ -1476,7 +1476,7 @@ describe('<Slider.Root />', () => {
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
 
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1498,7 +1498,7 @@ describe('<Slider.Root />', () => {
       const input = container.querySelector('input');
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1520,7 +1520,7 @@ describe('<Slider.Root />', () => {
       const input = container.querySelector('input');
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1550,7 +1550,7 @@ describe('<Slider.Root />', () => {
       const input = container.querySelector('input');
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
@@ -1574,7 +1574,7 @@ describe('<Slider.Root />', () => {
       const input = container.querySelector('input');
 
       fireEvent.keyDown(document.body, { key: 'TAB' });
-      await act(() => {
+      await act(async () => {
         (input as HTMLInputElement).focus();
       });
 
diff --git a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx
index 844bff0e1d..ecfc916451 100644
--- a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx
+++ b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx
@@ -21,7 +21,7 @@ describe('<Switch.Root />', () => {
 
       expect(switchElement).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         switchElement.click();
       });
 
@@ -44,13 +44,13 @@ describe('<Switch.Root />', () => {
       const button = getByText('Toggle');
 
       expect(switchElement).to.have.attribute('aria-checked', 'false');
-      await act(() => {
+      await act(async () => {
         button.click();
       });
 
       expect(switchElement).to.have.attribute('aria-checked', 'true');
 
-      await act(() => {
+      await act(async () => {
         button.click();
       });
 
@@ -62,7 +62,7 @@ describe('<Switch.Root />', () => {
       const switchElement = screen.getByRole('switch');
       const internalInput = screen.getByRole('checkbox', { hidden: true });
 
-      await act(() => {
+      await act(async () => {
         internalInput.click();
       });
 
@@ -84,7 +84,7 @@ describe('<Switch.Root />', () => {
       const { getByRole } = await render(<Switch.Root onCheckedChange={handleChange} />);
       const switchElement = getByRole('switch');
 
-      await act(() => {
+      await act(async () => {
         switchElement.click();
       });
 
@@ -99,7 +99,7 @@ describe('<Switch.Root />', () => {
       const { getByRole } = await render(<Switch.Root onClick={handleClick} />);
       const switchElement = getByRole('switch');
 
-      await act(() => {
+      await act(async () => {
         switchElement.click();
       });
 
@@ -124,7 +124,7 @@ describe('<Switch.Root />', () => {
 
       expect(switchElement).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         switchElement.click();
       });
 
@@ -149,7 +149,7 @@ describe('<Switch.Root />', () => {
 
       expect(switchElement).to.have.attribute('aria-checked', 'false');
 
-      await act(() => {
+      await act(async () => {
         switchElement.click();
       });
 
@@ -236,7 +236,7 @@ describe('<Switch.Root />', () => {
 
       expect(stringifiedFormData).to.equal('test-switch=off');
 
-      await act(() => {
+      await act(async () => {
         switchElement.click();
       });
 
diff --git a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
index 18c46cc3fa..3d410c53f3 100644
--- a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
+++ b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
@@ -153,7 +153,7 @@ describe('<Tabs.Root />', () => {
             tabElements[index].id,
           );
 
-          await act(() => {
+          await act(async () => {
             tabElements[index].click();
           });
 
@@ -207,7 +207,7 @@ describe('<Tabs.Root />', () => {
       );
       const [firstTab] = getAllByRole('tab');
 
-      await act(() => {
+      await act(async () => {
         firstTab.focus();
       });
 
@@ -230,7 +230,7 @@ describe('<Tabs.Root />', () => {
 
       const [firstTab] = getAllByRole('tab');
 
-      await act(() => {
+      await act(async () => {
         firstTab.focus();
       });
 
@@ -294,7 +294,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [firstTab, , lastTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 firstTab.focus();
               });
 
@@ -325,7 +325,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [firstTab, secondTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 secondTab.focus();
               });
 
@@ -358,7 +358,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [firstTab, , lastTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 firstTab.focus();
               });
 
@@ -390,7 +390,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [firstTab, secondTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 secondTab.focus();
               });
 
@@ -421,7 +421,7 @@ describe('<Tabs.Root />', () => {
               </Tabs.Root>,
             );
             const [firstTab, , lastTab] = getAllByRole('tab');
-            await act(() => {
+            await act(async () => {
               lastTab.focus();
             });
 
@@ -454,7 +454,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [firstTab, , lastTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 lastTab.focus();
               });
 
@@ -485,7 +485,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [, secondTab, lastTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 secondTab.focus();
               });
 
@@ -518,7 +518,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [firstTab, , lastTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 lastTab.focus();
               });
 
@@ -550,7 +550,7 @@ describe('<Tabs.Root />', () => {
                 </Tabs.Root>,
               );
               const [, secondTab, lastTab] = getAllByRole('tab');
-              await act(() => {
+              await act(async () => {
                 secondTab.focus();
               });
 
@@ -581,7 +581,7 @@ describe('<Tabs.Root />', () => {
               </Tabs.Root>,
             );
             const [firstTab, , lastTab] = getAllByRole('tab');
-            await act(() => {
+            await act(async () => {
               firstTab.focus();
             });
 
@@ -610,7 +610,7 @@ describe('<Tabs.Root />', () => {
             </Tabs.Root>,
           );
           const [firstTab, , lastTab] = getAllByRole('tab');
-          await act(() => {
+          await act(async () => {
             lastTab.focus();
           });
 
@@ -635,7 +635,7 @@ describe('<Tabs.Root />', () => {
             </Tabs.Root>,
           );
           const [firstTab, , lastTab] = getAllByRole('tab');
-          await act(() => {
+          await act(async () => {
             lastTab.focus();
           });
 
@@ -660,7 +660,7 @@ describe('<Tabs.Root />', () => {
             </Tabs.Root>,
           );
           const [, secondTab, lastTab] = getAllByRole('tab');
-          await act(() => {
+          await act(async () => {
             lastTab.focus();
           });
 
@@ -686,7 +686,7 @@ describe('<Tabs.Root />', () => {
             </Tabs.Root>,
           );
           const [firstTab, , lastTab] = getAllByRole('tab');
-          await act(() => {
+          await act(async () => {
             firstTab.focus();
           });
 
@@ -711,7 +711,7 @@ describe('<Tabs.Root />', () => {
             </Tabs.Root>,
           );
           const [firstTab, , lastTab] = getAllByRole('tab');
-          await act(() => {
+          await act(async () => {
             firstTab.focus();
           });
 
@@ -736,7 +736,7 @@ describe('<Tabs.Root />', () => {
             </Tabs.Root>,
           );
           const [firstTab, secondTab] = getAllByRole('tab');
-          await act(() => {
+          await act(async () => {
             firstTab.focus();
           });
 
@@ -787,13 +787,13 @@ describe('<Tabs.Root />', () => {
       const tabs = getAllByRole('tab');
 
       expect(root).to.have.attribute('data-activation-direction', 'none');
-      await act(() => {
+      await act(async () => {
         tabs[1].click();
       });
 
       expect(root).to.have.attribute('data-activation-direction', 'right');
 
-      await act(() => {
+      await act(async () => {
         tabs[0].click();
       });
 
@@ -814,13 +814,13 @@ describe('<Tabs.Root />', () => {
       const tabs = getAllByRole('tab');
 
       expect(root).to.have.attribute('data-activation-direction', 'none');
-      await act(() => {
+      await act(async () => {
         tabs[1].click();
       });
 
       expect(root).to.have.attribute('data-activation-direction', 'down');
 
-      await act(() => {
+      await act(async () => {
         tabs[0].click();
       });
 
diff --git a/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx b/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx
index 1979841892..0d67df506f 100644
--- a/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx
+++ b/packages/mui-base/src/Tabs/TabsList/TabsList.test.tsx
@@ -50,7 +50,7 @@ describe('<Tabs.List />', () => {
       expect(tab2).to.have.attribute('aria-selected', 'false');
       expect(tab3).to.have.attribute('aria-selected', 'false');
 
-      await act(() => {
+      await act(async () => {
         tab2.click();
       });
 
@@ -58,7 +58,7 @@ describe('<Tabs.List />', () => {
       expect(tab2).to.have.attribute('aria-selected', 'true');
       expect(tab3).to.have.attribute('aria-selected', 'false');
 
-      await act(() => {
+      await act(async () => {
         tab3.click();
       });
 
@@ -66,7 +66,7 @@ describe('<Tabs.List />', () => {
       expect(tab2).to.have.attribute('aria-selected', 'false');
       expect(tab3).to.have.attribute('aria-selected', 'true');
 
-      await act(() => {
+      await act(async () => {
         tab1.click();
       });
 

From 71f64e213efbd8c6fc1c56f4f46dfe8e0b327cab Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Sun, 6 Oct 2024 22:04:26 +0200
Subject: [PATCH 2/5] fix ci

---
 packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
index 3d410c53f3..4571e83b3c 100644
--- a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
+++ b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
@@ -153,7 +153,7 @@ describe('<Tabs.Root />', () => {
             tabElements[index].id,
           );
 
-          await act(async () => {
+          await act(() => {
             tabElements[index].click();
           });
 

From 3da6e66eebf9c29d68a718504f97fa63d7de048f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Dudak?= <michal@mui.com>
Date: Tue, 8 Oct 2024 10:23:23 +0200
Subject: [PATCH 3/5] Add missing async

---
 .../Input/NumberFieldInput.test.tsx           | 24 +++++++++----------
 .../NumberField/Root/NumberFieldRoot.test.tsx |  8 +++----
 .../PreviewCard/Root/PreviewCardRoot.test.tsx |  2 +-
 .../mui-base/src/Tabs/Root/TabsRoot.test.tsx  |  2 +-
 .../src/Tooltip/Root/TooltipRoot.test.tsx     |  2 +-
 5 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
index 46e0efb05c..b9c97f0936 100644
--- a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
+++ b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
@@ -44,7 +44,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: 'abc' } });
     expect(input).to.have.value('');
   });
@@ -56,7 +56,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.keyDown(input, { key: 'a' });
     expect(input).to.have.value('');
   });
@@ -68,7 +68,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: '123' } });
     expect(input).to.have.value('123');
   });
@@ -80,7 +80,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.keyDown(input, { key: 'ArrowUp' });
     expect(input).to.have.value('1');
   });
@@ -92,7 +92,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.keyDown(input, { key: 'ArrowDown' });
     expect(input).to.have.value('-1');
   });
@@ -104,7 +104,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.keyDown(input, { key: 'Home' });
     expect(input).to.have.value('-10');
   });
@@ -116,7 +116,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.keyDown(input, { key: 'End' });
     expect(input).to.have.value('10');
   });
@@ -128,7 +128,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: '1234' } });
     expect(input).to.have.value('1234');
     fireEvent.blur(input);
@@ -142,7 +142,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: '-1' } });
     expect(input).to.have.value('-1');
     fireEvent.blur(input);
@@ -156,7 +156,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: '1' } });
     expect(input).to.have.value('1');
     fireEvent.blur(input);
@@ -170,7 +170,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: '1.1' } });
     expect(input).to.have.value('1.1');
     fireEvent.blur(input);
@@ -184,7 +184,7 @@ describe('<NumberField.Input />', () => {
       </NumberField.Root>,
     );
     const input = screen.getByRole('textbox');
-    await act(() => input.focus());
+    await act(async () => input.focus());
     fireEvent.change(input, { target: { value: '3' } });
     expect(input).to.have.value('3');
     fireEvent.blur(input);
diff --git a/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx b/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx
index 5f77243074..24b9547e17 100644
--- a/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx
+++ b/packages/mui-base/src/NumberField/Root/NumberFieldRoot.test.tsx
@@ -422,7 +422,7 @@ describe('<NumberField />', () => {
     it('should allow the user to scrub the input value with the mouse wheel', async () => {
       await render(<NumberField defaultValue={5} allowWheelScrub />);
       const input = screen.getByRole('textbox');
-      await act(() => input.focus());
+      await act(async () => input.focus());
       fireEvent.wheel(input, { deltaY: 1 });
       expect(input).to.have.value('4');
       fireEvent.wheel(input, { deltaY: -1 });
@@ -432,7 +432,7 @@ describe('<NumberField />', () => {
     it('should not allow the user to scrub the input value with the mouse wheel if `allowWheelScrub` is `false`', async () => {
       await render(<NumberField defaultValue={5} allowWheelScrub={false} />);
       const input = screen.getByRole('textbox');
-      await act(() => input.focus());
+      await act(async () => input.focus());
       fireEvent.wheel(input, { deltaY: 1 });
       expect(input).to.have.value('5');
       fireEvent.wheel(input, { deltaY: -5 });
@@ -467,13 +467,13 @@ describe('<NumberField />', () => {
       const numberField = screen.getByRole('textbox');
       const submitButton = screen.getByTestId('submit');
 
-      await act(() => submitButton.click());
+      await act(async () => submitButton.click());
 
       expect(stringifiedFormData).to.equal('test-number-field=');
 
       fireEvent.change(numberField, { target: { value: '5' } });
 
-      await act(() => submitButton.click());
+      await act(async () => submitButton.click());
 
       expect(stringifiedFormData).to.equal('test-number-field=5');
     });
diff --git a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx
index ed4bbe3241..14d80b1e64 100644
--- a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx
+++ b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx
@@ -91,7 +91,7 @@ describe('<PreviewCard.Root />', () => {
 
       const trigger = screen.getByRole('link');
 
-      await act(() => trigger.focus());
+      await act(async () => trigger.focus());
 
       clock.tick(OPEN_DELAY);
 
diff --git a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
index 4571e83b3c..3d410c53f3 100644
--- a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
+++ b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
@@ -153,7 +153,7 @@ describe('<Tabs.Root />', () => {
             tabElements[index].id,
           );
 
-          await act(() => {
+          await act(async () => {
             tabElements[index].click();
           });
 
diff --git a/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx b/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx
index 5f03c1aa4f..a73c749016 100644
--- a/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx
+++ b/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx
@@ -81,7 +81,7 @@ describe('<Tooltip.Root />', () => {
 
       const trigger = screen.getByRole('button');
 
-      await act(() => trigger.focus());
+      await act(async () => trigger.focus());
 
       await flushMicrotasks();
 

From 471c153fffa8f4b6c3c2b59d29507357aa301dcc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Dudak?= <michal@mui.com>
Date: Tue, 8 Oct 2024 10:48:18 +0200
Subject: [PATCH 4/5] wtf

---
 packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
index 3d410c53f3..4571e83b3c 100644
--- a/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
+++ b/packages/mui-base/src/Tabs/Root/TabsRoot.test.tsx
@@ -153,7 +153,7 @@ describe('<Tabs.Root />', () => {
             tabElements[index].id,
           );
 
-          await act(async () => {
+          await act(() => {
             tabElements[index].click();
           });
 

From b1775587c141d18b5baf86a88417ab640b3d213e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Dudak?= <michal@mui.com>
Date: Tue, 8 Oct 2024 10:53:43 +0200
Subject: [PATCH 5/5] Fix flaky popover test

---
 packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx
index 657e47d735..1beb906953 100644
--- a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx
+++ b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx
@@ -352,8 +352,11 @@ describe('<Popover.Root />', () => {
 
     await user.click(close);
 
-    await waitFor(() => {
-      expect(toggle).toHaveFocus();
-    });
+    await waitFor(
+      () => {
+        expect(toggle).toHaveFocus();
+      },
+      { timeout: 1500 },
+    );
   });
 });