From 2e5b8a289d3dc8788cd77279c90ee17bb7610814 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Tue, 19 Sep 2023 01:22:51 +0100
Subject: [PATCH 1/9] Add showPicker to <select> elements

Closes #7957
---
 source | 39 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/source b/source
index e4aed77eb44..4eb702a5a45 100644
--- a/source
+++ b/source
@@ -52758,6 +52758,8 @@ interface <dfn interface>HTMLSelectElement</dfn> : <span>HTMLElement</span> {
   boolean <span data-x="dom-cva-reportValidity">reportValidity</span>();
   undefined <span data-x="dom-cva-setCustomValidity">setCustomValidity</span>(DOMString error);
 
+  undefined <span data-x="dom-select-showPicker">showPicker</span>();
+
   readonly attribute <span>NodeList</span> <span data-x="dom-lfe-labels">labels</span>;
 };</code></pre>
    </dd>
@@ -53085,6 +53087,21 @@ interface <dfn interface>HTMLSelectElement</dfn> : <span>HTMLElement</span> {
 
     <p>Can be set, to change the selection.</p>
    </dd>
+
+   <dt><code data-x=""><var>select</var>.<span subdfn data-x="dom-select-showPicker">showPicker</span>()</code></dt>
+
+   <dd>
+    <p>Shows any applicable picker UI for <var>select</var>, so that the user can select a value.
+
+    <p>Throws an <span>"<code>InvalidStateError</code>"</span> <code>DOMException</code> if
+    <var>select</var> is not <span data-x="concept-fe-mutable">mutable</span>.</p>
+
+    <p>Throws a <span>"<code>NotAllowedError</code>"</span> <code>DOMException</code> if called
+    without <span data-x="transient activation">transient user activation</span>.</p>
+
+    <p>Throws a <span>"<code>SecurityError</code>"</span> <code>DOMException</code> if
+    <var>select</var> is inside a cross-origin <code>iframe</code>.</p>
+   </dd>
   </dl>
 
   <div w-nodev>
@@ -53095,6 +53112,27 @@ interface <dfn interface>HTMLSelectElement</dfn> : <span>HTMLElement</span> {
   data-x="">select-multiple</code>" if the <code data-x="attr-select-multiple">multiple</code>
   attribute is present.</p>
 
+  <p>The <dfn method for="HTMLSelectElement"><code
+  data-x="dom-select-showPicker">showPicker()</code></dfn> method steps are:</p>
+
+  <ol>
+   <li><p>If <span>this</span> is not <span data-x="concept-fe-mutable">mutable</span>, then throw
+   an <span>"<code>InvalidStateError</code>"</span> <code>DOMException</code>.</p></li>
+
+   <li>
+    <p>If <span>this</span>'s <span>relevant settings object</span>'s <span
+    data-x="concept-settings-object-origin">origin</span> is not <span>same origin</span> with
+    <span>this</span>'s <span>relevant settings object</span>'s <span>top-level origin</span>, then throw a
+    <span>"<code>SecurityError</code>"</span> <code>DOMException</code>.</p>
+   </li>
+
+   <li><p>If <span>this</span>'s <span>relevant global object</span> does not have <span>transient
+   activation</span>, then throw a <span>"<code>NotAllowedError</code>"</span>
+   <code>DOMException</code>.</p></li>
+
+   <li><p>Show the picker, if applicable, for <span>this</span>.</p></li>
+  </ol>
+
   <p>The <dfn attribute for="HTMLSelectElement"><code
   data-x="dom-select-options">options</code></dfn> IDL attribute must return an
   <code>HTMLOptionsCollection</code> rooted at the <code>select</code> node, whose filter matches
@@ -139684,6 +139722,7 @@ INSERT INTERFACES HERE
   Lucas Gadani,
   &#x0141;ukasz Pilorz,
   Luke Kenneth Casson Leighton,
+  Luke Warlow,
   Luke Wilde,
   Maciej Stachowiak,
   Magne Andersson,

From 342dee61e913c8124b4c065f240f63d93ad9fd6a Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Tue, 19 Sep 2023 12:06:40 +0100
Subject: [PATCH 2/9] Combine showPicker algorithms

---
 source | 32 ++++++++------------------------
 1 file changed, 8 insertions(+), 24 deletions(-)

diff --git a/source b/source
index 4eb702a5a45..ba68627b110 100644
--- a/source
+++ b/source
@@ -52224,7 +52224,8 @@ You cannot submit this form when the field is incorrect.</samp></pre>
   <hr>
 
   <p>The <dfn method for="HTMLInputElement"><code
-  data-x="dom-input-showPicker">showPicker()</code></dfn> method steps are:</p>
+  data-x="dom-input-showPicker">input.showPicker()</code></dfn> and
+  <dfn method for="HTMLSelectElement"><code data-x="dom-select-showPicker">select.showPicker()</code></dfn> method steps are:</p>
 
   <ol>
    <li><p>If <span>this</span> is not <span data-x="concept-fe-mutable">mutable</span>, then throw
@@ -52234,6 +52235,7 @@ You cannot submit this form when the field is incorrect.</samp></pre>
     <p>If <span>this</span>'s <span>relevant settings object</span>'s <span
     data-x="concept-settings-object-origin">origin</span> is not <span>same origin</span> with
     <span>this</span>'s <span>relevant settings object</span>'s <span>top-level origin</span>, and
+    <span>this</span> is a <code>select</code> element, or
     <span>this</span>'s <code data-x="attr-input-type">type</code> attribute is not in the <span
     data-x="attr-input-type-file">File Upload</span> state or <span
     data-x="attr-input-type-color">Color</span> state, then throw a
@@ -52252,7 +52254,7 @@ You cannot submit this form when the field is incorrect.</samp></pre>
    <li><p><span>Show the picker, if applicable</span>, for <span>this</span>.</p></li>
   </ol>
 
-  <p>To <dfn>show the picker, if applicable</dfn> for an <code>input</code> element
+  <p>To <dfn>show the picker, if applicable</dfn> for an <code>input</code>, or <code>select</code> element
   <var>element</var>:</p>
 
   <ol>
@@ -52263,7 +52265,8 @@ You cannot submit this form when the field is incorrect.</samp></pre>
    return.</p></li>
 
    <li>
-    <p>If <var>element</var>'s <code data-x="attr-input-type">type</code> attribute is in the <span
+    <p>If <var>element</var> is an <code>input</code> element and <var>element</var>'s
+    <code data-x="attr-input-type">type</code> attribute is in the <span
     data-x="attr-input-type-file">File Upload</span> state, then run these steps <span>in
     parallel</span>:</p>
 
@@ -52333,6 +52336,8 @@ You cannot submit this form when the field is incorrect.</samp></pre>
       <li><p><code>input</code> elements whose <code data-x="attr-input-type">type</code> attribute
       is in the <span data-x="attr-input-type-file">File Upload</span> state (although those are
       handled via the special case above, instead of by this step).</p></li>
+
+      <li><p><code>select</code> elements.</p></li>
      </ul>
 
      <p>However, the intent of this step is to trigger <em>any</em> picker UI implementation. So
@@ -53112,27 +53117,6 @@ interface <dfn interface>HTMLSelectElement</dfn> : <span>HTMLElement</span> {
   data-x="">select-multiple</code>" if the <code data-x="attr-select-multiple">multiple</code>
   attribute is present.</p>
 
-  <p>The <dfn method for="HTMLSelectElement"><code
-  data-x="dom-select-showPicker">showPicker()</code></dfn> method steps are:</p>
-
-  <ol>
-   <li><p>If <span>this</span> is not <span data-x="concept-fe-mutable">mutable</span>, then throw
-   an <span>"<code>InvalidStateError</code>"</span> <code>DOMException</code>.</p></li>
-
-   <li>
-    <p>If <span>this</span>'s <span>relevant settings object</span>'s <span
-    data-x="concept-settings-object-origin">origin</span> is not <span>same origin</span> with
-    <span>this</span>'s <span>relevant settings object</span>'s <span>top-level origin</span>, then throw a
-    <span>"<code>SecurityError</code>"</span> <code>DOMException</code>.</p>
-   </li>
-
-   <li><p>If <span>this</span>'s <span>relevant global object</span> does not have <span>transient
-   activation</span>, then throw a <span>"<code>NotAllowedError</code>"</span>
-   <code>DOMException</code>.</p></li>
-
-   <li><p>Show the picker, if applicable, for <span>this</span>.</p></li>
-  </ol>
-
   <p>The <dfn attribute for="HTMLSelectElement"><code
   data-x="dom-select-options">options</code></dfn> IDL attribute must return an
   <code>HTMLOptionsCollection</code> rooted at the <code>select</code> node, whose filter matches

From 9e561185a95bd8b6975802ca9cdbc855e1250517 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Mon, 9 Oct 2023 22:56:24 +0100
Subject: [PATCH 3/9] Mention element focus

---
 source | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/source b/source
index ba68627b110..51b933733c4 100644
--- a/source
+++ b/source
@@ -52317,7 +52317,7 @@ You cannot submit this form when the field is incorrect.</samp></pre>
     this algorithm. (If this closes a file selection picker, then per the above that will lead to
     firing either <code data-x="event-input">input</code> and <code
     data-x="event-change">change</code> events, or a <code data-x="event-cancel">cancel</code>
-    event.)</p>
+    event.) It can also focus <var>element</var> if required to show the picker.</p>
 
     <div class="note">
      <p>As of the time of this writing, typical browser implementations show such picker UI for:</p>

From 774c98c557bf7d7d96a3218811c2caeac79feb88 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Tue, 10 Oct 2023 11:56:20 +0100
Subject: [PATCH 4/9] Remove focus mention and address nits

---
 source | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/source b/source
index 51b933733c4..666d3befbf9 100644
--- a/source
+++ b/source
@@ -52225,7 +52225,8 @@ You cannot submit this form when the field is incorrect.</samp></pre>
 
   <p>The <dfn method for="HTMLInputElement"><code
   data-x="dom-input-showPicker">input.showPicker()</code></dfn> and
-  <dfn method for="HTMLSelectElement"><code data-x="dom-select-showPicker">select.showPicker()</code></dfn> method steps are:</p>
+  <dfn method for="HTMLSelectElement"><code
+  data-x="dom-select-showPicker">select.showPicker()</code></dfn> method steps are:</p>
 
   <ol>
    <li><p>If <span>this</span> is not <span data-x="concept-fe-mutable">mutable</span>, then throw
@@ -52254,8 +52255,8 @@ You cannot submit this form when the field is incorrect.</samp></pre>
    <li><p><span>Show the picker, if applicable</span>, for <span>this</span>.</p></li>
   </ol>
 
-  <p>To <dfn>show the picker, if applicable</dfn> for an <code>input</code>, or <code>select</code> element
-  <var>element</var>:</p>
+  <p>To <dfn>show the picker, if applicable</dfn> for an <code>input</code> or <code>select</code>
+  element <var>element</var>:</p>
 
   <ol>
    <li><p>If <var>element</var>'s <span>relevant global object</span> does not have <span>transient
@@ -52265,8 +52266,8 @@ You cannot submit this form when the field is incorrect.</samp></pre>
    return.</p></li>
 
    <li>
-    <p>If <var>element</var> is an <code>input</code> element and <var>element</var>'s
-    <code data-x="attr-input-type">type</code> attribute is in the <span
+    <p>If <var>element</var> is an <code>input</code> element and <var>element</var>'s <code
+    data-x="attr-input-type">type</code> attribute is in the <span
     data-x="attr-input-type-file">File Upload</span> state, then run these steps <span>in
     parallel</span>:</p>
 
@@ -52317,7 +52318,7 @@ You cannot submit this form when the field is incorrect.</samp></pre>
     this algorithm. (If this closes a file selection picker, then per the above that will lead to
     firing either <code data-x="event-input">input</code> and <code
     data-x="event-change">change</code> events, or a <code data-x="event-cancel">cancel</code>
-    event.) It can also focus <var>element</var> if required to show the picker.</p>
+    event.)</p>
 
     <div class="note">
      <p>As of the time of this writing, typical browser implementations show such picker UI for:</p>
@@ -52331,11 +52332,11 @@ You cannot submit this form when the field is incorrect.</samp></pre>
       data-x="attr-input-type-color">Color</span> states;</p></li>
 
       <li><p><code>input</code> elements in various states that have a <span
-      data-x="concept-input-list">suggestions source element</span>; and</p></li>
+      data-x="concept-input-list">suggestions source element</span>;</p></li>
 
       <li><p><code>input</code> elements whose <code data-x="attr-input-type">type</code> attribute
       is in the <span data-x="attr-input-type-file">File Upload</span> state (although those are
-      handled via the special case above, instead of by this step).</p></li>
+      handled via the special case above, instead of by this step); and</p></li>
 
       <li><p><code>select</code> elements.</p></li>
      </ul>

From c36752e6c79e8a85dc168d14f6ad49271c297b57 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Wed, 11 Oct 2023 15:46:06 +0100
Subject: [PATCH 5/9] Add line to say picker interface must be focused.

---
 source | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/source b/source
index 666d3befbf9..da9d16eb6e9 100644
--- a/source
+++ b/source
@@ -52309,6 +52309,9 @@ You cannot submit this form when the field is incorrect.</samp></pre>
     <var>element</var>, in the way it normally would when the user interacts with the control. (If
     no such UI applies to <var>element</var>, then this step does nothing.)</p>
 
+    <p>If such a user interface is shown, the <span>focusing steps</span> for <var>user
+    interface</var> must be ran.</p>
+
     <p>If such a user interface is shown, it must respect the requirements stated in the relevant
     parts of the specification for how <var>element</var> behaves given its <code
     data-x="attr-input-type">type</code> attribute state. (For example, various sections describe

From 8a7786a24724e0cd8948b6d4672f025d1df63de8 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Mon, 16 Oct 2023 13:21:46 +0100
Subject: [PATCH 6/9] Remove line that says picker interface must be focused.

---
 source | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/source b/source
index da9d16eb6e9..666d3befbf9 100644
--- a/source
+++ b/source
@@ -52309,9 +52309,6 @@ You cannot submit this form when the field is incorrect.</samp></pre>
     <var>element</var>, in the way it normally would when the user interacts with the control. (If
     no such UI applies to <var>element</var>, then this step does nothing.)</p>
 
-    <p>If such a user interface is shown, the <span>focusing steps</span> for <var>user
-    interface</var> must be ran.</p>
-
     <p>If such a user interface is shown, it must respect the requirements stated in the relevant
     parts of the specification for how <var>element</var> behaves given its <code
     data-x="attr-input-type">type</code> attribute state. (For example, various sections describe

From 5c237e5c3824741101eb48e6a83f214934c9cf48 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Tue, 7 Nov 2023 13:01:34 +0000
Subject: [PATCH 7/9] Add check that select element is being rendered to
 showPicker algorithm

---
 source | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/source b/source
index 666d3befbf9..ee9e699d191 100644
--- a/source
+++ b/source
@@ -52252,6 +52252,10 @@ You cannot submit this form when the field is incorrect.</samp></pre>
    activation</span>, then throw a <span>"<code>NotAllowedError</code>"</span>
    <code>DOMException</code>.</p></li>
 
+   <li><p>If <span>this</span> is a <code>select</code> element, and <span>this</span> is not
+   <span>being rendered</span>, then throw a <span>"<code>NotAllowedError</code>"</span>
+   <code>DOMException</code>.<p></li>
+
    <li><p><span>Show the picker, if applicable</span>, for <span>this</span>.</p></li>
   </ol>
 

From daf2c1e81180fb677757d570143d74bc76efe701 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Tue, 7 Nov 2023 14:58:38 +0000
Subject: [PATCH 8/9] Swap NotAllowedError for NotSupportedError

---
 source | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/source b/source
index ee9e699d191..1b6ca71ddef 100644
--- a/source
+++ b/source
@@ -52253,7 +52253,7 @@ You cannot submit this form when the field is incorrect.</samp></pre>
    <code>DOMException</code>.</p></li>
 
    <li><p>If <span>this</span> is a <code>select</code> element, and <span>this</span> is not
-   <span>being rendered</span>, then throw a <span>"<code>NotAllowedError</code>"</span>
+   <span>being rendered</span>, then throw a <span>"<code>NotSupportedError</code>"</span>
    <code>DOMException</code>.<p></li>
 
    <li><p><span>Show the picker, if applicable</span>, for <span>this</span>.</p></li>

From 953c3fe18751a457286a58a6b5127ea5d5980117 Mon Sep 17 00:00:00 2001
From: Luke Warlow <luke@warlow.dev>
Date: Wed, 8 Nov 2023 08:47:22 +0000
Subject: [PATCH 9/9] Address review comments

---
 source | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/source b/source
index 1b6ca71ddef..387ae956898 100644
--- a/source
+++ b/source
@@ -52223,10 +52223,10 @@ You cannot submit this form when the field is incorrect.</samp></pre>
 
   <hr>
 
-  <p>The <dfn method for="HTMLInputElement"><code
-  data-x="dom-input-showPicker">input.showPicker()</code></dfn> and
-  <dfn method for="HTMLSelectElement"><code
-  data-x="dom-select-showPicker">select.showPicker()</code></dfn> method steps are:</p>
+  <p>The <code>HTMLInputElement</code> <dfn method for="HTMLInputElement"><code
+  data-x="dom-input-showPicker">showPicker()</code></dfn> and <code>HTMLSelectElement</code> <dfn
+  method for="HTMLSelectElement"><code data-x="dom-select-showPicker">showPicker()</code></dfn>
+  method steps are:</p>
 
   <ol>
    <li><p>If <span>this</span> is not <span data-x="concept-fe-mutable">mutable</span>, then throw
@@ -53111,6 +53111,9 @@ interface <dfn interface>HTMLSelectElement</dfn> : <span>HTMLElement</span> {
 
     <p>Throws a <span>"<code>SecurityError</code>"</span> <code>DOMException</code> if
     <var>select</var> is inside a cross-origin <code>iframe</code>.</p>
+
+    <p>Throws a <span>"<code>NotSupportedError</code>"</span> <code>DOMException</code> if
+    <var>select</var> is not <span>being rendered</span>.</p>
    </dd>
   </dl>