jquery-ui icon indicating copy to clipboard operation
jquery-ui copied to clipboard

Rounding error in datepicker _checkOffset()

Open janis-ps opened this issue 3 years ago • 1 comments

We encountered a problem where the datepicker position would be incorrect for a date input inside a Bootstrap modal. The datepicker would end up offscreen, far below the actual input element.

The culprit was this line of code (as well as the line above it):

https://github.com/jquery/jquery-ui/blob/main/ui/widgets/datepicker.js#L931

This code uses strict equality (===) to compare two floating-point numbers; not pixels, but fractions of pixels. Here's how we fixed it (and how the line above it should be fixed):

                offset.left -= ( this._get( inst, "isRTL" ) ? ( dpWidth - inputWidth ) : 0 );
                offset.left -= ( isFixed && offset.left === inst.input.offset().left ) ? $( document ).scrollLeft() : 0;
-               offset.top -= ( isFixed && offset.top === ( inst.input.offset().top + inputHeight ) ) ? $( document ).scrollTop() : 0;
+               offset.top -= ( isFixed && Math.floor(offset.top) === Math.floor( inst.input.offset().top + inputHeight ) ) ? $( document ).scrollTop() : 0;
 
                // Now check if datepicker is showing outside window viewport - move to a better place if so.
                offset.left -= Math.min( offset.left, ( offset.left + dpWidth > viewWidth && viewWidth > dpWidth ) ?

janis-ps avatar Nov 16 '21 10:11 janis-ps

Encountered this as well in 1.13.1

Applied the patch and it solved the issue, thanks

fgerodez avatar May 12 '23 12:05 fgerodez