diff --git a/docs/package.json b/docs/package.json
index 1d77cb4523a..cb9b1b57804 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -77,7 +77,7 @@
"@babel/plugin-transform-react-constant-elements": "^7.24.6",
"@babel/preset-typescript": "^7.24.6",
"@mui/internal-docs-utils": "^1.0.7",
- "@mui/internal-test-utils": "1.0.0-dev.20240529-082515-213b5e33ab",
+ "@mui/internal-test-utils": "1.0.3",
"@types/autosuggest-highlight": "^3.2.3",
"@types/chai": "^4.3.16",
"@types/node": "^18.19.33",
diff --git a/package.json b/package.json
index fa216344584..1b28ab9db29 100644
--- a/package.json
+++ b/package.json
@@ -76,18 +76,16 @@
"@babel/preset-react": "^7.24.6",
"@babel/preset-typescript": "^7.24.6",
"@babel/register": "^7.24.6",
- "@mnajdova/enzyme-adapter-react-18": "^0.2.0",
"@mui/internal-docs-utils": "^1.0.7",
"@mui/internal-markdown": "^1.0.6",
"@mui/internal-scripts": "^1.0.11",
- "@mui/internal-test-utils": "1.0.0-dev.20240529-082515-213b5e33ab",
+ "@mui/internal-test-utils": "1.0.3",
"@mui/material": "6.0.0-alpha.13",
"@mui/monorepo": "github:mui/material-ui#v6.0.0-alpha.12",
"@mui/utils": "6.0.0-alpha.13",
"@next/eslint-plugin-next": "^14.2.3",
"@octokit/rest": "^20.1.1",
"@playwright/test": "1.44.1",
- "@types/enzyme": "^3.10.18",
"@types/fs-extra": "^11.0.4",
"@types/lodash": "^4.17.4",
"@types/mocha": "^10.0.6",
@@ -110,7 +108,6 @@
"cross-env": "^7.0.3",
"danger": "^12.1.0",
"docs": "workspace:^",
- "enzyme": "^3.11.0",
"eslint": "^8.57.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-base": "^15.0.0",
diff --git a/packages/mui-base/package.json b/packages/mui-base/package.json
index 037cb0e2987..5cd9af24012 100644
--- a/packages/mui-base/package.json
+++ b/packages/mui-base/package.json
@@ -50,7 +50,7 @@
},
"devDependencies": {
"@mui/internal-babel-macros": "^1.0.1",
- "@mui/internal-test-utils": "1.0.0-dev.20240529-082515-213b5e33ab",
+ "@mui/internal-test-utils": "1.0.3",
"@testing-library/react": "^15.0.7",
"@testing-library/user-event": "^14.5.2",
"@types/chai": "^4.3.16",
diff --git a/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx b/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx
index 8c7bc4821a9..c9eaf7a2717 100644
--- a/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx
+++ b/packages/mui-base/src/AlertDialog/Backdrop/AlertDialogBackdrop.test.tsx
@@ -15,7 +15,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('has role="presentation"', async () => {
diff --git a/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx b/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx
index f9badc3bb27..a1b75962a62 100644
--- a/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx
+++ b/packages/mui-base/src/AlertDialog/Close/AlertDialogClose.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx b/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx
index f4e3cb10e4f..a375ebd9d76 100644
--- a/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx
+++ b/packages/mui-base/src/AlertDialog/Description/AlertDialogDescription.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx b/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx
index 48f59b16845..42886490109 100644
--- a/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx
+++ b/packages/mui-base/src/AlertDialog/Popup/AlertDialogPopup.test.tsx
@@ -16,7 +16,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('should have role="alertdialog"', async () => {
diff --git a/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx b/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx
index d8f41b4fabe..c164da8ab03 100644
--- a/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx
+++ b/packages/mui-base/src/AlertDialog/Title/AlertDialogTitle.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx b/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx
index 513a6d57a2b..f90c8fcac3b 100644
--- a/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx
+++ b/packages/mui-base/src/AlertDialog/Trigger/AlertDialogTrigger.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx b/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx
index 2f682d49fbd..c058e42eea6 100644
--- a/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx
+++ b/packages/mui-base/src/Checkbox/Indicator/CheckboxIndicator.test.tsx
@@ -24,7 +24,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('should not render indicator by default', () => {
diff --git a/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx b/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx
index b29002bd2e4..0dd02a95843 100644
--- a/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx
+++ b/packages/mui-base/src/Dialog/Backdrop/DialogBackdrop.test.tsx
@@ -16,7 +16,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('has role="presentation"', () => {
diff --git a/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx b/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx
index 6bc1eabc85e..542b781d143 100644
--- a/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx
+++ b/packages/mui-base/src/Dialog/Close/DialogClose.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx b/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx
index 7a9a8df1139..147a614d5a8 100644
--- a/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx
+++ b/packages/mui-base/src/Dialog/Description/DialogDescription.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx b/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx
index 901afa4a38a..8469627cef4 100644
--- a/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx
+++ b/packages/mui-base/src/Dialog/Popup/DialogPopup.test.tsx
@@ -15,7 +15,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
describe('prop: keepMounted', () => {
diff --git a/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx b/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx
index d31cc84e2a6..a62a2ca467a 100644
--- a/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx
+++ b/packages/mui-base/src/Dialog/Root/DialogRoot.test.tsx
@@ -54,7 +54,9 @@ describe('', () => {
});
});
- describe('prop: modal', () => {
+ // toWarnDev doesn't work reliably with async rendering. To re-eanble after it's fixed in the test-utils.
+ // eslint-disable-next-line mocha/no-skipped-tests
+ describe.skip('prop: modal', () => {
it('warns when the dialog is modal but no backdrop is present', async () => {
await expect(() =>
render(
diff --git a/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx b/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx
index 6470c88d4b2..072dfb20b76 100644
--- a/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx
+++ b/packages/mui-base/src/Dialog/Title/DialogTitle.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx b/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx
index 3ed1cc81e5c..d13535e1851 100644
--- a/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx
+++ b/packages/mui-base/src/Dialog/Trigger/DialogTrigger.test.tsx
@@ -15,6 +15,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx b/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx
index f4451f6a5c9..9498db77c41 100644
--- a/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx
+++ b/packages/mui-base/src/NumberField/Decrement/NumberFieldDecrement.test.tsx
@@ -28,7 +28,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('has decrease label', () => {
diff --git a/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx b/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx
index fc6ea7a9775..ce0cce6cc68 100644
--- a/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx
+++ b/packages/mui-base/src/NumberField/Group/NumberFieldGroup.test.tsx
@@ -27,7 +27,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('has role prop', () => {
diff --git a/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx b/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx
index fe64692216e..4b907fe6057 100644
--- a/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx
+++ b/packages/mui-base/src/NumberField/Increment/NumberFieldIncrement.test.tsx
@@ -28,7 +28,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('has increase label', () => {
diff --git a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
index e1c1a0237a9..ca3f9fed26b 100644
--- a/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
+++ b/packages/mui-base/src/NumberField/Input/NumberFieldInput.test.tsx
@@ -27,7 +27,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('has textbox role', () => {
diff --git a/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx b/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx
index db97a2ccdc0..07479ef4004 100644
--- a/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx
+++ b/packages/mui-base/src/NumberField/ScrubArea/NumberFieldScrubArea.test.tsx
@@ -36,7 +36,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('has presentation role', () => {
diff --git a/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx b/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx
index b5e32317a7d..c1acf088af4 100644
--- a/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx
+++ b/packages/mui-base/src/NumberField/ScrubAreaCursor/NumberFieldScrubAreaCursor.test.tsx
@@ -34,7 +34,6 @@ describe('', () => {
{node},
);
},
- skip: ['reactTestRenderer'],
}));
it('has presentation role', () => {
diff --git a/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx b/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx
index 32c32fa75a0..ea5149d92c8 100644
--- a/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx
+++ b/packages/mui-base/src/Popover/Arrow/PopoverArrow.test.tsx
@@ -18,6 +18,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx b/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx
index 9488d64b437..bafeaa43f15 100644
--- a/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx
+++ b/packages/mui-base/src/Popover/Backdrop/PopoverBackdrop.test.tsx
@@ -16,6 +16,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx b/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx
index a3d927ac55c..e76e7a49db7 100644
--- a/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx
+++ b/packages/mui-base/src/Popover/Close/PopoverClose.test.tsx
@@ -20,7 +20,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('should close popover when clicked', async () => {
diff --git a/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx b/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx
index 26d23fadc04..e874e352a9a 100644
--- a/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx
+++ b/packages/mui-base/src/Popover/Description/PopoverDescription.test.tsx
@@ -20,7 +20,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('describes the popup element with its id', async () => {
diff --git a/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx b/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx
index 0cd284952ee..a266fb84625 100644
--- a/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx
+++ b/packages/mui-base/src/Popover/Popup/PopoverPopup.test.tsx
@@ -18,7 +18,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('should render the children', async () => {
diff --git a/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx b/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx
index 672bb1dc7b8..bdb6770b7c1 100644
--- a/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx
+++ b/packages/mui-base/src/Popover/Positioner/PopoverPositioner.test.tsx
@@ -16,6 +16,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx
index 4b5c09f12fd..8fbe91cd88e 100644
--- a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx
+++ b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx
@@ -1,13 +1,11 @@
import * as React from 'react';
import * as Popover from '@base_ui/react/Popover';
-import { act, fireEvent, screen } from '@mui/internal-test-utils';
+import { fireEvent, flushMicrotasks, screen } from '@mui/internal-test-utils';
import { expect } from 'chai';
import { spy } from 'sinon';
import { createRenderer } from '../../../test';
import { OPEN_DELAY } from '../utils/constants';
-const waitForPosition = async () => act(async () => {});
-
function Root(props: Popover.RootProps) {
return ;
}
@@ -15,8 +13,8 @@ function Root(props: Popover.RootProps) {
describe('', () => {
const { render, clock } = createRenderer();
- it('should render the children', () => {
- render(
+ it('should render the children', async () => {
+ await render(
Content
,
@@ -27,7 +25,7 @@ describe('', () => {
describe('uncontrolled open', () => {
it('should open when the anchor is clicked', async () => {
- render(
+ await render(
@@ -40,13 +38,13 @@ describe('', () => {
fireEvent.click(anchor);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
});
it('should close when the anchor is clicked twice', async () => {
- render(
+ await render(
@@ -59,7 +57,7 @@ describe('', () => {
fireEvent.click(anchor);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
@@ -116,7 +114,7 @@ describe('', () => {
);
}
- render();
+ await render();
expect(screen.queryByText('Content')).to.equal(null);
@@ -124,7 +122,7 @@ describe('', () => {
fireEvent.click(anchor);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
@@ -158,7 +156,7 @@ describe('', () => {
);
}
- render();
+ await render();
expect(screen.queryByText('Content')).to.equal(null);
@@ -166,7 +164,7 @@ describe('', () => {
fireEvent.click(anchor);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
expect(handleChange.callCount).to.equal(1);
@@ -238,7 +236,7 @@ describe('', () => {
clock.withFakeTimers();
it('should open after delay with rest type by default', async () => {
- render(
+ await render(
@@ -252,19 +250,19 @@ describe('', () => {
fireEvent.mouseEnter(anchor);
fireEvent.mouseMove(anchor);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.queryByText('Content')).to.equal(null);
clock.tick(100);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
});
it('should open after delay with hover type', async () => {
- render(
+ await render(
@@ -278,13 +276,13 @@ describe('', () => {
fireEvent.mouseEnter(anchor);
clock.tick(OPEN_DELAY / 2);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.queryByText('Content')).to.equal(null);
clock.tick(OPEN_DELAY / 2);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
});
@@ -294,7 +292,7 @@ describe('', () => {
clock.withFakeTimers();
it('should close after delay', async () => {
- render(
+ await render(
@@ -310,7 +308,7 @@ describe('', () => {
clock.tick(OPEN_DELAY);
- await waitForPosition();
+ await flushMicrotasks();
expect(screen.getByText('Content')).not.to.equal(null);
diff --git a/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx b/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx
index 6cc738132cb..c08b03c69d3 100644
--- a/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx
+++ b/packages/mui-base/src/Popover/Title/PopoverTitle.test.tsx
@@ -20,7 +20,6 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
it('labels the popup element with its id', async () => {
diff --git a/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx b/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx
index c88dbb82bdd..5cf8e23f005 100644
--- a/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx
+++ b/packages/mui-base/src/Popover/Trigger/PopoverTrigger.test.tsx
@@ -16,6 +16,5 @@ describe('', () => {
,
);
},
- skip: ['reactTestRenderer'],
}));
});
diff --git a/packages/mui-base/src/Slider/Control/SliderControl.test.tsx b/packages/mui-base/src/Slider/Control/SliderControl.test.tsx
index 581f318436a..62cea7659e7 100644
--- a/packages/mui-base/src/Slider/Control/SliderControl.test.tsx
+++ b/packages/mui-base/src/Slider/Control/SliderControl.test.tsx
@@ -65,8 +65,5 @@ describe('', () => {
return { container, ...other };
},
refInstanceof: window.HTMLSpanElement,
- skip: [
- 'reactTestRenderer', // Need to be wrapped with SliderProvider
- ],
}));
});
diff --git a/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx b/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx
index 5e1526e1a8e..c1175c09436 100644
--- a/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx
+++ b/packages/mui-base/src/Slider/Indicator/SliderIndicator.test.tsx
@@ -65,8 +65,5 @@ describe('', () => {
return { container, ...other };
},
refInstanceof: window.HTMLSpanElement,
- skip: [
- 'reactTestRenderer', // Need to be wrapped with SliderProvider
- ],
}));
});
diff --git a/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx b/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx
index a354e4a8b4b..4167c40d915 100644
--- a/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx
+++ b/packages/mui-base/src/Slider/Output/SliderOutput.test.tsx
@@ -66,9 +66,6 @@ describe('', () => {
return { container, ...other };
},
refInstanceof: window.HTMLOutputElement,
- skip: [
- 'reactTestRenderer', // Need to be wrapped with SliderProvider
- ],
}));
it('renders a single value', () => {
diff --git a/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx b/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx
index 5d57e3b3226..22376a55f79 100644
--- a/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx
+++ b/packages/mui-base/src/Slider/Thumb/SliderThumb.test.tsx
@@ -65,8 +65,5 @@ describe('', () => {
return { container, ...other };
},
refInstanceof: window.HTMLSpanElement,
- skip: [
- 'reactTestRenderer', // Need to be wrapped with SliderProvider
- ],
}));
});
diff --git a/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx b/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx
index 07d6ca49df8..0e6467bcfae 100644
--- a/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx
+++ b/packages/mui-base/src/Slider/Track/SliderTrack.test.tsx
@@ -65,8 +65,5 @@ describe('', () => {
return { container, ...other };
},
refInstanceof: window.HTMLSpanElement,
- skip: [
- 'reactTestRenderer', // Need to be wrapped with SliderProvider
- ],
}));
});
diff --git a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx
index c124dcae6c9..63154f0eaa9 100644
--- a/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx
+++ b/packages/mui-base/src/Switch/Root/SwitchRoot.test.tsx
@@ -1,9 +1,10 @@
import * as React from 'react';
import { expect } from 'chai';
import { spy } from 'sinon';
-import { createRenderer, act } from '@mui/internal-test-utils';
+import { act } from '@mui/internal-test-utils';
import * as Switch from '@base_ui/react/Switch';
-import { describeConformance } from '../../../test/describeConformance';
+import { userEvent } from '@testing-library/user-event';
+import { describeConformance, createRenderer } from '../../../test';
describe('', () => {
const { render } = createRenderer();
@@ -15,20 +16,20 @@ describe('', () => {
}));
describe('interaction', () => {
- it('should change its state when clicked', () => {
- const { getByRole } = render();
+ it('should change its state when clicked', async () => {
+ const { getByRole } = await render();
const switchElement = getByRole('switch');
expect(switchElement).to.have.attribute('aria-checked', 'false');
- act(() => {
+ await act(() => {
switchElement.click();
});
expect(switchElement).to.have.attribute('aria-checked', 'true');
});
- it('should update its state when changed from outside', () => {
+ it('should update its state when changed from outside', async () => {
function Test() {
const [checked, setChecked] = React.useState(false);
return (
@@ -39,30 +40,30 @@ describe('', () => {
);
}
- const { getByRole, getByText } = render();
+ const { getByRole, getByText } = await render();
const switchElement = getByRole('switch');
const button = getByText('Toggle');
expect(switchElement).to.have.attribute('aria-checked', 'false');
- act(() => {
+ await act(() => {
button.click();
});
expect(switchElement).to.have.attribute('aria-checked', 'true');
- act(() => {
+ await act(() => {
button.click();
});
expect(switchElement).to.have.attribute('aria-checked', 'false');
});
- it('should update its state if the underlying input is toggled', () => {
- const { getByRole, container } = render();
+ it('should update its state if the underlying input is toggled', async () => {
+ const { getByRole, container } = await render();
const switchElement = getByRole('switch');
const internalInput = container.querySelector('input[type="checkbox"]')! as HTMLInputElement;
- act(() => {
+ await act(() => {
internalInput.click();
});
@@ -71,20 +72,20 @@ describe('', () => {
});
describe('extra props', () => {
- it('should override the built-in attributes', () => {
- const { container } = render();
+ it('should override the built-in attributes', async () => {
+ const { container } = await render();
expect(container.firstElementChild as HTMLElement).to.have.attribute('role', 'checkbox');
expect(container.firstElementChild as HTMLElement).to.have.attribute('data-state', 'checked');
});
});
describe('prop: onChange', () => {
- it('should call onChange when clicked', () => {
+ it('should call onChange when clicked', async () => {
const handleChange = spy();
- const { getByRole } = render();
+ const { getByRole } = await render();
const switchElement = getByRole('switch');
- act(() => {
+ await act(() => {
switchElement.click();
});
@@ -94,12 +95,12 @@ describe('', () => {
});
describe('prop: onClick', () => {
- it('should call onClick when clicked', () => {
+ it('should call onClick when clicked', async () => {
const handleClick = spy();
- const { getByRole } = render();
+ const { getByRole } = await render();
const switchElement = getByRole('switch');
- act(() => {
+ await act(() => {
switchElement.click();
});
@@ -108,23 +109,23 @@ describe('', () => {
});
describe('prop: disabled', () => {
- it('should have the `aria-disabled` attribute', () => {
- const { getByRole } = render();
+ it('should have the `aria-disabled` attribute', async () => {
+ const { getByRole } = await render();
expect(getByRole('switch')).to.have.attribute('aria-disabled', 'true');
});
- it('should not have the aria attribute when `disabled` is not set', () => {
- const { getByRole } = render();
+ it('should not have the aria attribute when `disabled` is not set', async () => {
+ const { getByRole } = await render();
expect(getByRole('switch')).not.to.have.attribute('aria-disabled');
});
- it('should not change its state when clicked', () => {
- const { getByRole } = render();
+ it('should not change its state when clicked', async () => {
+ const { getByRole } = await render();
const switchElement = getByRole('switch');
expect(switchElement).to.have.attribute('aria-checked', 'false');
- act(() => {
+ await act(() => {
switchElement.click();
});
@@ -133,23 +134,23 @@ describe('', () => {
});
describe('prop: readOnly', () => {
- it('should have the `aria-readonly` attribute', () => {
- const { getByRole } = render();
+ it('should have the `aria-readonly` attribute', async () => {
+ const { getByRole } = await render();
expect(getByRole('switch')).to.have.attribute('aria-readonly', 'true');
});
- it('should not have the aria attribute when `readOnly` is not set', () => {
- const { getByRole } = render();
+ it('should not have the aria attribute when `readOnly` is not set', async () => {
+ const { getByRole } = await render();
expect(getByRole('switch')).not.to.have.attribute('aria-readonly');
});
- it('should not change its state when clicked', () => {
- const { getByRole } = render();
+ it('should not change its state when clicked', async () => {
+ const { getByRole } = await render();
const switchElement = getByRole('switch');
expect(switchElement).to.have.attribute('aria-checked', 'false');
- act(() => {
+ await act(() => {
switchElement.click();
});
@@ -158,9 +159,9 @@ describe('', () => {
});
describe('prop: inputRef', () => {
- it('should be able to access the native input', () => {
+ it('should be able to access the native input', async () => {
const inputRef = React.createRef();
- const { container } = render();
+ const { container } = await render();
const internalInput = container.querySelector('input[type="checkbox"]')!;
expect(inputRef.current).to.equal(internalInput);
@@ -168,10 +169,10 @@ describe('', () => {
});
describe('form handling', () => {
- // TODO: when a label is clicked, mocha throws an error in unrelated tests. Uncomment when fixed or another test runner is used.
- // eslint-disable-next-line mocha/no-skipped-tests
- it.skip('should toggle the switch when a parent label is clicked', () => {
- const { getByTestId, getByRole } = render(
+ const user = userEvent.setup();
+
+ it('should toggle the switch when a parent label is clicked', async () => {
+ const { getByTestId, getByRole } = await render(