[Popper] Add missing styleOverrides Popper type in theme

[axelbostrom]

Fixes #38936, if the import path is OK?

• I have followed (at least) the PR section of the contributing guide.

Before: https://codesandbox.io/s/stoic-frost-jwqttr
After: https://codesandbox.io/s/sharp-waterfall-xkcqqj

[mui-bot]

Netlify deploy preview

https://deploy-preview-39154--material-ui.netlify.app/

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against ee83ff6

[ZeeshanTamboli]

@axelbostrom Thank you for resolving this issue! Importing PopperClassKey from MUI Base is indeed the correct approach. Could you also include a TypeScript test to ensure its proper functionality in the createTheme.spec.ts file at this location? This test will help confirm that everything is working as expected.

[ZeeshanTamboli]

@axelbostrom Could you act on this comment as well to add a test?

[axelbostrom]

@ZeeshanTamboli I am trying yes, but have some minor issues writing the test. Looking at it now and will see if I can solve it, otherwise maybe you could assist me?

Edit: I am a little confused to what I should do in the .spec.ts file. When adding things here, nothing seems to happen. Should I not add the tests to the test.js file? If so, then I am done with the tests.

[mj12albert]

I am a little confused to what I should do in the .spec.ts file

diff --git a/packages/mui-material/src/styles/createTheme.spec.ts b/packages/mui-material/src/styles/createTheme.spec.ts
index f86a12a414..897077f2b1 100644
--- a/packages/mui-material/src/styles/createTheme.spec.ts
+++ b/packages/mui-material/src/styles/createTheme.spec.ts
@@ -66,6 +66,13 @@ const theme = createTheme();
 {
   createTheme({
     components: {
+      MuiPopper: {
+        styleOverrides: {
+          label: {
+            color: 'black',
+          },
+        },
+      },
       MuiFormControlLabel: {
         styleOverrides: {
           root: {

@axelbostrom Add another key like this, and you can run the type tests locally from the repo root with yarn typescript or yarn workspace @mui/material typescript

The corresponding job in the Ci is ci/circleci: test_types

[ZeeshanTamboli]

I am a little confused to what I should do in the .spec.ts file. When adding things here, nothing seems to happen

@axelbostrom Adding tests to the .spec.ts file will verify the correctness of types and detect any type errors if there are unexpected changes in the types you've defined for Popper in component styleOverrides.

[ZeeshanTamboli]

@axelbostrom I added the pending TypeScript test. Thank you for your contribution! Looking forward for more.