jquery-ui
jquery-ui copied to clipboard
Datepicker positioning in Chrome inside Fixed element when font-size is not 12px...and more
I've got a very specific bug that only happens when I have a datepicker in a position: fixed element and the html font-size is not set to 12px and the root scroll container is not scrolled to the top.
- It works correctly in other Chomium browsers like Edge.
- It works if the font-size is exactly 12px.
- It works if the element it is in anything other than a position: fixed element (such as position: sticky).
- It works if you are scrolled to the top of the page.
It happens in both 1.12.1 and 1.13.0.
I know it's a pretty specific issue that I'm not sure how easy it will be to reproduce. I'll try to set something up. But I'm hoping the symptoms might be enough for someone who knows the code.
In the meantime, is there a method that can be called to recalculate the position? Or is there an option that can be set to tie the position/scroll linkage to a certain parent (other than the root element? (sometimes scrolling the main window doesn't move the element the picker should be attached to, yet the picker scrolls).
Thanks for the report. Since the issue is already in 1.12, given limited team resources it's not likely to be fixed by the UI team; see the project status at https://blog.jqueryui.com/2021/10/jquery-maintainers-update-and-transition-jquery-ui-as-part-of-overall-modernization-efforts/. PRs are welcome, though.
Please unsubscribe me from your mailing list Thanks
On Tue 16 Nov 2021 at 16:17, noyearzero @.***> wrote:
I've got a very specific bug that only happens when I have a datepicker in a position: fixed element and the html font-size is not set to 12px and the root scroll container is not scrolled to the top.
- It works correctly in other Chomium browsers like Edge.
- It works if the font-size is exactly 12px.
- It works if the element it is in anything other than a position: fixed element (such as position: sticky).
- It works if you are scrolled to the top of the page.
It happens in both 1.12.1 and 1.13.0.
I know it's a pretty specific issue that I'm not sure how easy it will be to reproduce. I'll try to set something up. But I'm hoping the symptoms might be enough for someone who knows the code.
In the meantime, is there a method that can be called to recalculate the position? Or is there an option that can be set to tie the position/scroll linkage to a certain parent (other than the root element? (sometimes scrolling the main window doesn't move the element the picker should be attached to, yet the picker scrolls).
— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/jquery/jquery-ui/issues/2018, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAPEPTGBN53E6C5LY3LYM7DUMJ72FANCNFSM5IEVS3RQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.
@noyearzero
Hi, can you confirm if this patch helps? https://github.com/jquery/jquery-ui/issues/2017
@janis-ps Yes! that does fix it. As C-3PO would say... Wonderful!
If you'd like to turn the suggestion from #2017 into a PR, that'd be great.
However, while that fix looks close to being fine, using Math.floor
is not the correct solution. The issue is caused by jQuery now returning floating point numbers in some cases. To compare such numbers, you shouldn't just round them as they may always be close to each other but on a different side of an integer. Instead, a small epsilon value should be determined and the check should be whether the difference between those two is smaller than this epsilon.
Note that any PR should come with tests.
Minor editorial changes applied
possible fix is here: https://github.com/jquery/jquery-ui/pull/2057