Firefox scrolls sloppily by row unless height is explicitly set on rows

RESOLVED INVALID

Status

()

RESOLVED INVALID
3 years ago
3 years ago

People

(Reporter: hud, Unassigned)

Tracking

({testcase})

44 Branch
All
Mac OS X
testcase
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(URL)

(Reporter)

Description

3 years ago
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.97 Safari/537.36

Steps to reproduce:

https://jsfiddle.net/81p71ktr/

1. Try it chrome - notice it works as expected scrolls by rows.

2. Scroll the colorful box and notice it doesn't always land perfectly on the top of a row (subtle stokes on mouse wheel).

3. Notice how uncommented the rule that sets height on each row fixes it.


Actual results:

Sloppy scroll by row, over time the top row isn't perfectly in view.


Expected results:

Perfect scroll by row.
(Reporter)

Updated

3 years ago
QA Whiteboard: May require wheel mouse
Component: Untriaged → General
OS: Unspecified → Mac OS X
Hardware: Unspecified → All

Comment 1

3 years ago
Your script is buggy - it uses whole units of height/offset to deal with scrolling, so it breaks when the rows have non-integer heights. Because of Firefox's default CSS, they have a height of 19.2px on my mac. On Chrome, they have 18px of height. If you set height: 19.2px in chrome, it breaks there. There are lots of differences in default CSS between different browsers and even OSes (the font size will differ if people configure windows/linux/osx to use a different default size). So best not assume anything about the height of the row being a round number.

This is not a Firefox bug, so I'm marking this as invalid.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 3 years ago
Component: General → Untriaged
Keywords: testcase
Resolution: --- → INVALID
(Reporter)

Comment 2

3 years ago
Thank you that is it. I was assuming if an element is 19.2px tall and I fetch the height using clientHeight I'd get 19.2... turns out you get 19. getBoundingClientRect().height appears to contain the actual height :)
You need to log in before you can comment on or make changes to this bug.