[Tooltip display bug] Tooltip will close if the tooltip height dynamically expand and exceeds the viewport

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

Link to live example:
https://codesandbox.io/s/frosty-wave-8r1mqt?file=/demo.tsx
Steps:
1 open the sandbox link, and maximum your browser
2. hover on "TOOLTIP", then tooltip appears

3. click the button, the tooltip height will expand, then the tooltip blink on the top of "TOOLTIP" and closed

Current behavior 😯

click the button, the tooltip height will expand, then the tooltip blink on the top of "TOOLTIP" and closed

Expected behavior 🤔

first of all, it's reasonable that the tooltip should be showed on the top of element since its' height exceeds the viewport, however, it should be visible consistently rather than blink and closed unexpectedly

Context 🔦

In my project, my tooltip will show general message and detail message, the detail message is hidden by default, and will show when user click the button.
And I find this issue in the case of if tooltip is show near the viewport of browser.

Your environment 🌎

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