virtual-list-view links do not work on iOS / Safari Mobile

[Genkilabs]

You can see this easily by running an in-browser iOS emulator (I used chrome) and navigating to the list-view demo page, then changing one of the Virtual List View items to a link and trying to click it.
Here is a screenshot http://screencast.com/t/xSfKXJ2E0Ll9

I believe this might be a bug in the Zynga Scroller, perhaps related to pbakaus/scroller#40

I'm really just documenting it here for others looking for info on the issue, and to perhaps open up discussion of workarounds or other scroller options. Any thoughts?

[stefanpenner]

can you try explicitly adding a { pointer:cursor; } to you a css

[Genkilabs]

No luck. I am doing something like this:

{{#collection Ember.VirtualListView contentBinding="controller" height=661 rowHeight=82 width=320}}
    {{#link-to 'news-articles.show' this classNames="cursor-pointer"}}
        <h1 class="truncate">{{{title}}}</h1>
        <p class="truncate author">{{#if author}}By: {{author}}{{/if}}</p>
        <data class="truncate">{{from-now published}}</data>
    {{/link-to}}
{{/collection}}

and of course

.cursor-pointer{
    cursor: pointer;
}
a { pointer:cursor; }

Works great on all my browsers but iOS.

[stefanpenner]

@lukemelia @krisselden @raycohen seen anything like this in our apps?

[Genkilabs]

I should point out I also tested this on ember-cli-cordova and experienced this in both the xcode/emulator environment and when pushed onto an iPad, as well as in the regular mobile safari.

Does anyone by chance have an example up that uses virtual-list-view with working links I could look at?

[fivetanley]

@Genkilabs any luck?

[Genkilabs]

Nope, I ended up giving up on the list-view projects and rendering full lists then wrapping them in https://github.com/eviltrout/ember-cloaking

This seems to perform even better on desktop, and also works on iOS through ember-cli-cordova