Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Failed prop type: "deprecatedVariants" is read-only in Typography #13245

Closed
2 tasks done
jimmycarlinco opened this issue Oct 14, 2018 · 22 comments · Fixed by oliviertassinari/babel-plugin-transform-react-remove-prop-types#167 or #13254
Assignees
Labels
bug 🐛 Something doesn't work component: Typography The React component.

Comments

@jimmycarlinco
Copy link

Just updated to v3.2.1 and am getting the following error in console:
Failed prop type: "deprecatedVariants" is read-only in Typography (created by WithStyles(Typography))

Any ideas?

  • This is not a v0.x issue.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Your Environment

Tech Version
Material-UI v3.2.1
@jimmycarlinco

This comment has been minimized.

@bluepeter

This comment has been minimized.

@biggreenbubble

This comment has been minimized.

@bluepeter

This comment has been minimized.

@dandro32
Copy link

Too update variants follow this instruction:

https://material-ui.com/style/typography/#migration-to-typography-v2

However I have updated variants and still got this issue.

@bluepeter

This comment has been minimized.

@wilcoschoneveld

This comment has been minimized.

@shmilyoo

This comment has been minimized.

@eps1lon
Copy link
Member

eps1lon commented Oct 15, 2018

We located the issue and have a potential fix pending for review. Please don't spam this thread with "+1". This just floods notifications for everyone subscribed to this issue. You can use the reactions feature instead.

@oliviertassinari
Copy link
Member

The upstream issue should be fixed with oliviertassinari/babel-plugin-transform-react-remove-prop-types#167. We need to release it now.

@JulianPovedaM
Copy link

can not solve the problem, the console continues to indicate the following warning:

Warning: Failed prop type: "deprecatedVariants" is read-only....

could you help me please? #Thanks..

@eps1lon
Copy link
Member

eps1lon commented Oct 15, 2018

@JulianPovedaM The fix is not released yet. We can't offer a solution other than manually editing your node_modules.

One solution could be to clone, build locally and link in your app since the fix in the babel plugin is already released. But please don't ask in this thread how to do this. This is out of scope for this issue.

@eddiemonge
Copy link
Contributor

Will this go out in a patch release or in 3.4.0? If it's a patch release, any time frame estimates?

@oliviertassinari
Copy link
Member

oliviertassinari commented Oct 15, 2018

Thank you for the patience, v3.2.2 was released, let us know if it's all good :).

@bluepeter
Copy link

Fixes it for me! Great turnaround!

@remingtonchan
Copy link

All good on my side too!

@lipe-dev
Copy link

I had 3.2.1 that I installed yesterday, and got here from a google search to find out that 3.2.2 is out! First time I get to an issue right as it gets fixed! Good Job.

@jraoult
Copy link

jraoult commented Oct 16, 2018

@oliviertassinari I'm actually confused here. I get the same warning and in spite of the 3.2.2 it still shows:

const theme = createMuiTheme({
  typography: {
    useNextVariants: true
  },
  palette: {
    primary: {
      main: "#50c9c3",
      light: "#87fcf6",
      dark: "#009893",
      contrastText: "#000000"
    },
    secondary: {
      main: "#80d8ff",
      light: "#b5ffff",
      dark: "#49a7cc",
      contrastText: "#000000"
    }
  }
});

I had a look at the code: here:https://github.com/mui-org/material-ui/blob/b895ee783b13a50d4ab0a92c2ea15c2ff7f1e8ae/packages/material-ui/src/styles/createTypography.js#L38

It seems that calling createTypography (called by createMuiTheme) will always yield this warning once useNextVariants is set to true which per https://material-ui.com/style/typography/#migration-to-typography-v2 is recommended. Am I missing something?

EDIT: did I get the guide wrong? I actually updated all my styles manually throughout the app to use the new variant (ie. replacing subheading by subtitle1 etc.). Am I supposed to set the flag in this case or is it supposed to be the other way around?

@eps1lon
Copy link
Member

eps1lon commented Oct 16, 2018

@jraoult Please post the warning message.

The warning message in the code you linked will only trigger if the condition is false.

@jraoult
Copy link

jraoult commented Oct 16, 2018

@eps1lon right, my bad it is because suppressWarning is false actually. But now I'm under the impression (if the code is right) that I misunderstood the migration guide. If I migrated the styles manually I don't have to set useNextVariants.

EDIT: @eps1lon hmm. I probably spoke to fast. I can't see the message anymore. I wonder if my yarn cache was off.

@frntendev
Copy link
Contributor

@oliviertassinari I'm having an error while using Typography and it's saying Cannot read property 'useNextVariants' of undefined. I'm not using material-ui theme. I've set my own theme using another package and also written window.__MUI_USE_NEXT_TYPOGRAPHY_VARIANTS__ = true; inside my HTML page.
Seems there's a condition inside Typography.js that doesn't check null refrence for theme.

@eps1lon
Copy link
Member

eps1lon commented Nov 1, 2018

We require for the theme to have a certain shape. If a 3rd party package wants to create themes for this library it should match the shape. Full shape: https://github.com/mui-org/material-ui/blob/994c376bb2d07d70b67182be60afd4ad7e247478/packages/material-ui/src/styles/createMuiTheme.d.ts#L30-L43

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: Typography The React component.
Projects
None yet