Skip to content

Commit

Permalink
Rely on CSS Positioned Layout Module for top layer
Browse files Browse the repository at this point in the history 
This change moves the top layer references from Fullscreen to CSS and uses the new algorithms to add and remove from the top layer.

Moving the top layer concept to CSS has been discussed in these issues:

* w3c/csswg-drafts#4998
* w3c/csswg-drafts#6939
* w3c/csswg-drafts#7845
* w3c/csswg-drafts#8240

Tests: web-platform-tests/wpt#39828.
  • Loading branch information
@josepharhar
josepharhar authored Jun 21, 2023
1 parent 3824cd6 commit 8430871
Showing 1 changed file with 26 additions and 20 deletions.
46 changes: 26 additions & 20 deletions source
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3326,10 +3326,6 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
define how the Fullscreen API interacts with HTML: <ref spec=FULLSCREEN></p>

<ul class="brief">
<li><dfn data-x-href="https://fullscreen.spec.whatwg.org/#top-layer">top layer</dfn> (an
<span data-x="set">ordered set</span>) and its
<dfn data-x="top-layer-add" data-x-href="https://fullscreen.spec.whatwg.org/#top-layer-add">add</dfn>
operation</li>
<li><dfn data-x-href="https://fullscreen.spec.whatwg.org/#dom-element-requestfullscreen"><code data-x="dom-element-requestFullscreen">requestFullscreen()</code></dfn></li>
<li><dfn data-x-href="https://fullscreen.spec.whatwg.org/#run-the-fullscreen-steps">run the fullscreen steps</dfn></li>
<li><dfn data-x-href="https://fullscreen.spec.whatwg.org/#fullscreen-flag">fullscreen flag</dfn></li>
Expand Down Expand Up @@ -3799,6 +3795,12 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li><dfn data-x-href="https://drafts.csswg.org/css-position/#absolute-position">absolutely-positioned</dfn></li>
<li>The <dfn data-x-href="https://drafts.csswg.org/css-position/#position-property">'position'</dfn> property and its
<dfn data-x-href="https://drafts.csswg.org/css-position/#valdef-position-static">'static'</dfn> value</li>
<li>The <dfn data-x-href="https://drafts.csswg.org/css-position-4/#document-top-layer">top layer</dfn>
(an <span data-x="set">ordered set</span>)</li>
<li><dfn data-x-href="https://drafts.csswg.org/css-position-4/#add-an-element-to-the-top-layer">add an element to the top layer</dfn></li>
<li><dfn data-x-href="https://drafts.csswg.org/css-position-4/#request-an-element-to-be-removed-from-the-top-layer">request an element to be removed from the top layer</dfn></li>
<li><dfn data-x-href="https://drafts.csswg.org/css-position-4/#remove-an-element-from-the-top-layer-immediately">remove an element from the top layer immediately</dfn></li>
<li><dfn data-x-href="https://drafts.csswg.org/css-position-4/#process-top-layer-removals">process top layer removals</dfn></li>
</ul>

<p>The following features are defined in <cite>CSS Multi-column Layout</cite>. <ref
Expand Down Expand Up @@ -60348,9 +60350,8 @@ interface <dfn interface>HTMLDialogElement</dfn> : <span>HTMLElement</span> {
</li>

<li><p>If <span>this</span>'s <span>node document</span>'s <span>top layer</span> does not
already <span data-x="list contains">contain</span> <span>this</span>, then <span
data-x="top-layer-add">add</span> <span>this</span> to <span>this</span>'s <span>node
document</span>'s <span>top layer</span>.</p></li>
already <span data-x="list contains">contain</span> <span>this</span>, then <span>add an element
to the top layer</span> given <span>this</span>.</p></li>

<li><p>Set <span>this</span>'s <span>previously focused element</span> to the
<span>focused</span> element.</p></li>
Expand Down Expand Up @@ -60400,11 +60401,10 @@ interface <dfn interface>HTMLDialogElement</dfn> : <span>HTMLElement</span> {
<li><p>Set <var>topDocument</var>'s <span>autofocus processed flag</span> to true.</p></li>
</ol>

<p>If at any time a <code>dialog</code> element is <span data-x="node is removed from a
document">removed from a <code>Document</code></span>, then if that <code>dialog</code> is in that
<code>Document</code>'s <span>top layer</span>, it must be <span
data-x="list remove">removed</span> from it. Also, set the <code>dialog</code> element's
<span>is modal</span> flag to false.
<p>The <code>dialog</code> <span>HTML element removing steps</span>, given <var>removedNode</var>
and <var>oldParent</var>, are if <var>removedNode</var>'s <span>node document</span>'s <span>top
layer</span> <span data-x="list contains">contains</span> <var>removedNode</var>, then
<span>remove an element from the top layer immediately</span> given <var>removedNode</var>.</p>

<p>The <dfn method for="HTMLDialogElement"><code
data-x="dom-dialog-close">close(<var>returnValue</var>)</code></dfn> method steps are:
Expand All @@ -60425,8 +60425,8 @@ interface <dfn interface>HTMLDialogElement</dfn> : <span>HTMLElement</span> {
<li><p>Remove <var>subject</var>'s <code data-x="attr-dialog-open">open</code>
attribute.</p></li>

<li><p>If the <span>is modal</span> flag of <var>subject</var> is true, then <span data-x="list
remove">remove</span> it from its <code>Document</code>'s <span>top layer</span>.</p></li>
<li><p>If the <span>is modal</span> flag of <var>subject</var> is true, then <span>request an
element to be removed from the top layer</span> given <var>subject</var>.</p></li>

<li><p>Let <var>wasModal</var> be the value of <var>subject</var>'s <span>is
modal</span> flag.</p></li>
Expand Down Expand Up @@ -77005,9 +77005,9 @@ interface <dfn interface>VisibilityStateEntry</dfn> : <span>PerformanceEntry</sp
tree</span> descendants can become <span>inert</span> in a similar fashion.</p>

<p class="note">The <code>dialog</code> element's <code
data-x="dom-dialog-showModal">showModal()</code> method causes this mechanism to trigger, by
<span data-x="top-layer-add">adding</span> the <code>dialog</code> element to its <span>node
document</span>'s <span>top layer</span>.</p>
data-x="dom-dialog-showModal">showModal()</code> method causes this mechanism to trigger, by <span
data-x="add an element to the top layer">adding</span> the <code>dialog</code> element to its
<span>node document</span>'s <span>top layer</span>.</p>

<h4>The <dfn data-x="attr-inert"><code>inert</code></dfn> attribute</h4>

Expand Down Expand Up @@ -82543,7 +82543,7 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
<li><p>Let <var>originallyFocusedElement</var> be <var>document</var>'s <span>focused area of the
document</span>'s <span>DOM anchor</span>.</p></li>

<li><p>Add <var>element</var> to <var>document</var>'s <span>top layer</span>.</p></li>
<li><p><span>Add an element to the top layer</span> given <var>element</var>.</p></li>

<li><p>Set <var>element</var>'s <span>popover visibility state</span> to <span
data-x="popover-showing-state">showing</span>.</p></li>
Expand Down Expand Up @@ -82678,11 +82678,14 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
data-x="event-beforetoggle">beforetoggle</code> event could have disconnected
<var>element</var> or changed its <code data-x="attr-popover">popover</code> attribute.</p>
</li>

<li><p><span>Request an element to be removed from the top layer</span> given
<var>element</var>.</p></li>
</ol>
</li>

<li><p><span data-x="list remove">Remove</span> <var>element</var> from the <span>top
layer</span>.</p></li>
<li><p>Otherwise, <span>remove an element from the top layer immediately</span> given
<var>element</var>.</p></li>

<li><p>Set <var>element</var>'s <span>popover visibility state</span> to <span
data-x="popover-hidden-state">hidden</span>.</p></li>
Expand Down Expand Up @@ -102139,6 +102142,9 @@ import "https://example.com/foo/../module2.mjs";</code></pre>
<li><p>For each <span>fully active</span> <code>Document</code> in <var>docs</var>, update the
rendering or user interface of that <code>Document</code> and its <span>node navigable</span>
to reflect the current state.</p></li>

<li><p>For each <span>fully active</span> <code>Document</code> <var>doc</var> in
<var>docs</var> run <span>process top layer removals</span> given <var>doc</var>.</p></li>
</ol>
</li>

Expand Down

0 comments on commit 8430871

Please sign in to comment.