Material-ui: Tooltip inside CardActions raises Warning: Failed prop type

[klis87]

Titled 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

• [x] This is a v1.x issue.
• [x] 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

1. 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 |

[sethduncan]

I'm experiencing the same issue inside of a FormGroup.

[Estournet]

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.

<ListItem>
 <ListItemIcon>
    <React.Fragment>
      <Tooltip placement="top" title="Hello !">
        <Icon>done</Icon>
      </Tooltip>
    </React.Fragment>
  </ListItemIcon>
</ListItem>

[sethduncan]

I resolved my issue. I was placing the prop in question on the Tooltip. I'm not having any issues on the FormGroup.

[oliviertassinari]

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?

[flaviogrossi]

any news on this one?

[oliviertassinari]

@flaviogrossi Do you want to lead the effort?

[flaviogrossi]

@flaviogrossi Do you want to lead the effort?

i would, but i'm not familiar enough with the codebase.

Also, i've seen related bug reports which could be affected by this change and i'm not sure to be able to test every one of them.

[oliviertassinari]

It's should be about following https://github.com/mui-org/material-ui/issues/12302#issuecomment-423847047. The core contributors are here to make sure it's good.

[parulgupta26]

@oliviertassinari - I've created a PR for this - https://github.com/mui-org/material-ui/pull/13138 Please have a look