Visitar URL original
Chrome 59 seems to break infinite scrolling · Issue #160 · angular-ui/ui-scroll · GitHub
Skip to content

Chrome 59 seems to break infinite scrolling #160

Description

@robertdempsey

Hello,

I've recently encountered an issue using Chrome 59 that is reminiscent of pre angular-ui-scroll 1.6 behaviour in regards to overflow anchoring.

Basically, scrolling up is quite erratic, sometimes taking forever to load more results or sometimes skipping/jumping multiple sections. Pretty much the same behaviour that I noticed before upgrading to version 1.6+.

I've tested with the following scenarios:

angular-ui-scroll: 1.6.1
PC with Chrome 59: erratic upwards scrolling
ChromeOS tablet with Chrome 59: erratic upwards scrolling
ChromeOS tablet with Chrome 56: perfect upwards scrolling
ChromeOS tablet with Chrome 58: perfect upwards scrolling

This is quite problematic as I will have to upgrade my tablets to Chrome 59 in the very near future. Any idea what might be causing this behaviour?

Thanks in advance

Activity

  1. dhilt commented on Jun 29, 2017

    @dhilt
    Member

    @robertdempsey Hello! I took Chrome 59.0.3071.115 on Win 10 and doesn't see your problem.

    Looking back, the issue of Scroll Anchoring Chrome 56 was fixed with the ui-scroll v1.6.1 release – #138 – is it something you have? If yes, you should inspect your rendered html code and make sure that the ui-scroll-viewport element has "overflow-anchor: none;" css rule. The ui-scroll forces it during linking, but maybe something overrides it?

    If no, we need more details. What OS, what demo (our demos?) and others that may help.

  2. robertdempsey commented on Jun 29, 2017

    @robertdempsey
    Author

    Hi dhilt,

    Thanks for the reply! I have seen this attribute on the ui-scroll-viewport element (oddly enough I have seen it since 1.6.0 even though it was meant to have only gone in in 1.6.1) but will confirm that nothing is overriding it tomorrow.

    On 1.6.0 and 1.6.1 everything works fine with Chrome 56 and 58, but starts to break with Chrome 59 (also Windows 10)

  3. dhilt commented on Jun 29, 2017

    @dhilt
    Member

    @robertdempsey I definitly can't reproduce it. Let's say we are trying this demo. I recorded a short video to demonstrate my behavoiour: https://www.youtube.com/watch?v=zoDHQGrKU_A; and it works as it should. What I'm doing wrong?

  4. robertdempsey commented on Jun 29, 2017

    @robertdempsey
    Author

    @dhilt cheers for going to the trouble of making a video! If you compare the visual effects of scrolling down to scrolling up in that video you can see that elements load quickly and are added smoothly when scrolling down. But when scrolling up there are periods of the whole viewport being white and elements taking longer to load.

    On Chrome 56 and 58, both my downwards scrolling and upwards scrolling experiences are perfectly smooth. But on Chrome 59 my upwards scrolling exhibits similar display issues to those in your video. Sometimes I will need to wait seconds for new results to get added to the top of the list, while other times my list will disappear completely and re-render seconds later with new items.

    This is the kind of behaviour I saw before the overflow-anchor: none fix was implemented. I will check in a few hours if it might be getting overridden in Chrome 59 as you suggest.

    Once again, thanks.

    Rob

  5. dhilt commented on Jun 29, 2017

    @dhilt
    Member

    @robertdempsey The behaviour you described is a designed thing, this results from the 100ms delay, which is for the remote emulation. Look at the Cache demo, where is no delay for repeated requests. Or just try to remove setTimeout at all from the demo...

    Look, I set up a new demo with no delay on plunker: https://plnkr.co/lxCDHA. Yes, it may jump a bit on some edge cases, but this is expected behaviour, and whiteness becomes visible only when going fast through more than 500 rows.

  6. robertdempsey commented on Jun 29, 2017

    @robertdempsey
    Author

    @dhilt designed or not, those kind of delays are what I am seeing when I scroll upwards on Chrome 59 and I have no timeouts or remote fetching when retrieving results.

    I will try to upload some videos of my own comparing Chrome 58 and 59 as the differences I am seeing are quite pronounced (Chrome 58 is perfectly smooth while Chrome 59 is unusable in my case).

    It may take me a few working days to get the videos up. Thanks for your assistance with this so far.

    Rob

  7. robertdempsey commented on Jul 4, 2017

    @robertdempsey
    Author

    Hi @dhilt,

    I tried your branch and it didn't seem to make things any better, but I couldn't tell if they were worse. I will work on getting a repro for you tomorrow, or at least a video showing the differences in behaviour between Chrome 56 and 59.

    I'm going to amend the title of this issue as it breaks any scrolling, be it upwards or downwards.

    Thanks a lot for your continued assistance with this and for the hard work on the library.

    Rob

  8. changed the title [-]Chrome 59 seems to break upwards infinite scrolling[/-] [+]Chrome 59 seems to break infinite scrolling[/+] on Jul 4, 2017
  9. robertdempsey commented on Jul 6, 2017

    @robertdempsey
    Author

    @dhilt I tell a lie, I have just tried your branch at https://github.com/angular-ui/ui-scroll/tree/sync/dist again with Chrome 59.0.3071.91 and it seems to be working perfectly now. Potentially even better than it was before Chrome 59 with the current production build.

    Thanks a tonne for your work on this and I'm sorry I couldn't provide better information for you to diagnose it. I'll continue testing and let you know if it's all still going smoothly in a bit.

    Cheers!

    Rob

  10. dhilt commented on Jul 7, 2017

    @dhilt
    Member

    v1.6.2 is released, I'm closing this issue, thanks for your words!

  11. robertdempsey commented on Jul 7, 2017

    @robertdempsey
    Author

    Sorry @dhilt, I've just installed 1.6.2 and I'm seeing the same issues I was earlier. More specifically, if I scroll to the top (my scrollbar actually reaches the top), there is a pause of 0.5s or so before new results are loaded. Using your branch the file from here https://raw.githubusercontent.com/angular-ui/ui-scroll/sync/dist/ui-scroll.js however works perfectly - new elements are loaded well before my scroll bar reaches the top.

    I'm currently using:
    angular: 1.5.8
    buffer-size: 14
    padding: 1

    For now I'll overwrite what is in my node_modules folder manually with this file, but if you have any free time could you possibly diff the 1.6.2 file with what's in your branch and see what might be causing it?

  12. dhilt commented on Jul 7, 2017

    @dhilt
    Member

    @robertdempsey My plan was to release a separate 1.6.3 (or even 1.7.0) release right after 1.6.2, cause that changes (the sync branch I mean) are very important. I did not expect the difference's so significant...

  13. reopened this on Jul 7, 2017
  14. dhilt commented on Jul 7, 2017

    @dhilt
    Member

    @robertdempsey I've just published 1.7.0 release candidate, you can add it to your project via

    npm install --save angular-ui-scroll@1.7.0-rc.1
    
  15. robertdempsey commented on Jul 7, 2017

    @robertdempsey
    Author

    Thanks a lot! Will try it out on Monday.

    Have a good one.

    Rob

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions