mui · aarongarciah · Jun 30, 2024 · Jun 28, 2024 · Jun 28, 2024 · Jun 28, 2024
diff --git a/packages-internal/test-utils/package.json b/packages-internal/test-utils/package.json
@@ -49,7 +49,6 @@
     "mocha": "^10.4.0",
     "playwright": "^1.44.1",
     "prop-types": "^15.8.1",
-    "react-test-renderer": "^18.2.0",
     "sinon": "^16.1.3"
   },
   "devDependencies": {
@@ -59,7 +58,6 @@
     "@types/prop-types": "^15.7.12",
     "@types/react": "^18.2.55",
     "@types/react-dom": "^18.3.0",
-    "@types/react-test-renderer": "^18.3.0",
     "@types/sinon": "^17.0.3",
     "typescript": "^5.4.5"
   },

diff --git a/packages-internal/test-utils/src/describeConformance.tsx b/packages-internal/test-utils/src/describeConformance.tsx
@@ -1,7 +1,6 @@
 /* eslint-env mocha */
 import * as React from 'react';
 import { expect } from 'chai';
-import ReactTestRenderer from 'react-test-renderer';
 import createDescribe from './createDescribe';
 import { MuiRenderResult } from './createRenderer';
 
@@ -246,22 +245,6 @@ export function testRootClass(
   });
 }
 
-/**
- * Tests that the component can be rendered with react-test-renderer.
- * This is important for snapshot testing with Jest (even if we don't encourage it).
- */
-export function testReactTestRenderer(element: React.ReactElement<any>) {
-  it('should render without errors in ReactTestRenderer', () => {
-    ReactTestRenderer.act(() => {
-      ReactTestRenderer.create(element, {
-        createNodeMock: (node) => {
-          return document.createElement(node.type as keyof HTMLElementTagNameMap);
-        },
-      });
-    });
-  });
-}
-
 function forEachSlot(
   slots: ConformanceOptions['slots'],
   callback: (slotName: string, slot: SlotTestingOptions) => void,
@@ -1018,7 +1001,6 @@ const fullSuite = {
   propsSpread: testPropsSpread,
   refForwarding: describeRef,
   rootClass: testRootClass,
-  reactTestRenderer: testReactTestRenderer,
   slotPropsProp: testSlotPropsProp,
   slotPropsCallback: testSlotPropsCallback,
   slotsProp: testSlotsProp,

diff --git a/packages/mui-base/src/Menu/Menu.test.tsx b/packages/mui-base/src/Menu/Menu.test.tsx
@@ -53,7 +53,7 @@ describe('<Menu />', () => {
         expectedClassName: menuClasses.listbox,
       },
     },
-    skip: ['reactTestRenderer', 'componentProp', 'slotsProp'],
+    skip: ['componentProp', 'slotsProp'],
   }));
 
   describe('after initialization', () => {

diff --git a/packages/mui-base/src/MenuButton/MenuButton.test.tsx b/packages/mui-base/src/MenuButton/MenuButton.test.tsx
@@ -37,7 +37,7 @@ describe('<MenuButton />', () => {
         testWithElement: null,
       },
     },
-    skip: ['componentProp', 'reactTestRenderer'],
+    skip: ['componentProp'],
   }));
 
   describe('prop: disabled', () => {

diff --git a/packages/mui-base/src/MenuItem/MenuItem.test.tsx b/packages/mui-base/src/MenuItem/MenuItem.test.tsx
@@ -37,9 +37,6 @@ describe('<MenuItem />', () => {
         expectedClassName: menuItemClasses.root,
       },
     },
-    skip: [
-      'componentProp',
-      'reactTestRenderer', // Need to be wrapped in MenuContext
-    ],
+    skip: ['componentProp'],
   }));
 });
diff --git a/packages/mui-base/src/Modal/Modal.test.tsx b/packages/mui-base/src/Modal/Modal.test.tsx
@@ -29,10 +29,7 @@ describe('<Modal />', () => {
           expectedClassName: classes.root,
         },
       },
-      skip: [
-        'componentProp',
-        'reactTestRenderer', // portal https://github.com/facebook/react/issues/11565
-      ],
+      skip: ['componentProp'],
     }),
   );
 

diff --git a/packages/mui-base/src/Option/Option.test.tsx b/packages/mui-base/src/Option/Option.test.tsx
@@ -38,9 +38,6 @@ describe('<Option />', () => {
         expectedClassName: optionClasses.root,
       },
     },
-    skip: [
-      'componentProp',
-      'reactTestRenderer', // Need to be wrapped in SelectContext
-    ],
+    skip: ['componentProp'],
   }));
 });
diff --git a/packages/mui-base/src/Popper/Popper.test.tsx b/packages/mui-base/src/Popper/Popper.test.tsx
@@ -17,11 +17,7 @@ describe('<Popper />', () => {
     inheritComponent: 'div',
     render,
     refInstanceof: window.HTMLDivElement,
-    skip: [
-      // https://github.com/facebook/react/issues/11565
-      'reactTestRenderer',
-      'componentProp',
-    ],
+    skip: ['componentProp'],
     slots: {
       root: {
         expectedClassName: popperClasses.root,

diff --git a/packages/mui-base/src/Select/Select.test.tsx b/packages/mui-base/src/Select/Select.test.tsx
@@ -59,7 +59,7 @@ describe('<Select />', () => {
         testWithElement: 'span',
       },
     },
-    skip: ['componentProp', 'reactTestRenderer'],
+    skip: ['componentProp'],
   }));
 
   describe('selected option rendering', () => {

diff --git a/packages/mui-base/src/Tab/Tab.test.tsx b/packages/mui-base/src/Tab/Tab.test.tsx
@@ -44,9 +44,6 @@ describe('<Tab />', () => {
         expectedClassName: tabClasses.root,
       },
     },
-    skip: [
-      'reactTestRenderer', // Need to be wrapped with TabsContext
-      'componentProp',
-    ],
+    skip: ['componentProp'],
   }));
 });
diff --git a/packages/mui-base/src/TabPanel/TabPanel.test.tsx b/packages/mui-base/src/TabPanel/TabPanel.test.tsx
@@ -37,9 +37,6 @@ describe('<TabPanel />', () => {
         expectedClassName: tabPanelClasses.root,
       },
     },
-    skip: [
-      'reactTestRenderer', // Need to be wrapped with TabsContext
-      'componentProp',
-    ],
+    skip: ['componentProp'],
   }));
 });
diff --git a/packages/mui-base/src/TabsList/TabsList.test.tsx b/packages/mui-base/src/TabsList/TabsList.test.tsx
@@ -35,10 +35,7 @@ describe('<TabsList />', () => {
         expectedClassName: tabsListClasses.root,
       },
     },
-    skip: [
-      'reactTestRenderer', // Need to be wrapped with TabsContext
-      'componentProp',
-    ],
+    skip: ['componentProp'],
   }));
 
   describe('accessibility attributes', () => {

diff --git a/packages/mui-base/src/Unstable_Popup/Popup.test.tsx b/packages/mui-base/src/Unstable_Popup/Popup.test.tsx
@@ -58,11 +58,7 @@ describe('<Popup />', () => {
       return result;
     },
     refInstanceof: window.HTMLDivElement,
-    skip: [
-      // https://github.com/facebook/react/issues/11565
-      'reactTestRenderer',
-      'componentProp',
-    ],
+    skip: ['componentProp'],
     slots: {
       root: {
         expectedClassName: popupClasses.root,

diff --git a/packages/mui-base/test/describeConformanceUnstyled.tsx b/packages/mui-base/test/describeConformanceUnstyled.tsx
@@ -10,7 +10,6 @@ import {
   describeRef,
   randomStringValue,
   testComponentProp,
-  testReactTestRenderer,
 } from '@mui/internal-test-utils';
 import { ClassNameConfigurator } from '@mui/base/utils';
 
@@ -408,7 +407,6 @@ const fullSuite = {
   slotPropsCallbacks: testSlotPropsCallbacks,
   mergeClassName: testClassName,
   propsSpread: testPropForwarding,
-  reactTestRenderer: testReactTestRenderer,
   refForwarding: describeRef,
   ownerStatePropagation: testOwnerStatePropagation,
   disableClassGeneration: testDisablingClassGeneration,

diff --git a/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx b/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx
@@ -50,12 +50,7 @@ describe('Joy <Autocomplete />', () => {
     muiName: 'JoyAutocomplete',
     testDeepOverrides: { slotName: 'popupIndicator', slotClassName: classes.popupIndicator },
     testVariantProps: { size: 'lg' },
-    skip: [
-      'componentsProp',
-      'classesRoot',
-      // https://github.com/facebook/react/issues/11565
-      'reactTestRenderer',
-    ],
+    skip: ['componentsProp', 'classesRoot'],
     slots: {
       root: {
         expectedClassName: classes.root,

diff --git a/packages/mui-joy/src/Drawer/Drawer.test.tsx b/packages/mui-joy/src/Drawer/Drawer.test.tsx
@@ -31,7 +31,6 @@ describe('<Drawer />', () => {
         'componentsProp', // TODO isRTL is leaking, why do we even have it in the first place?
         'themeDefaultProps', // portal, can't determine the root
         'themeStyleOverrides', // portal, can't determine the root
-        'reactTestRenderer', // portal https://github.com/facebook/react/issues/11565
       ],
     }),
   );

diff --git a/packages/mui-joy/src/Menu/Menu.test.tsx b/packages/mui-joy/src/Menu/Menu.test.tsx
@@ -42,7 +42,6 @@ describe('Joy <Menu />', () => {
       'classesRoot',
       'componentProp',
       'componentsProp',
-      'reactTestRenderer', // react-transition-group issue
       'themeDefaultProps', // portal, can't determine the root
     ],
   }));

diff --git a/packages/mui-joy/src/MenuButton/MenuButton.test.tsx b/packages/mui-joy/src/MenuButton/MenuButton.test.tsx
@@ -32,7 +32,7 @@ describe('<MenuButton />', () => {
     slots: {
       root: { expectedClassName: classes.root },
     },
-    skip: ['reactTestRenderer', 'componentsProp', 'classesRoot'],
+    skip: ['componentsProp', 'classesRoot'],
     testRootOverrides: { slotName: 'root', slotClassName: classes.root },
     testVariantProps: { variant: 'soft' },
     ThemeProvider,

diff --git a/packages/mui-joy/src/MenuItem/MenuItem.test.tsx b/packages/mui-joy/src/MenuItem/MenuItem.test.tsx
@@ -42,7 +42,7 @@ describe('Joy <MenuItem />', () => {
     muiName: 'JoyMenuItem',
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
-    skip: ['propsSpread', 'componentsProp', 'classesRoot', 'reactTestRenderer'],
+    skip: ['propsSpread', 'componentsProp', 'classesRoot'],
     slots: {
       root: {
         expectedClassName: classes.root,

diff --git a/packages/mui-joy/src/Modal/Modal.test.tsx b/packages/mui-joy/src/Modal/Modal.test.tsx
@@ -33,7 +33,6 @@ describe('<Modal />', () => {
         'componentsProp', // TODO isRTL is leaking, why do we even have it in the first place?
         'themeDefaultProps', // portal, can't determine the root
         'themeStyleOverrides', // portal, can't determine the root
-        'reactTestRenderer', // portal https://github.com/facebook/react/issues/11565
       ],
     }),
   );

diff --git a/packages/mui-joy/src/Select/Select.test.tsx b/packages/mui-joy/src/Select/Select.test.tsx
@@ -49,14 +49,7 @@ describe('Joy <Select />', () => {
       startDecorator: { expectedClassName: classes.startDecorator },
       endDecorator: { expectedClassName: classes.endDecorator },
     },
-    skip: [
-      'classesRoot',
-      'propsSpread',
-      'componentProp',
-      'componentsProp',
-      // https://github.com/facebook/react/issues/11565
-      'reactTestRenderer',
-    ],
+    skip: ['classesRoot', 'propsSpread', 'componentProp', 'componentsProp'],
   }));
 
   it('should be able to mount the component', () => {

diff --git a/packages/mui-joy/src/Tab/Tab.test.tsx b/packages/mui-joy/src/Tab/Tab.test.tsx
@@ -37,7 +37,7 @@ describe('Joy <Tab />', () => {
     refInstanceof: window.HTMLButtonElement,
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
-    skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    skip: ['componentsProp', 'classesRoot'],
     slots: {
       root: {
         expectedClassName: classes.root,

diff --git a/packages/mui-joy/src/TabList/TabList.test.tsx b/packages/mui-joy/src/TabList/TabList.test.tsx
@@ -25,7 +25,7 @@ describe('Joy <TabList />', () => {
     muiName: 'JoyTabList',
     refInstanceof: window.HTMLDivElement,
     testVariantProps: { variant: 'solid' },
-    skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    skip: ['componentsProp', 'classesRoot'],
     slots: {
       root: {
         expectedClassName: classes.root,

diff --git a/packages/mui-joy/src/TabPanel/TabPanel.test.tsx b/packages/mui-joy/src/TabPanel/TabPanel.test.tsx
@@ -25,7 +25,7 @@ describe('Joy <TabPanel />', () => {
     refInstanceof: window.HTMLDivElement,
     testVariantProps: { size: 'sm' },
     testCustomVariant: true,
-    skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    skip: ['componentsProp', 'classesRoot'],
     slots: {
       root: {
         expectedClassName: classes.root,

diff --git a/packages/mui-joy/src/Table/Table.test.tsx b/packages/mui-joy/src/Table/Table.test.tsx
@@ -25,7 +25,6 @@ describe('<Table />', () => {
       'componentProp',
       'mergeClassName',
       'propsSpread',
-      'reactTestRenderer',
       'refForwarding',
     ],
     slots: {

diff --git a/packages/mui-joy/src/Tabs/Tabs.test.tsx b/packages/mui-joy/src/Tabs/Tabs.test.tsx
@@ -18,7 +18,7 @@ describe('Joy <Tabs />', () => {
     refInstanceof: window.HTMLDivElement,
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
-    skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    skip: ['componentsProp', 'classesRoot'],
     slots: {
       root: {
         expectedClassName: classes.root,

diff --git a/packages/mui-joy/src/Tooltip/Tooltip.test.tsx b/packages/mui-joy/src/Tooltip/Tooltip.test.tsx
@@ -50,8 +50,6 @@ describe('<Tooltip />', () => {
         'componentProp',
         'componentsProp',
         'themeVariants',
-        // react-transition-group issue
-        'reactTestRenderer',
         // Props are spread to root and children
         // We cannot use the standard propsSpread test which relies on data-testid only on the root
         'propsSpread',

diff --git a/packages/mui-lab/src/TabList/TabList.test.js b/packages/mui-lab/src/TabList/TabList.test.js
@@ -20,14 +20,12 @@ describe('<TabList />', () => {
      */
     render: (node) => render(<TabContext value="0">{node}</TabContext>),
     refInstanceof: window.HTMLDivElement,
-    // TODO: no idea why reactTestRenderer fails
     skip: [
       'componentsProp',
       'themeDefaultProps',
       'themeStyleOverrides',
       'themeVariants',
       'rootClass',
-      'reactTestRenderer',
     ],
   }));
 

diff --git a/packages/mui-lab/src/TabPanel/TabPanel.test.tsx b/packages/mui-lab/src/TabPanel/TabPanel.test.tsx
@@ -14,13 +14,7 @@ describe('<TabPanel />', () => {
     render: (node) => render(<TabContext value="0">{node}</TabContext>),
     refInstanceof: window.HTMLDivElement,
     muiName: 'MuiTabPanel',
-    skip: [
-      'componentProp',
-      'componentsProp',
-      'reactTestRenderer',
-      'themeDefaultProps',
-      'themeVariants',
-    ],
+    skip: ['componentProp', 'componentsProp', 'themeDefaultProps', 'themeVariants'],
   }));
 
   it('renders a [role="tabpanel"] and mounts children', () => {

diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.test.js b/packages/mui-material/src/Autocomplete/Autocomplete.test.js
@@ -64,7 +64,7 @@ describe('<Autocomplete />', () => {
         paper: { expectedClassName: classes.paper },
         popper: { expectedClassName: classes.popper, testWithElement: null },
       },
-      skip: ['componentProp', 'componentsProp', 'reactTestRenderer'],
+      skip: ['componentProp', 'componentsProp'],
     }),
   );
 

diff --git a/packages/mui-material/src/Backdrop/Backdrop.test.js b/packages/mui-material/src/Backdrop/Backdrop.test.js
@@ -24,12 +24,7 @@ describe('<Backdrop />', () => {
         testWithElement: null,
       },
     },
-    skip: [
-      'componentProp',
-      'componentsProp',
-      // react-transition-group issue
-      'reactTestRenderer',
-    ],
+    skip: ['componentProp', 'componentsProp'],
   }));
 
   it('should render a backdrop div with content of nested children', () => {

diff --git a/packages/mui-material/src/Dialog/Dialog.test.js b/packages/mui-material/src/Dialog/Dialog.test.js
@@ -48,13 +48,7 @@ describe('<Dialog />', () => {
       testVariantProps: { variant: 'foo' },
       testDeepOverrides: { slotName: 'paper', slotClassName: classes.paper },
       refInstanceof: window.HTMLDivElement,
-      skip: [
-        'componentProp',
-        'componentsProp',
-        'themeVariants',
-        // react-transition-group issue
-        'reactTestRenderer',
-      ],
+      skip: ['componentProp', 'componentsProp', 'themeVariants'],
     }),
   );
 

diff --git a/packages/mui-material/src/Drawer/Drawer.test.js b/packages/mui-material/src/Drawer/Drawer.test.js
@@ -22,13 +22,7 @@ describe('<Drawer />', () => {
       testVariantProps: { variant: 'persistent' },
       testDeepOverrides: { slotName: 'paper', slotClassName: classes.paper },
       refInstanceof: window.HTMLDivElement,
-      skip: [
-        'componentProp',
-        'componentsProp',
-        'themeVariants',
-        // react-transition-group issue
-        'reactTestRenderer',
-      ],
+      skip: ['componentProp', 'componentsProp', 'themeVariants'],
     }),
   );