Tooltip inside CardActions raises Warning: Failed prop type
See original GitHub issueTitled case raises Warning: Failed prop type: The following properties are not supported: className
. Please remove them. The issue started to appear after recent reimplementation of Tooltip
component. Is it a desired behaviour? Might be connected with #12159
- This is a v1.x issue.
- I have searched the issues of this repository and believe that this is not a duplicate.
Expected Behavior
It should be possible to use Tooltip inside CardAction without above warning.
Current Behavior
<CardActions>
<Tooltip title="second tooltip">
<Typography>Second text</Typography>
</Tooltip>
</CardActions>
causes above warning
Steps to Reproduce
Link: https://codesandbox.io/s/4j3oklzzyw
- Just load above example and see warning in the console.
Your Environment
Tech | Version |
---|---|
Material-UI | v1.4.1 |
React | v16.4.1 |
browser | any |
Issue Analytics
- State:
- Created 5 years ago
- Reactions:8
- Comments:9 (6 by maintainers)
Top Results From Across the Web
Tooltip inside CardActions raises Warning: Failed prop type
This is a v1.x issue. I have searched the issues of this repository and believe that this is not a duplicate. Expected Behavior....
Read more >Warning: Failed prop type: Invalid prop `children` supplied to ...
Children you are passing inside the sectect element is incorrect. Just remove value and onchange from its children as you are already ...
Read more >material-ui/core/CHANGELOG.md - UNPKG
If no warnings are reported in the console, you are set for this first batch. ... 601, - [Tooltip] Fix flip invalid CSS...
Read more >FormControl API - Material UI - MUI
API reference docs for the React FormControl component. Learn about the props, CSS, and other APIs of this exported module.
Read more >CHANGELOG.old.md - mui/material-ui - Sourcegraph
[AccordionSummary] Fix false-positive propType warning with disableGeneration ... Minify error messages in production (#21214) @eps1lon.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I’ve been experiencing the same issue inside a ListItemIcon. Wrap your Tooltip inside a React.Fragment and the warning doesn’t show up anymore.
I have been exploring the scope of the possible solution. I think that the simplest one is to make the Tooltip transparent. Basically, we can remove: https://github.com/mui-org/material-ui/blob/6245aae2dc0a34624993d094d56a2db9445dd754/packages/material-ui/src/Tooltip/Tooltip.js#L456 and forward the properties to the children: https://github.com/mui-org/material-ui/blob/6245aae2dc0a34624993d094d56a2db9445dd754/packages/material-ui/src/Tooltip/Tooltip.js#L320
Anyone wants to work on it?