From 836294cbb6c7a9e0364293a29b308afd5eee1eba Mon Sep 17 00:00:00 2001
From: Domenic Denicola <d@domenic.me>
Date: Wed, 4 Dec 2019 11:39:57 -0800
Subject: [PATCH] Explain label activation behavior + custom elements

Closes #5009.
---
 source | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/source b/source
index 9512a55ddd1..04876784c59 100644
--- a/source
+++ b/source
@@ -43720,6 +43720,11 @@ interface <dfn>HTMLLabelElement</dfn> : <span>HTMLElement</span> {
   at <span>interactive content</span> descendants of a <code>label</code> element, and any
   descendants of those <span>interactive content</span> descendants, must be to do nothing.</p>
 
+  <p class="note"><span data-x="form-associated custom element">Form-associated custom
+  elements</span> are <span data-x="category-label">labelable elements</span>, so for user agents
+  where the <code>label</code> element's <span>activation behavior</span> impacts the <span>labeled
+  control</span>, both built-in and custom elements will be impacted.</p>
+
   <!-- activation behavior need not be dependent on whether the
   labeled control is being rendered:
    https://software.hixie.ch/utilities/js/live-dom-viewer/?saved=371
@@ -43727,15 +43732,25 @@ interface <dfn>HTMLLabelElement</dfn> : <span>HTMLElement</span> {
 
   <div class="example">
 
-   <p>For example, on platforms where clicking a checkbox label checks the checkbox, clicking the
+   <p>For example, on platforms where clicking a label activates the form control, clicking the
    <code>label</code> in the following snippet could trigger the user agent to <span>fire a <code
    data-x="event-click">click</code> event</span> at the <code>input</code> element, as if the
    element itself had been triggered by the user:</p>
 
    <pre><code class="html" data-x="">&lt;label>&lt;input type=checkbox name=lost> Lost&lt;/label></code></pre>
 
-   <p>On other platforms, the behavior might be just to focus the control, or do nothing.</p>
+   <p>Similarly, assuming <code data-x="">my-checkbox</code> was declared as as a
+   <span>form-associated custom element</span> (like in <a href="#custom-elements-face-example">this
+   example</a>), then the code</p>
+
+   <pre><code class="html" data-x="">&lt;label>&lt;my-checkbox name=lost>&lt;/my-checkbox> Lost&lt;/label></code></pre>
+
+   <p>would have the same behavior, <span data-x="fire a click event">firing a <code
+   data-x="event-click">click</code> event</span> at the <code data-x="">my-checkbox</code>
+   element.</p>
 
+   <p>On other platforms, the behavior in both cases might be just to focus the control, or to do
+   nothing.</p>
   </div>
 
   </div>