Polymer app very unstable in mobile safari (iOS 7)

[Martin Kleinschrodt]

Ever since updating from v0.3.2, my Polymer app crashes all the time. The problem is extremely hard to debug since I don't get any error messages in the browser console but instead the app crashes completely. This happens both in mobile safari and in the web view. The only clue that I have is this log from my cordova app:

Process 15971 stopped

* thread #6: tid = 0x5783c3, 0x36ae071a WebCore`WebCore::Document::touchEventsChangedTimerFired(WebCore::Timer<WebCore::Document>*) + 254, name = 'WebThread', stop reason = EXC_BAD_ACCESS (code=1, address=0xfffffff9)

    frame #0: 0x36ae071a WebCore`WebCore::Document::touchEventsChangedTimerFired(WebCore::Timer<WebCore::Document>*) + 254

WebCore`WebCore::Document::touchEventsChangedTimerFired(WebCore::Timer<WebCore::Document>*) + 254:

-> 0x36ae071a:  ldr.w  r8, [r0]

   0x36ae071e:  cmp.w  r8, #0x0

   0x36ae0722:  beq    0x36ae07e4                ; WebCore::Document::touchEventsChangedTimerFired(WebCore::Timer<WebCore::Document>*) + 456

   0x36ae0724:  movs   r0, #0x0

I don't know enough about WebCore to get anything from this, but based on when the crashes occur (usually after updating a model) I suspect that the problem has something to do with either polymer-expressions or TemplateBinding.

I'm currently using Polymer 0.4.0 but I think the problem exists since 0.3.3.

If you want to reproduce the problem yourself, go ahead and open http://maklesoft.github.io/padlock on your iPhone (or iOS simulator) and follow these steps:

- Choose a master password (you can simply use an empty one)

- Create a record

- Go back

- Create another record

- Switch back and forth between the two records (tap a record to select it), at some point the app will crash (probably sooner rather than later)

Other ways to reproduce the crash

- Delete a record

- Add a field to a record

- Add a category to a record

I wish I could offer more information, but at this point I am pretty much clueless. If you want to dig through the code, you can find it at

https://github.com/maklesoft/padlock

I probably don't have to mention that this is a show stopper for me. I wonder if anybody is having similar problems?

[Martin Kleinschrodt]

After some more experimentation, I narrowed it down a little more: It seems the issue was introduced between versions 0.3.4 and 0.3.5. Also, it seems that the problem is inside the polymer package, not the platform layer as one might expect (I reproduced the crashes with Polymer/polymer#0.3.5 + Polymer/platform#0.3.2). Then again, apparently TemplateBinding and polymer-expressions are contained in the polymer package, so maybe not that surprising after all. So it seems the culprit is hiding in one of these changesets:

https://github.com/Polymer/polymer-dev/compare/0.3.4...0.3.5

https://github.com/polymer/TemplateBinding/compare/0.3.4...0.3.5

https://github.com/polymer/polymer-expressions/compare/0.3.4...0.3.5

https://github.com/Polymer/polymer-gestures/compare/0.3.4...0.3.5

Anything else I missed that is part of the polymer package?

[Martin Kleinschrodt]

Anyone? I could really use some help on this...

[Rob Dodson]

Hey Martin, sorry for the delay, I think we're still catching up a bit from the long weekend :)
We're looking into this and hopefully will have a response soon.

- Rob

[Daniel Freedman]

Hi Martin,

I'm not very familiar with iOS, but it looks like there was a bad dereference inside of the WebView (that 0xfffffff9 looks like the highest address on your process stack).

I did get it to fail in the ios simulator as well, but mobile safari only reports a "bus error", which suggests that this is a bad pointer dereference.

I have a hunch that this is related to a node being removed from the DOM that also has a touch listener on it, but that idea is just based on the fact that safari stops sending touch events when the origin node is removed.

The WebCore::Document::touchEventsChangedTimerFired code is an IOS only extension to WebKit, so I'm not sure how to look at what that is doing.

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/8b2b71eb-2508-4aea-a7c2-de1ad34bec25%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Daniel Freedman]

I was able to make a repro case just with templates and tap handlers.

It looks like this error is triggered when the a node with a touch handler is being removed by a template model update while a touch event is being dispatched.

Minimal repro: https://gist.github.com/azakus/72d2b7d1ffde1e94283a

Since this seems related to template stamping timing, I'll have to sit down with the template polyfill authors to get a better understanding of the exact timing of the polyfill.

Thanks for your patience.

[Martin Kleinschrodt]

Thanks, guys! I really appreciate the help. Glad, Daniel could reproduce this and it's not something stupid I did.

For what it's worth, I think your analysis is pretty spot on. It seems there is some race condition going on since the problem occurs only part of the time. All things considered, I now think the problem was most likely introduced in polymer-gestures since TemplateBinding didn't see a lot of changes between 0.3.4 and 0.3.5.

You received this message because you are subscribed to a topic in the Google Groups "Polymer" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/polymer-dev/YE0U38xqXig/unsubscribe.
To unsubscribe from this group and all its topics, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CAAUAVAi2HB-eveg06Q0Be3VAEgtgPZdX790%2BOSyzz2sowrCx2w%40mail.gmail.com.

[Daniel Freedman]

Hi Martin,

I've identified what I believe to be the root cause (touchevents on nodes stamped from a template + edge case timing of the removal of a node that is a tap target) and reported the crash case to Apple (https://bugs.webkit.org/show_bug.cgi?id=136506)

The fix in Polymer is going to take me some more time to complete.

In the mean time, I've filed https://github.com/Polymer/polymer-gestures/issues/56 to track for myself.

Thanks!

[Martin Kleinschrodt]

Thanks Daniel, thats great to hear. Any idea on how long this might take to fix? Meanwhile, can you think of a possible workaround?

[Daniel Freedman]

Martin, I've nailed down a workaround for iOS in https://github.com/Polymer/polymer-gestures/pull/57.

I'll make a new build of polymer in the master branch if you'd like to test with it.

Thanks for your patience!

[Martin Kleinschrodt]

Thanks, Daniel! This seems to fix the crashes in mobile Safari. However, the workaround currently does not become active in the iOS web view since its user agent string is slightly different from Safari. It looks like this:

Mozilla/5.0 (iPhone; CPU iPhone OS 7_1_2 like Mac OS X) AppleWebKit/537.51.2 (KHTML, like Gecko) Mobile/11D257 (349648880)

So you might want to replace https://github.com/Polymer/polymer-gestures/blob/master/src/platform-events.js#L32 with something like

var IS_IOS = navigator.userAgent.match('AppleWebkit') && !navigator.userAgent.match('Chrome') && 'ontouchstart' in window;

Something that has also worked well for me is to check for the occurrence of known iOS devices:

var IS_IOS = ['iPad', 'iPhone', 'iPod'].reduce(function(match, dev) {
    return match || navigator.platform.indexOf(dev) !== -1;
}, false);

There is another issue in the iOS web view. After fixing the line above, this line throws an error: https://github.com/Polymer/polymer-gestures/blob/master/src/targetfind.js#L192

Seems like you forgot to check if event.path is defined like you did in other places (e.g.: https://github.com/Polymer/polymer-gestures/blob/master/src/targetfind.js#L113). I tried adding it in, but then taps don't seem to be fired at all. I didn't dig any deeper than that though.

Finally, I noticed your workaround seems to break native touch overflow scrolling (using -webkit-overflow-scrolling: touch). Maybe you're doing something with the touchmove event?

Thanks again for the help! Hopefully we'll be able to get the remaining kinks out as well.

[Daniel Freedman]

Hi Martin,

I've patched up the event path and ios detection code, but I'm not understanding the overflow scrolling "not working" state.

Even using 0.3.2 from your bower.json setup, I can't seem to get the record list to scroll in the ios simulator.

Maybe the scrolling has been not working for a while?

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/64131832-e417-47b8-a554-d916d2d11c0b%40googlegroups.com.

[Martin Kleinschrodt]

Daniel,

don't know why, but after installing the latest build on master scrolling seems to work fine again.

I mentioned that tap events stopped working after applying the user agent and event path patches. This issue still exists, but so far I've only been able to reproduce it inside the Padlock app and only when deploying it with Cordova. Since the app is relatively complex, ruling out other causes is difficult but it seems to have something to do with your workaround since the problem didn't exist previously. Even stranger, adding on-tap to the top-level component seems to solve the problem, although I'm not sure why. (https://github.com/MaKleSoft/padlock/commit/4da6825988d5e8890fa37bb5657ddf21727535d1)

Anyway, the remaining issues seem to be an edge case and since I have it working now I'm fine with letting this rest for now. However, I would still like to understand why adding the on-tap attribute to the padlock-app element helped with tap events not working. Any ideas?

Thanks,

Martin