[Joy] Add tests for slots/slotProps for all components

packages/mui-joy/src/AutocompleteListbox/AutocompleteListbox.test.tsx

@@ -19,6 +19,11 @@ describe('Joy <AutocompleteListbox />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<AutocompleteListbox />, {

packages/mui-joy/src/AutocompleteOption/AutocompleteOption.test.js

@@ -19,6 +19,11 @@ describe('Joy <AutocompleteOption />', () => {
     testVariantProps: { color: 'primary' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<AutocompleteOption />, { muiName: 'JoyAutocompleteOption', classes });

packages/mui-joy/src/AvatarGroup/AvatarGroup.test.js

@@ -19,6 +19,11 @@ describe('<AvatarGroup />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('provide context to Avatar', () => {

packages/mui-joy/src/Card/Card.test.js

@@ -19,6 +19,11 @@ describe('<Card />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<Card />, { muiName: 'JoyCard', classes });

packages/mui-joy/src/CardContent/CardContent.test.js

@@ -15,5 +15,10 @@ describe('<CardContent />', () => {
     refInstanceof: window.HTMLDivElement,
     testComponentPropWith: 'span',
     skip: ['classesRoot', 'componentsProp', 'themeVariants'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 });

packages/mui-joy/src/CardCover/CardCover.test.js

@@ -16,6 +16,11 @@ describe('<CardCover />', () => {
     refInstanceof: window.HTMLDivElement,
     testComponentPropWith: 'span',
     skip: ['classesRoot', 'componentsProp', 'themeVariants'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('add data-attribute to the first child', () => {

packages/mui-joy/src/CardOverflow/CardOverflow.test.js

@@ -19,6 +19,11 @@ describe('<CardOverflow />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<CardOverflow />, { muiName: 'JoyCardOverflow', classes });

packages/mui-joy/src/ChipDelete/ChipDelete.test.js

@@ -26,6 +26,11 @@ describe('<ChipDelete />', () => {
     testVariantProps: { variant: 'soft' },
     testCustomVariant: true,
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<ChipDelete />, { muiName: 'JoyChipDelete', classes });

packages/mui-joy/src/Divider/Divider.test.tsx

@@ -17,6 +17,11 @@ describe('Joy <Divider />', () => {
     testComponentPropWith: 'div',
     testVariantProps: { orientation: 'vertical' },
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describe('prop: children', () => {

packages/mui-joy/src/FormControl/FormControl.test.tsx

@@ -28,6 +28,11 @@ describe('<FormControl />', () => {
     testComponentPropWith: 'fieldset',
     testVariantProps: { color: 'success' },
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describe('prop: color', () => {

packages/mui-joy/src/FormHelperText/FormHelperText.test.js

@@ -15,6 +15,11 @@ describe('Joy <FormHelperText />', () => {
     muiName: 'JoyFormHelperText',
     refInstanceof: window.HTMLDivElement,
     skip: ['componentsProp', 'classesRoot', 'themeVariants'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('should have root className', () => {

packages/mui-joy/src/LinearProgress/LinearProgress.test.tsx

@@ -17,6 +17,11 @@ describe('<LinearProgress />', () => {
     testVariantProps: { determinate: true },
     testCustomVariant: true,
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<LinearProgress />, { muiName: 'JoyLinearProgress', classes });

packages/mui-joy/src/List/List.test.js

@@ -22,6 +22,11 @@ describe('Joy <List />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<List />, { muiName: 'JoyList', classes });

packages/mui-joy/src/ListDivider/ListDivider.test.js

@@ -17,6 +17,11 @@ describe('Joy <ListDivider />', () => {
     refInstanceof: window.HTMLLIElement,
     testVariantProps: { inset: 'gutter' },
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('should have role separator', () => {

packages/mui-joy/src/ListItemButton/ListItemButton.test.js

@@ -23,6 +23,11 @@ describe('Joy <ListItemButton />', () => {
     testVariantProps: { color: 'primary' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<ListItemButton />, { muiName: 'JoyListItemButton', classes });

packages/mui-joy/src/ListItemContent/ListItemContent.test.js

@@ -15,6 +15,11 @@ describe('Joy <ListItemContent />', () => {
     muiName: 'JoyListItemContent',
     refInstanceof: window.HTMLDivElement,
     skip: ['componentsProp', 'classesRoot', 'themeVariants'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('should have root className', () => {

packages/mui-joy/src/ListItemDecorator/ListItemDecorator.test.js

@@ -15,6 +15,11 @@ describe('Joy <ListItemDecorator />', () => {
     muiName: 'JoyListItemDecorator',
     refInstanceof: window.HTMLSpanElement,
     skip: ['componentsProp', 'classesRoot', 'themeVariants'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('should have root className', () => {

packages/mui-joy/src/ListSubheader/ListSubheader.test.tsx

@@ -19,6 +19,11 @@ describe('Joy <ListSubheader />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<ListSubheader variant="soft" />, {

packages/mui-joy/src/MenuItem/MenuItem.test.js

@@ -58,6 +58,11 @@ describe('Joy <MenuItem />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['propsSpread', 'componentsProp', 'classesRoot', 'reactTestRenderer'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<MenuItem />, {

packages/mui-joy/src/MenuList/MenuList.test.js

@@ -17,6 +17,11 @@ describe('Joy <MenuList />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<MenuList />, { muiName: 'JoyMenuList', classes });

packages/mui-joy/src/ModalClose/ModalClose.test.tsx

@@ -25,6 +25,11 @@ describe('<ModalClose />', () => {
     refInstanceof: window.HTMLButtonElement,
     testVariantProps: { variant: 'solid' },
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<ModalClose />, { muiName: 'JoyModalClose', classes });

packages/mui-joy/src/ModalDialog/ModalDialog.test.tsx

@@ -18,6 +18,11 @@ describe('<ModalDialog />', () => {
     testComponentPropWith: 'header',
     testVariantProps: { variant: 'solid' },
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<ModalDialog />, { muiName: 'JoyModalDialog', classes });

packages/mui-joy/src/ModalOverflow/ModalOverflow.test.tsx

@@ -15,5 +15,10 @@ describe('<ModalOverflow />', () => {
     refInstanceof: window.HTMLDivElement,
     testComponentPropWith: 'header',
     skip: ['classesRoot', 'componentsProp', 'themeVariants'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 });

packages/mui-joy/src/RadioGroup/RadioGroup.test.js

@@ -19,6 +19,11 @@ describe('<RadioGroup />', () => {
     testVariantProps: { orientation: 'horizontal' },
     testCustomVariant: true,
     skip: ['componentProp', 'componentsProp', 'classesRoot', 'propsSpread'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   it('should have `orientation` class', () => {

packages/mui-joy/src/ScopedCssBaseline/ScopedCssBaseline.test.tsx

@@ -16,5 +16,10 @@ describe('<ScopedCssBaseline />', () => {
     testComponentPropWith: 'span',
     testVariantProps: { disableColorScheme: true },
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 });

packages/mui-joy/src/Sheet/Sheet.test.js

@@ -19,6 +19,11 @@ describe('<Sheet />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['classesRoot', 'componentsProp'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<Sheet />, { muiName: 'JoySheet', classes });

packages/mui-joy/src/Tab/Tab.test.tsx

@@ -25,6 +25,11 @@ describe('Joy <Tab />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<Tab />, {

packages/mui-joy/src/TabList/TabList.test.tsx

@@ -26,6 +26,11 @@ describe('Joy <TabList />', () => {
     refInstanceof: window.HTMLDivElement,
     testVariantProps: { variant: 'solid' },
     skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<TabList />, {

packages/mui-joy/src/TabPanel/TabPanel.test.tsx

@@ -26,6 +26,11 @@ describe('Joy <TabPanel />', () => {
     testVariantProps: { size: 'sm' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describe('size', () => {

packages/mui-joy/src/Table/Table.test.tsx

@@ -28,6 +28,11 @@ describe('<Table />', () => {
       'reactTestRenderer',
       'refForwarding',
     ],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<Table />, { muiName: 'JoyTable', classes, emotionCompat: true });

packages/mui-joy/src/Tabs/Tabs.test.tsx

@@ -18,6 +18,11 @@ describe('Joy <Tabs />', () => {
     testVariantProps: { variant: 'solid' },
     testCustomVariant: true,
     skip: ['componentsProp', 'classesRoot', 'reactTestRenderer'],
+    slots: {
+      root: {
+        expectedClassName: classes.root,
+      },
+    },
   }));
 
   describeJoyColorInversion(<Tabs />, { muiName: 'JoyTabs', classes });