question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

@withStyles + required propType checks shows warning

See original GitHub issue

not sure when this started happening but it wasnt happening before. when using decorators for withStyles and checking for the classes prop inside the class i get the following error

Warning: Failed prop type: The prop `classes` is marked as required in `withStyles(MyModule)`, but its value is `undefined`.

same explanation using code:

const styles = theme => (...)

// works and shows warning
@withStyles(styles)
export default class MyModule extends Component {
  static propTypes = {
    classes: PropTypes.object.isRequired,
  }
  ...
}

// works without warning
class MyModule extends Component {
  static propTypes = {
    classes: PropTypes.object.isRequired,
  }
  ...
}

export default withStyles(styles)(LoginModule)

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:1
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
dskybergcommented, Dec 22, 2017

Here are the relevant entries:

"babel": {
    "presets": [
        "@babel/preset-env",
        "@babel/preset-stage-0",
        "@babel/preset-react"
    ],
    "plugins": [
        "transform-decorators-legacy",
        "@babel/plugin-transform-runtime", [
            "@babel/plugin-proposal-class-properties",
            {
                "loose": true
            }
        ]
    ]
},
"dependencies": {
    "@babel/polyfill": "^7.0.0-beta.35",
    "@babel/runtime": "^7.0.0-beta.35"
},
"devDependencies": {
    "@babel/cli": "^7.0.0-beta.35",
    "@babel/core": "^7.0.0-beta.35",
    "@babel/plugin-transform-runtime": "^7.0.0-beta.35",
    "@babel/preset-env": "^7.0.0-beta.35",
    "@babel/preset-react": "^7.0.0-beta.35",
    "@babel/preset-stage-0": "^7.0.0-beta.35",
    "babel-eslint": "8.0.3",
    "babel-jest": "^22.0.3",
    "babel-loader": "^8.0.0-beta.0",
    "babel-plugin-transform-decorators-legacy": "^1.3.4"
}
0reactions
lmachenscommented, Jun 12, 2018

Looks like classes is undefined in constructor. So the decorator inject classes on mount.

Read more comments on GitHub >

github_iconTop Results From Across the Web

withStyles + required propType checks shows warning #9456
Warning: Failed prop type: The prop `classes` is marked as required in `withStyles(MyModule)`, but its value is `undefined`.
Read more >
PropType not giving warning - Stack Overflow
I am trying to use PropTypes to give a warning if they are not the correct type, or if they do not exist...
Read more >
Typechecking With PropTypes - React
In this example, we're using PropTypes. string . When an invalid value is provided for a prop, a warning will be shown in...
Read more >
material-ui/core/CHANGELOG.md - UNPKG
Each warning comes with a simple message that explains how to handle the ... 1739, - [CardMedia] Use propTypes for "at least one"-check...
Read more >
How To Style React Components | DigitalOcean
The alert component will take any number of children. This means you will need to be cautious about style conflicts, since you have...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found