Allow top layer elements to be nested within popovers

Fixes #9998

Implemented in chromium here:
https://chromium-review.googlesource.com/c/chromium/src/+/5229300

Author: josepharhar

source

@@ -61121,8 +61121,11 @@ interface <dfn interface>HTMLDialogElement</dfn> : <span>HTMLElement</span> {
    <li><p>Set <span>this</span>'s <span>previously focused element</span> to the
    <span>focused</span> element.</p></li>
 
-   <li><p>Run <span>hide all popovers</span> given <span>this</span>'s <span>node
-   document</span>.</p></li>
+   <li><p>Let <var>hideUntil</var> be the result of running <span>topmost popover ancestor</span>
+   given <span>this</span>, null, and false.</p></li>
+
+   <li><p>Run <span data-x="hide-all-popovers-until">hide all popovers until</span> given
+   <var>hideUntil</var>, false, and true.</p></li>
 
    <li><p>Run the <span>dialog focusing steps</span> given <span>this</span>.</p></li>
   </ol>
@@ -61184,8 +61187,11 @@ interface <dfn interface>HTMLDialogElement</dfn> : <span>HTMLElement</span> {
    <li><p>Set <span>this</span>'s <span>previously focused element</span> to the
    <span>focused</span> element.</p></li>
 
-   <li><p>Run <span>hide all popovers</span> given <span>this</span>'s <span>node
-   document</span>.</p></li>
+   <li><p>Let <var>hideUntil</var> be the result of running <span>topmost popover ancestor</span>
+   given <span>this</span>, null, and false.</p></li>
+
+   <li><p>Run <span data-x="hide-all-popovers-until">hide all popovers until</span> given
+   <var>hideUntil</var>, false, and true.</p></li>
 
    <li><p>Run the <span>dialog focusing steps</span> given <span>this</span>.</p></li>
   </ol>
@@ -84446,7 +84452,7 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
    data-x="popover-showing-state">showing</span>; otherwise false.</p></li>
   </ol>
 
-  <p>To <dfn data-x="hide-all-popovers-until">hide all popovers until</dfn>, given an <span
+  <p>To <dfn export data-x="hide-all-popovers-until">hide all popovers until</dfn>, given an <span
   data-x="HTML elements">HTML element</span> or <code>Document</code> <var>endpoint</var>, a boolean
   <var>focusPreviousElement</var>, and a boolean <var>fireEvents</var>:</p>
 
@@ -84538,10 +84544,10 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
   <span data-x="hide-all-popovers-until">hide all popovers until</span> given <var>document</var>,
   false, and false.</p>
 
-  <p>To find the <dfn>topmost popover ancestor</dfn>, given a <code>Node</code>
-  <var>newPopover</var>, and an <span data-x="HTML elements">HTML element</span> or null
-  <var>invoker</var>, perform the following steps. They return an <span data-x="HTML
-  elements">HTML element</span> or null.</p>
+  <p>To find the <dfn export>topmost popover ancestor</dfn>, given a <code>Node</code>
+  <var>newPopoverOrTopLayerElement</var>, an <span data-x="HTML elements">HTML element</span> or
+  null <var>invoker</var>, and a boolean <var>isPopover</var>, perform the following steps. They
+  return an <span data-x="HTML elements">HTML element</span> or null.</p>
 
   <div class="note">
    <p>The <span>topmost popover ancestor</span> algorithm will return the topmost (latest in the
@@ -84569,11 +84575,38 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
   </div>
 
   <ol>
+   <li>
+    <p>If <var>isPopover</var> is true:</p>
+
+    <ol>
+     <li><p><span>Assert</span>: <var>newPopoverOrTopLayerElement</var> is an <span data-x="HTML
+     elements">HTML element</span>.</p></li>
+
+     <li><p><span>Assert</span>: <var>newPopoverOrTopLayerElement</var>'s <code
+     data-x="attr-popover">popover</code> attribute is not in the <span
+     data-x="attr-popover-none-state">no popover state</span> or the <span
+     data-x="attr-popover-manual-state">manual</span> state.</p></li>
+
+     <li><p><span>Assert</span>: <var>newPopoverOrTopLayerElement</var>'s <span>popover visibility
+     state</span> is not in the <span data-x="popover-showing-state">popover showing
+     state</span>.</p></li>
+    </ol>
+   </li>
+
+   <li>
+    <p>Otherwise:</p>
+
+    <ol>
+     <li><p><span>Assert</span>: <var>invoker</var> is null.</p></li>
+    </ol>
+   </li>
+
    <li><p>Let <var>popoverPositions</var> be an empty <span>ordered map</span>.</p></li>
 
    <li><p>Let <var>index</var> be 0.</p></li>
 
-   <li><p>Let <var>document</var> be <var>newPopover</var>'s <span>node document</span>.</p></li>
+   <li><p>Let <var>document</var> be <var>newPopoverOrTopLayerElement</var>'s <span>node
+   document</span>.</p></li>
 
    <li>
     <p>For each <var>popover</var> of <var>document</var>'s <span>showing auto popover
@@ -84587,8 +84620,8 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
     </ol>
    </li>
 
-   <li><p><span data-x="map set">Set</span> <var>popoverPositions</var>[<var>newPopover</var>] to
-   <var>index</var>.</p></li>
+   <li><p>If <var>isPopover</var> is true, then <span data-x="map set">Set</span>
+   <var>popoverPositions</var>[<var>newPopoverOrTopLayerElement</var>] to <var>index</var>.</p></li>
 
    <li><p>Increment <var>index</var> by 1.</p></li>
 
@@ -84616,8 +84649,8 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
     </ol>
    </li>
 
-   <li><p>Run <var>checkAncestor</var> given <var>newPopover</var>'s parent node within the
-   <span>flat tree</span>.</p></li>
+   <li><p>Run <var>checkAncestor</var> given <var>newPopoverOrTopLayerElement</var>'s parent node
+   within the <span>flat tree</span>.</p></li>
 
    <li><p>Run <var>checkAncestor</var> given <var>invoker</var>.</p></li>