add test case for nested label

Polymer · Feb 22, 2018 · c11c99b · c11c99b
1 parent e1df166
commit c11c99b
Show file tree

Hide file tree

Showing 2 changed files with 69 additions and 24 deletions.
diff --git a/test/unit/gestures-elements.html b/test/unit/gestures-elements.html
@@ -227,3 +227,19 @@
     customElements.define(XNativeLabel.is, XNativeLabel);
   </script>
 </dom-module>
+
+<dom-module id="x-native-label-nested">
+    <template>
+      <label id="label">
+        <input id="check" type="checkbox">
+      </label>
+    </template>
+    <script>
+      class XNativeLabelNested extends Polymer.Element {
+        static get is() {
+          return 'x-native-label-nested';
+        }
+      }
+      customElements.define(XNativeLabelNested.is, XNativeLabelNested);
+    </script>
+  </dom-module>
diff --git a/test/unit/gestures.html b/test/unit/gestures.html
@@ -560,30 +560,59 @@
         Polymer.Gestures.remove(window, 'tap', increment);
       });
 
-      test('native label click', function() {
-        let el = document.createElement('x-native-label');
-        document.body.appendChild(el);
-        let target = el.$.label;
-        // simulate the event sequence of a touch on the screen
-        let touches = [{
-          clientX: 0,
-          clientY: 0,
-          identifier: 1,
-          // target is set to the element with `addEventListener`, which is `target`
-          target
-        }];
-        let touchstart = new CustomEvent('touchstart', {bubbles: true, composed: true});
-        touchstart.changedTouches = touchstart.touches = touches;
-        target.dispatchEvent(touchstart);
-        let touchend = new CustomEvent('touchend', {bubbles: true, composed: true});
-        touchend.touches = touchend.changedTouches = touches;
-        target.dispatchEvent(touchend);
-        // simulate a mouse click on the label
-        let click = new MouseEvent('click', {bubbles: true, composed: true});
-        target.dispatchEvent(click);
-        // check that the mouse click on the label will activate the checkbox
-        assert.equal(el.$.check.checked, true, 'checkbox should be checked');
-        document.body.removeChild(el);
+      suite('native label click', function() {
+
+        test('native label click', function() {
+          let el = document.createElement('x-native-label');
+          document.body.appendChild(el);
+          let target = el.$.label;
+          // simulate the event sequence of a touch on the screen
+          let touches = [{
+            clientX: 0,
+            clientY: 0,
+            identifier: 1,
+            // target is set to the element with `addEventListener`, which is `target`
+            target
+          }];
+          let touchstart = new CustomEvent('touchstart', {bubbles: true, composed: true});
+          touchstart.changedTouches = touchstart.touches = touches;
+          target.dispatchEvent(touchstart);
+          let touchend = new CustomEvent('touchend', {bubbles: true, composed: true});
+          touchend.touches = touchend.changedTouches = touches;
+          target.dispatchEvent(touchend);
+          // simulate a mouse click on the label
+          let click = new MouseEvent('click', {bubbles: true, composed: true});
+          target.dispatchEvent(click);
+          // check that the mouse click on the label will activate the checkbox
+          assert.equal(el.$.check.checked, true, 'checkbox should be checked');
+          document.body.removeChild(el);
+        });
+      });
+
+      test('label click with nested element', function() {
+        let el = document.createElement('x-native-label-nested');
+          document.body.appendChild(el);
+          let target = el.$.label;
+          // simulate the event sequence of a touch on the screen
+          let touches = [{
+            clientX: 0,
+            clientY: 0,
+            identifier: 1,
+            // target is set to the element with `addEventListener`, which is `target`
+            target
+          }];
+          let touchstart = new CustomEvent('touchstart', {bubbles: true, composed: true});
+          touchstart.changedTouches = touchstart.touches = touches;
+          target.dispatchEvent(touchstart);
+          let touchend = new CustomEvent('touchend', {bubbles: true, composed: true});
+          touchend.touches = touchend.changedTouches = touches;
+          target.dispatchEvent(touchend);
+          // simulate a mouse click on the label
+          let click = new MouseEvent('click', {bubbles: true, composed: true});
+          target.dispatchEvent(click);
+          // check that the mouse click on the label will activate the checkbox
+          assert.equal(el.$.check.checked, true, 'checkbox should be checked');
+          document.body.removeChild(el);
       });
     });
   </script>