tooltip positioning for placement left and right
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
### Provide a general summary of the issue here
Positioning of the tooltip is wrong, only for placement left/right, when the page's body has `position: relative` and it has scrolled.
**Note**: the positioning for top/bottom using the same mentioned style works without problem.
### 🤔 Expected Behavior?
Positioning with placement left/right is correct as it happens already with top/bottom.
### 😯 Current Behavior
Tooltip is off by some amount, even far from the anchor element (might be even not on viewport).
### 💁 Possible Solution
_No response_
### 🔦 Context
_No response_
### 🖥️ Steps to Reproduce
This sandbox shows the problem when body has `position: relative`. Just scroll until the "yellow" is not visible in the viewport and hover the buttons. The first has `placement="top"` and the positioning is OK, while the second has `placement="right"` and it FAILS. The tooltip is shown far from the anchor.
https://codesandbox.io/p/sandbox/upbeat-tristan-7rgqjc

---
For example, in the current docs shows such behavior, just add to the `body` the following style `position: relative`.
https://react-spectrum.adobe.com/react-aria/Tooltip.html#placement
**No problem if body has not position** (tooltip is the correct place):

**Problem when body has position** (tooltip is not in the expected place):

---
It is also reproducible using the example: https://react-spectrum.adobe.com/react-spectrum/Tooltip.html#placement
### Version
latest
### What browsers are you seeing the problem on?
Chrome, Safari
### If other, please specify.
_No response_
### What operating system are you using?
Mac OS
### 🧢 Your Company/Team
_No response_
### 🕷 Tracking Issue
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.