IE fixes

IE 11 blocks dispatch of all events on elements with `disabled` attribute.
Polymer · May 15, 2018 · 6255cdb · 6255cdb
1 parent 28625d6
commit 6255cdb
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 6 deletions.
diff --git a/lib/utils/gestures.html b/lib/utils/gestures.html
@@ -1072,7 +1072,7 @@
       let dy = Math.abs(e.clientY - this.info.y);
       // find original target from `preventer` for TouchEvents, or `e` for MouseEvents
       let t = Gestures._findOriginalTarget(/** @type {Event} */(preventer || e));
-      if (!t || (canBeDisabled[/** @type {!HTMLElement} */(t).localName] && t.disabled)) {
+      if (!t || (canBeDisabled[/** @type {!HTMLElement} */(t).localName] && t.hasAttribute('disabled'))) {
         return;
       }
       // dx,dy can be NaN if `click` has been simulated and there was no `down` for `start`

diff --git a/test/unit/gestures-elements.html b/test/unit/gestures-elements.html
@@ -251,7 +251,10 @@
     }
     static get properties() {
       return {
-        disabled: Boolean
+        disabled: {
+          type: Boolean,
+          reflectToAttribute: true
+        }
       };
     }
     constructor() {
@@ -303,7 +306,6 @@
       </optgroup>
     </select>
     <textarea></textarea>
-    <div></div>
   </template>
   <script>
     class AllDisabled extends Polymer.GestureEventListeners(Polymer.Element) {

diff --git a/test/unit/gestures.html b/test/unit/gestures.html
@@ -616,8 +616,30 @@
       });
 
       suite('disabled', function() {
-        test('click() function works as expected on disabled elements', function() {
+        let shouldSkip = true;
+
+        suiteSetup(function() {
+          /*
+           * IE 11 does not dispatch events to elements with `disabled` attribute
+           * This is different from all other browsers, so skip these tests in IE 11
+           */
+          const div = document.createElement('div');
+          div.setAttribute('disabled', '');
+          document.body.appendChild(div);
+          div.addEventListener('click', () => {
+            shouldSkip = false;
+          });
+          div.click();
+          document.body.removeChild(div);
+        });
+        setup(function() {
           Polymer.Gestures.resetMouseCanceller();
+        });
+
+        test('click() function works as expected on disabled elements', function() {
+          if (shouldSkip) {
+            this.skip();
+          }
           let el = document.createElement('x-disabled-tap');
           document.body.appendChild(el);
           el.$.disabled.click();
@@ -628,6 +650,9 @@
         });
 
         test('disabled elements don\'t fire taps', function() {
+          if (shouldSkip) {
+            this.skip();
+          }
           let el = document.createElement('x-disabled-tap');
           document.body.appendChild(el);
           // tap an element with disabled attribute
@@ -666,6 +691,8 @@
           target.dispatchEvent(touchend);
           assert.deepEqual(el.taps, ['button#nested']);
 
+          Polymer.Gestures.resetMouseCanceller();
+
           // tap a custom element with a `disabled` property
           target = el.$.disabledEl;
           // simulate the event sequence of a touch on the screen
@@ -686,11 +713,11 @@
           document.body.removeChild(el);
         });
 
-        test('test all "disablable" elements', function() {
+        test('test all "disableable" elements', function() {
           const el = document.createElement('all-disabled');
           document.body.appendChild(el);
           el.tapAll();
-          assert.deepEqual(el.taps, ['div']);
+          assert.deepEqual(el.taps, []);
           document.body.removeChild(el);
         });
       });