googlearchive/polymer-gestures

Work around safari touchevent listener bug

Closed this issue · 6 comments

If touchevent listeners are added to a node from another document, then that node is added to the main document, the touch event listeners will not fire in iOS Safari 7.

Reproduction:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Safari broken touches</title>
    <style>
      #target {
        width: 100px;
        height: 100px;
        background: orange;
      }
    </style>
  </head>
  <body>
    <div id="host"></div>

    <script>
      function log(e) {
        console.log(e.type);
      };

      var host = document.querySelector('#host');

      var template = document.implementation.createHTMLDocument();
      var target = template.createElement('div');
      target.id = 'target';

      // works
      //host.appendChild(target);

      target.addEventListener('touchstart', log);
      target.addEventListener('touchmove', log);
      target.addEventListener('touchend', log);

      // broken
      host.appendChild(target);
    </script>
  </body>
</html>

the closest bug I could find was https://bugs.webkit.org/show_bug.cgi?id=105406, but i'm not sure it's related.

Horrible workarounds:

  1. document.body.addEventListener('touchstart', function(){}) will trigger the broken node's event handlers, but removeEventListener will turn them back off again.
  2. Use attachedCallback to remove and re-add touch listeners.

Both are pretty heinous, and would have to be triggered for iOS only.

Let's go with #1 (Safari only) and file a bug.

On Tue, Aug 5, 2014 at 12:18 PM, Daniel Freedman notifications@github.com
wrote:

Horrible workarounds:

  1. document.body.addEventListener('touchstart', function(){}) will
    trigger the broken node's event handlers, but removeEventListener will
    turn them back off again.
  2. Use attachedCallback to remove and re-add touch listeners.

Both are pretty heinous, and would have to be triggered for iOS only.


Reply to this email directly or view it on GitHub
#33 (comment)
.

Filed safari bug: https://bugs.webkit.org/show_bug.cgi?id=135628

@sorvell, Should I leave this open to track, or close with the workaround in place?

open, I think.

On Tue, Aug 5, 2014 at 4:46 PM, Daniel Freedman notifications@github.com
wrote:

Filed safari bug: https://bugs.webkit.org/show_bug.cgi?id=135628

@sorvell https://github.com/sorvell, Should I leave this open to track,
or close with the workaround in place?


Reply to this email directly or view it on GitHub
#33 (comment)
.