Overlay scrollbars not animated on inner scrollers on jsfiddle.net |
||
Issue descriptionChrome Version : 57.0.2987.133 OS: Linux What steps will reproduce the problem? 1. Go to jsfiddle.com 2. Add many new lines to any of the JS, HTML, CSS boxes to cause them to overflow (scrollable) 3. Scroll using mouse wheel to show scrollbar 4. Move mouse near scrollbar What is the expected result? The scrollbar should smoothly animate to be thicker What happens instead of that? The scrollbar instantly becomes thicker. Fades out instantly Seems like there are no animations here. Also, trying to grab the scrollbar and drag it doesn't work either. There's something funny going on.
,
Apr 4 2017
This issue is related to codemirror https://github.com/codemirror/CodeMirror/blob/master/src/display/scrollbars.js#L115 Here set pointerEvents: "none" will make |LayoutBlock::hitTestOverflowControl| - |LayoutObject::visibleToHitTestRequest| early return and ignore the scrollbar hit test. It seems they set pointerEvents: "none" to avoid another hittest issue: https://github.com/codemirror/CodeMirror/issues/2326
,
Apr 4 2017
Ah, so the scroller is non-composited? Could you investigate why? Also, I see the scrollbar flashing between thin and thick (non-composited scrollbars should never be thin). Do you know why that might be? Are we showing both a composited and non-composited scrollbar? We probably need to fix how pointerEvents: none interact with overlay scrollbars.
,
Apr 4 2017
To add, I think we avoid all kinds of hit testing if pointer-events: none is set, assuming that the element shouldn't do anything in response. Scrollbars aren't really part of the element so we should still be hit testing for scrollbars even if that's set. We should also understand what these sites are doing to force non-composited scrollers. I noticed some -webkit- prefixed text-antialiasing CSS styles, perhaps we use that to prevent compositing?
,
Apr 4 2017
They are composited scrollbar. They create a scrollbar in the CodeMirror-vscrollbar. And hide the default scrollbar: https://github.com/codemirror/CodeMirror/blob/master/lib/codemirror.css#L158 I will try a simple page with overlay scrollbar and pointerEvents: "none".
,
Apr 4 2017
If they're composited, why are we doing hit testing on the main thread? We shouldn't have to go to the main thread at all.
,
Apr 4 2017
I am investigating the drag issue below. The animation issue is because codemirror has CodeMirror-vscrollbar wrapper the scrollbar and hide our scrollbar.
,
Apr 5 2017
The reason they fake the scrollbar. http://marijnhaverbeke.nl/blog/a-pathological-scrolling-model.html
,
Apr 7 2017
Oh yikes...hacks on hacks on hacks. How does this work with mac overlay scrollbars? Shouldn't we have the same issues there?
,
Apr 7 2017
It also has the hard to drag issue on Mac.
,
Apr 7 2017
How about visually? The CrOS scrollbars tend to flash in and out of view without animation, does the same happen on Mac?
,
Apr 7 2017
No, because Mac scrollbar only related to the delay. It may be some issue related to mouse leave on animation controller.
,
Apr 20 2017
CodeMirror just fix the dragging issue. I will take a look at animation issue.
,
May 10 2017
The animation issue is tracked in issue 715742 and CodeMirror has fixed the mouse dragging so lets close this one. |
||
►
Sign in to add a comment |
||
Comment 1 by chaopeng@chromium.org
, Apr 1 2017