www.malmiairshow.fi - see bug description

[webcompat-bot]

URL: http://www.malmiairshow.fi/
Browser / Version: Firefox 51.0
Operating System: Linux
Problem type: Something else - I'll add details below

Steps to Reproduce

1. Navigate to: http://www.malmiairshow.fi/
2. Try to scroll with mouse wheel.

Expected Behavior: Can scroll with mouse wheel.

Actual Behavior: Mouse wheel scrolling does not work.

From webcompat.com with ❤️

[adamopenweb]

I'm able to reproduce this in Firefox 51 on OSX.

[lliehu]

I'm able to reproduce this in Firefox 51 on Windows 10 and I could not reproduce this (so worked fine) on Firefox 48 on Windows 10. It seems that the website uses https://github.com/TemplatemonsterPlugins/rd-smoothscroll for smooth scrolling. I had the same results when trying to scroll on its demo page on http://cms.devoffice.com/coding-dev/rd-smoothscroll/demo/.

[endemic]

lol: https://miketaylr.com/posts/2014/11/document-body-scrolltop.html

Remove the doctype, triggering quirks mode, and works as expected.

[endemic]

Will muck around and see if I can't whip up a PR to fix.

[endemic]

I was a bit hasty w/ my comments earlier, and didn't spell out exactly why the script is breaking.

So when trying to scroll the page body using scrollTop, there are competing implementations, as mentioned by Mike's blog post. The way that "rd-smoothscroll" lib works is that it gets the current mouse target for a scroll event, then works its way up the DOM until it finds an element that should be scrolled (i.e. a div with overflow: auto, or the entire document). If the code reaches the top of the DOM, it does user agent sniffing to see if it can use document.body.scrollTop or html.scrollTop. FF49 breaks this particular WebKit test because it implements some -webkit-prefixed CSS extensions. As far as I can tell from my non-existent research, there isn't really a great way to detect which object's scrollTop property will actually scroll, aside from a UA test, so that's what I did. Complaints/suggestions welcome.

[endemic]

Updated the PR to remove the UA test.

[miketaylr]

Thanks @endemic!

It might be good to use document.scrollingElement to simplify things (behind feature detection): https://developer.mozilla.org/en-US/docs/Web/API/Document/scrollingElement

[endemic]

@miketaylr Nice, so prefer document.scrollingElement if it exists, but use fallbacks for older browsers?

[miketaylr]

Yeah, I think that's the nicest future-friendly way to do it.

[endemic]

Done and done. Code is a bit verbose, but the behavior should be correct, and not rely on UA detection.