fix: set isReachEnd

[henrysha]

Details

isReachEnd has bugs of being true when the scroll has reached the end on some device This is due to a bug in the scrollLeft on some device of having a decimal value In order to prevent the bug, this fix adds additional calculation. When scrollSize - size - pos < 1, it means the scroll has reached the end, but has a decimal scrollLeft value. Thus, it would be safe to assume, that it has reached the end if the above condition returns true

[henrysha]

@WoodNeck I have googled about this issue, and some people on stack overflow are mentioning the scrollLeft values being .6667 or .8 etc. I don't think it is safe to assume that the decimal value will always be .5, since this value varies upon devices and browser.

[henrysha]

+ It seems this PR needs approval to run the workflow

[WoodNeck]

@henrysha I didn't say the decimal value is always 0.5, but the "offset" from the end should be 0.5 or some well-tested value.

Let's say the pos(scrollLeft) is 99.2. When it's rendered, the position would be rounded to pixel 99, but it still passes our if-statement, as scrollSize - size - pos will be 0.8

Have you tested it doesn't cause this kind of 1px offset issue?

[henrysha]

@WoodNeck On my use cases, the maximum scrollLeft I could reach was 233.5 but the scrollWidth - clientWidth was equal to 234. This caused isReachEnd to always be false.

Upon searching for answers, I found

Warning: On systems using display scaling, scrollLeft may give you a decimal value. https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft

the above from MDN. Thus, I concluded that decimal values should be rounded up instead of being rounded down for proper calculation.

[WoodNeck]

@henrysha I mean, have you tested the case of 233.2? You should test the values where decimal value is 0 < val < 0.5

[daybrush]

@malangfox

I think you can proceed.