Skip to content

Datepicker positioning in Chrome inside Fixed element when font-size is not 12px...and more #2018

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

Open
noyearzero opened this issue Nov 16, 2021 · 6 comments

Comments

@noyearzero
Copy link

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).

@mgol
Copy link
Member

mgol commented Nov 18, 2021

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.

@lisanemari

This comment has been minimized.

@janis-ps
Copy link

@noyearzero

Hi, can you confirm if this patch helps? #2017

@noyearzero
Copy link
Author

@janis-ps Yes! that does fix it. As C-3PO would say... Wonderful!

@mgol
Copy link
Member

mgol commented Nov 24, 2021

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

@SailorMax
Copy link

possible fix is here: #2057

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

No branches or pull requests

5 participants