New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 670670 link

Starred by 8 users

Issue metadata

Status: WontFix
Owner:
Closed: Dec 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 1
Type: Bug-Regression



Sign in to add a comment

[scroll anchoring] bad adjustments on infinite scroller reusing nodes

Reported by oleg.lus...@gmail.com, Dec 2 2016

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.75 Safari/537.36

Steps to reproduce the problem:
1. Open https://oleglustenko.github.io/infinity_scroll_react-table/ in chrome 55.0.2883.75 m (64-bit)
2. And scroll the table
3. Open the same table in chrome lower version

What is the expected behavior?
correct scroll working

What went wrong?
scroll trigger twice. Sometimes scroll goes unstoppable

Did this work before? No 

Chrome version: 55.0.2883.75  Channel: stable
OS Version: 10.0
Flash Version: Shockwave Flash 23.0 r0
 
chrome bug.gif
4.1 MB View Download
chrome expected result.gif
2.7 MB View Download
Cc: bokan@chromium.org ymalik@chromium.org
Components: -Blink Blink>Scroll
Labels: -OS-Windows -Type-Bug -Pri-2 OS-All Pri-1 Type-Bug-Regression
Owner: skobes@chromium.org
Status: Assigned (was: Unconfirmed)
Bisected to; appears broken via scroll anchoring.

https://chromium.googlesource.com/chromium/src/+log/02a4849687aa7a52e3af8959484f7f8b6b9335cf..73693c4b2eb516e55b700c0317b38d672a0bdb29
Cc: ojan@chromium.org
Status: WontFix (was: Assigned)
This is unfortunately the expected behavior of scroll anchoring interacting with the implementation of the infinite scroller.

As you scroll down, the script increases the height of the #gridgridrectop element to push the visible <tr> elements down, and swaps out their contents to pretend that they are new rows.

The best fix is for the site to put "overflow-anchor: none" on the entire table.

Comment 3 by ojan@chromium.org, Dec 2 2016

Is this a standard React infinite scroll or a custom one made for this page? If the former, I worry that this might be more widespread. 

skobes, would you be willing to put together a somewhat reduced test case? I'm having trouble understanding exactly what's going wrong.
It looks like the infinite scrolling functionality is not coming from React, though it's a bit hard to tell from the minimized JS.

Here is a trivial infinite scroller that demonstrates the issue:

https://output.jsbin.com/xejuca
Yes, it's custom infinity scroll. 
Source of code in branch gh-pages. Here example of code: https://github.com/OlegLustenko/infinity_scroll_react-table/blob/gh-pages/src/components/app.js


thank you skobes@chromium.org. I'll try overflow-anchor
Labels: Hotlist-Input-Dev

Comment 7 by skobes@chromium.org, Jan 11 2017

Labels: Scroll-Anchoring-Regressions

Comment 8 by skobes@chromium.org, Jan 11 2017

Summary: [scroll anchoring] bad adjustments on infinite scroller reusing nodes (was: scroll event bug)

Comment 9 by skobes@chromium.org, Feb 11 2017

Cc: skobes@chromium.org
 Issue 690454  has been merged into this issue.

Sign in to add a comment