-
Notifications
You must be signed in to change notification settings - Fork 12
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Position calculation is sus when the floating element is larger than viewport. #244
Conversation
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This test looks good. Are you intending to merge-as-is and fix the test+code in a followup? Or would you like to continue this PR with a fix?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We paired on this together, so should get another review as well 🤭
@keithamus - Just paired with @siddharthkp and added a possible fix. Tested it on primer-react as well and it fixes the use case while fixing the new test case also. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM still 👍
While debugging https://github.com/github/accessibility-audits/issues/4515 , I was able to narrow down the issue to this criteria.
When zoomed in, the floating element becomes of larger in height compared to the viewport. This results in negative
top
value in the anchor position calculation. Thus results in top parts of the floating element being cut off.Before I can try to fix this by messing with the super complex calculations, I thought I'd float a test case to see if my assumptions are right.
I tried to keep the test case values as close to the real life use case as possible. You can see that the height of the floating element is
428px
and the height of the viewport is only400px
. This already results in a negativetop
value which is buggy as far as I understand.Open to feedback