1 files changed, 41 insertions, 0 deletions
diff --git a/testing/web-platform/tests/custom-elements/form-associated/label-delegatesFocus.html b/testing/web-platform/tests/custom-elements/form-associated/label-delegatesFocus.html
new file mode 100644
index 0000000000..74d31363c9
--- /dev/null
+++ b/testing/web-platform/tests/custom-elements/form-associated/label-delegatesFocus.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://bugs.chromium.org/p/chromium/issues/detail?id=1300587">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+
+<form>
+  <label for=custom>label</label>
+  <my-custom-element id=custom></my-custom-element>
+</form>
+
+<script>
+class MyCustomElement extends HTMLElement {
+  static formAssociated = true;
+  constructor() {
+    super();
+    const root = this.attachShadow({
+      delegatesFocus: true,
+      mode: 'open'
+    });
+    root.appendChild(document.createElement('input'));
+  }
+};
+customElements.define('my-custom-element', MyCustomElement);
+
+window.onload = () => {
+  promise_test(async () => {
+    const label = document.querySelector('label');
+    const customElement = document.querySelector('my-custom-element');
+    const input = customElement.shadowRoot.querySelector('input');
+    await new Promise((resolve) => {
+      input.addEventListener("focus", resolve, {once: true});
+      test_driver.click(label);
+    });
+    assert_equals(document.activeElement, customElement);
+    assert_equals(customElement.shadowRoot.activeElement, input);
+  }, `Clicking on a label for a form associated custom element with delegatesFocus should focus the custom element's focus delegate.`);
+};
+</script>