Failed prop type: Invalid prop `children` supplied to `ForwardRef(Tooltip)`. Expected an element that can hold a ref

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Current behavior 😯

Tooltip component emits an error on children reporting that a plain function component was used instead of a react element. But a react element was passed. Using a react fragment as a children wrapper is the current workaround

Sample here

https://codesandbox.io/s/compassionate-wave-59d138?file=/src/App.js

Error should show in console

Expected behavior 🤔

When a react component and a ref can be used in the tooltip's children no error should be emitted.

Steps to reproduce 🕹

Steps:

1. Setup a Tooltip component with your own react component as it's child for example

2. Examine the console's errors

Context 🔦

Also related with this issue

https://github.com/mui/material-ui/issues/15911

It's pretty much the same, so a common workaround could be made perhaps. Wrapping tooltip's children in a fragment gets rid of the error.

FYI @oliviertassinari

Your environment 🌎

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Start with the Tooltip component and reproduce the warning using the linked CodeSandbox with a custom React component as its child. Trace the child ref validation and compare it with the fragment workaround. Done means a ref-capable React child produces no console prop-type error without requiring a fragment.