spectrum-web-components
spectrum-web-components copied to clipboard
[Bug]: Tooltip creates weird jumpy issues on Safari
Code of conduct
- [X] I agree to follow this project's code of conduct.
Impacted component(s)
tooltip , action-button
Expected behavior
When the tooltip is activated (on hover) there is no side effects on the visual appearance of the button nor its padding.
Actual behavior
On Safari, when the tooltip is activated it creates weird jumpy artifacts on the parent component.
https://github.com/user-attachments/assets/a44f6c22-1387-40ef-8bbb-fc8e34160337
Working fine with other components in Safari: https://studio.webcomponents.dev/edit/D2039UQVOsceh44YyTZO/src/index.ts?p=stories
Can be seen using Safari on https://studio.webcomponents.dev/edit/N9MFKdA7bgMfVFUoU26P/src/index.ts?p=stories and on our own documentation website: https://opensource.adobe.com/spectrum-web-components/components/tooltip/#self-managed-overlays
Screenshots
https://github.com/user-attachments/assets/fed4192c-f591-40c7-abaf-6685109c6754
What browsers are you seeing the problem in?
No response
How can we reproduce this issue?
- Open Safari
- Navigate to https://studio.webcomponents.dev/edit/N9MFKdA7bgMfVFUoU26P/src/index.ts?p=stories
- Hover over the buttons
- Check jumping effect on the buttons when tooltip is displayed
Sample code or abstract reproduction which illustrates the problem
https://studio.webcomponents.dev/edit/N9MFKdA7bgMfVFUoU26P/src/index.ts?p=stories
Severity
SEV 4
Logs taken while reproducing problem
No response