[Solved] ListView with endlessScroll will crash if you switch views while it is scrolling.

[Don]

1)  Have a ListView with endlessScroll turned on (i.e. connected to a remote dataSource).
2)  Flick/scroll up or down.
3)  While the ListView is still scrolling, switch to a different view (e.g. click a button in the navbar).
4)  Switch back to the view with the ListView.  

A problem/exception will often have occurred by the time you switch back.  The problem/exception differs between environments:

- In the Device Simulator, you'll often see a blank ListView but no exceptions in the console.  By scrolling the empty ListView up or down, the ListView rows usually become visible again.
- On real device (e.g. GS3 and Nexus 7), you'll sometimes see a blank screen as you did in the Device Simulator, and at other times you'll see an actual exception which will freeze/crash the entire app ("Uncaught TypeError: undefined has no properties:2").

My guess is that the "virtual mode" of the endless scroll ListView gets "out of sync" when you switch views while the ListView is still moving/scrolling.


TEMPORARY HACK/WORKAROUND:
To any view that has a ListView with endlessScroll, I add data-hide="stopViewScroller"

function stopViewScroller(e) {
    e.view.scroller.yinertia.velocity = 0;
    e.view.scroller.reset();
}

The perhaps undesirable side effect is that every time you leave the view then return, you will be back at the top of the ListView.  However, the .reset() is necessary for some reason.

This is only a HACK and the bug should really be fixed.

[Kiril Nikolov]

Hello Donald,

One of the possible reasons for this behavior is initializing the ListView more than once. By any chance do you use the show event of the view to initialize the view or a click on the button? I am asking this because if you initialize more than once it can cause the exact same behavior as the one you describe.

Can you use this Kendo UI Dojo to create an runnable sample, where the issue is reproduced? Thank you in advance for your cooperation.

Regards,
Kiril Nikolov
Telerik

 

 

[Don]

Hi Kiril,

I am not initializing it more than once.  I initialize the ListView in the init event of the view in my app.

I went ahead and created 2 demos to demonstrate the error.  The demos are based almost entirely off of the Telerik Demo (http://demos.telerik.com/kendo-ui/mobile/listview/endless-scrolling.html).

Here's a dojo version of the demo:   http://trykendoui.telerik.com/@sweffect/ATUf/2

I also made a project called "EndlessScrollCrash" (found in my AppBuilder account's dashboard) to test on actual devices.

To cause the error, I flick/scroll down the list and right when I believe the endlessscroll call to the remote data source is about to be made, I click "View2" to switch views then immedately click "View1" to switch back to View1.

I've also attached screenshots from each showing undesirable behavior.  However, I have to admit that these are not displaying the "undesirable behavior" nearly as often as my app did before I applied my hack.  It took me a few minutes to get the errors to show using these demos whereas in my app I could get them to show in a few seconds.  Perhaps it's because my remote data source is a tad laggier than the one provided by demos.telerik.com?  Perhaps its because my datasource contains many more than 77 records?  Also, I have yet to actually make the app crash completely or throw the "uncaught typeerror" using these demos.  But, as the screenshots show, there apparently is a problem.

[Kiril Nikolov]

Hi Donald,

Thank you very much for the reproduction and the test examples.

I have tested it and and managed to reproduce the issue. However with the way the endless scrolling is implemented at the moment this issue is expected to some extend. The reason is that while it is scrolling and you change the view, the scroller do not remember its position, so when you navigate back it is misplaced.

I am afraid that currently there is not a workaround that we can offer you, but I would like to assure you that we are constantly looking into improving the widgets in the Kendo UI library and if some optimization or a workaround is available, we will let you know.

Regards,
Kiril Nikolov
Telerik