Diff
Modified: trunk/LayoutTests/ChangeLog (290163 => 290164)
--- trunk/LayoutTests/ChangeLog 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/ChangeLog 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,3 +1,15 @@
+2022-02-18 Tim Nguyen <n...@apple.com>
+
+ Re-import inert and <dialog> WPT
+ https://bugs.webkit.org/show_bug.cgi?id=236808
+
+ Reviewed by Simon Fraser.
+
+ Commit: https://github.com/web-platform-tests/wpt/commit/0d483a3bea340a2c60cb7a4add49eb63cbba2a64
+
+ * platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt: Added.
+ * platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt: Added.
+
2022-02-18 Sam Sneddon <gsnedd...@apple.com>
ServiceWorkerGlobalScope+PushAPI requires PushAPIEnabled
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,3 +1,38 @@
+2022-02-18 Tim Nguyen <n...@apple.com>
+
+ Re-import inert and <dialog> WPT
+ https://bugs.webkit.org/show_bug.cgi?id=236808
+
+ Reviewed by Simon Fraser.
+
+ Commit: https://github.com/web-platform-tests/wpt/commit/0d483a3bea340a2c60cb7a4add49eb63cbba2a64
+
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested-expected.txt: Renamed from LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus-expected.txt.
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested.html: Renamed from LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus.html.
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-expected.txt:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow.html:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames-expected.txt:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames.html:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-label-focus.html:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes-expected.txt:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes.html:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-scroll-height.html:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log:
+ * web-platform-tests/inert/dynamic-inert-on-focused-element.tentative-expected.txt: Added.
+ * web-platform-tests/inert/dynamic-inert-on-focused-element.tentative.html: Added.
+ * web-platform-tests/inert/inert-canvas-fallback-content.tentative-expected.txt: Added.
+ * web-platform-tests/inert/inert-canvas-fallback-content.tentative.html: Added.
+ * web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt: Added.
+ * web-platform-tests/inert/inert-iframe-hittest.tentative.html: Added.
+ * web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt: Added.
+ * web-platform-tests/inert/inert-iframe-tabbing.tentative.html: Added.
+ * web-platform-tests/inert/inert-node-is-uneditable.tentative.html:
+ * web-platform-tests/inert/inert-with-modal-dialog-001.tentative-expected.txt: Added.
+ * web-platform-tests/inert/inert-with-modal-dialog-001.tentative.html: Added.
+ * web-platform-tests/inert/inert-with-modal-dialog-002.tentative-expected.txt: Added.
+ * web-platform-tests/inert/inert-with-modal-dialog-002.tentative.html: Added.
+ * web-platform-tests/inert/w3c-import.log:
+
2022-02-17 Jon Lee <jon...@apple.com>
[iOS] css/css-color/t422-rgba-onscreen-b.xht and css/css-color/t425-hsla-onscreen-b.xht are consistently failing
Deleted: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus-expected.txt (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus-expected.txt 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,4 +0,0 @@
-
-FAIL show() assert_equals: document.activeElement expected Element node <div></div> but got Element node <button tabindex="-1">Focusable</button>
-FAIL showModal() assert_equals: document.activeElement expected Element node <div></div> but got Element node <button tabindex="-1">Focusable</button>
-
Deleted: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,53 +0,0 @@
-<!DOCTYPE html>
-<meta charset="utf-8">
-<title>dialog focusing delegation with autofocus plus delegatesFocus inside the dialog</title>
-<script src=""
-<script src=""
-<body>
-
-<dialog>
- <template class="turn-into-shadow-tree">
- <button disabled>Non-focusable</button>
- <template class="turn-into-shadow-tree delegates-focus">
- <button tabindex="-1">Focusable</button>
- <button tabindex="-1" autofocus>Focusable</button>
- <button tabindex="-1">Focusable</button>
- </template>
- <button tabindex="-1">Focusable</button>
- </template>
- <button tabindex="-1">Focusable</button>
-</dialog>
-
-<script>
-function turnIntoShadowTree(template) {
- for (const subTemplate of template.content.querySelectorAll(".turn-into-shadow-tree")) {
- turnIntoShadowTree(subTemplate);
- }
-
- const div = document.createElement("div");
- div.attachShadow({ mode: "open", delegatesFocus: template.classList.contains("delegates-focus") });
- div.shadowRoot.append(template.content);
- template.replaceWith(div);
-}
-
-for (const template of document.querySelectorAll(".turn-into-shadow-tree")) {
- turnIntoShadowTree(template);
-}
-
-for (const method of ["show", "showModal"]) {
- test(t => {
- const dialog = document.querySelector("dialog");
- dialog[method]();
- t.add_cleanup(() => dialog.close());
-
- const shadowHostOuter = dialog.querySelector("div");
- assert_equals(document.activeElement, shadowHostOuter, "document.activeElement");
-
- const shadowHostInner = shadowHostOuter.shadowRoot.querySelector("div");
- assert_equals(shadowHostOuter.shadowRoot.activeElement, shadowHostInner, "shadowHostOuter.shadowRoot.activeElement");
-
- const button = shadowHostInner.shadowRoot.querySelector("[autofocus]");
- assert_equals(shadowHostInner.shadowRoot.activeElement, button, "shadowHostInner.shadowRoot.activeElement");
- }, `${method}()`);
-}
-</script>
Copied: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested-expected.txt (from rev 290161, trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus-expected.txt) (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,4 @@
+
+FAIL show() assert_equals: document.activeElement expected Element node <div></div> but got Element node <button tabindex="-1">Focusable</button>
+FAIL showModal() assert_equals: document.activeElement expected Element node <div></div> but got Element node <button tabindex="-1">Focusable</button>
+
Copied: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested.html (from rev 290161, trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus.html) (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>dialog focusing delegation: with two nested shadow trees</title>
+<script src=""
+<script src=""
+<body>
+
+<dialog>
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button disabled>Non-focusable</button>
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button tabindex="-1">Focusable</button>
+ <button tabindex="-1" autofocus>Focusable</button>
+ <button tabindex="-1">Focusable</button>
+ </template>
+ <button tabindex="-1">Focusable</button>
+ </template>
+ <button tabindex="-1">Focusable</button>
+</dialog>
+
+<script>
+function turnIntoShadowTree(template) {
+ for (const subTemplate of template.content.querySelectorAll(".turn-into-shadow-tree")) {
+ turnIntoShadowTree(subTemplate);
+ }
+
+ const div = document.createElement("div");
+ div.attachShadow({ mode: "open", delegatesFocus: template.classList.contains("delegates-focus") });
+ div.shadowRoot.append(template.content);
+ template.replaceWith(div);
+}
+
+for (const template of document.querySelectorAll(".turn-into-shadow-tree")) {
+ turnIntoShadowTree(template);
+}
+
+for (const method of ["show", "showModal"]) {
+ test(t => {
+ const dialog = document.querySelector("dialog");
+ dialog[method]();
+ t.add_cleanup(() => dialog.close());
+
+ const shadowHostOuter = dialog.querySelector("div");
+ assert_equals(document.activeElement, shadowHostOuter, "document.activeElement");
+
+ const shadowHostInner = shadowHostOuter.shadowRoot.querySelector("div");
+ assert_equals(shadowHostOuter.shadowRoot.activeElement, shadowHostInner, "shadowHostOuter.shadowRoot.activeElement");
+
+ const button = shadowHostInner.shadowRoot.querySelector("[autofocus]");
+ assert_equals(shadowHostInner.shadowRoot.activeElement, button, "shadowHostInner.shadowRoot.activeElement");
+ }, `${method}()`);
+}
+</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-expected.txt (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-expected.txt 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,18 +1,56 @@
+Focus between tests
-FAIL show: When autofocus is not present, the first focusable shadow-including descendant must be focused assert_equals: expected Element node <div></div> but got Element node <body>
+PASS show: No autofocus, no delegatesFocus, no siblings
+PASS showModal: No autofocus, no delegatesFocus, no siblings
+PASS show: No autofocus, no delegatesFocus, sibling before
+PASS showModal: No autofocus, no delegatesFocus, sibling before
+PASS show: No autofocus, no delegatesFocus, sibling after
+PASS showModal: No autofocus, no delegatesFocus, sibling after
+FAIL show: No autofocus, yes delegatesFocus, no siblings assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1" id="focus-between-tests">Focus betw...
+FAIL showModal: No autofocus, yes delegatesFocus, no siblings assert_equals: expected Element node <div></div> but got Element node <body>
-<dialog data-description="When autofocus is not p...
-FAIL showModal: When autofocus is not present, the first focusable shadow-including descendant must be focused assert_equals: expected Element node <div></div> but got Element node <body>
+<!--
+ We focus this one between each test, to en...
+PASS show: No autofocus, yes delegatesFocus, sibling before
+PASS showModal: No autofocus, yes delegatesFocus, sibling before
+FAIL show: No autofocus, yes delegatesFocus, sibling after assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1">Focusable</button>
+FAIL showModal: No autofocus, yes delegatesFocus, sibling after assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1">Focusable</button>
+PASS show: Autofocus before, no delegatesFocus
+PASS showModal: Autofocus before, no delegatesFocus
+PASS show: Autofocus before, yes delegatesFocus
+PASS showModal: Autofocus before, yes delegatesFocus
+PASS show: Autofocus after, no delegatesFocus
+PASS showModal: Autofocus after, no delegatesFocus
+PASS show: Autofocus after, yes delegatesFocus
+PASS showModal: Autofocus after, yes delegatesFocus
+FAIL show: Autofocus on shadow host, yes delegatesFocus, no siblings assert_equals: expected Element node <div autofocus=""></div> but got Element node <button tabindex="-1" id="focus-between-tests">Focus betw...
+FAIL showModal: Autofocus on shadow host, yes delegatesFocus, no siblings assert_equals: expected Element node <div autofocus=""></div> but got Element node <body>
-<dialog data-description="When autofocus is not p...
-FAIL show: autofocus outside a shadow tree must take precedence over earlier in-shadow-tree focusable elements assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1" autofocus="">Focusable</button>
-FAIL showModal: autofocus outside a shadow tree must take precedence over earlier in-shadow-tree focusable elements assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1" autofocus="">Focusable</button>
-FAIL show: autofocus inside a shadow tree must be ignored: no focusable elements outside the shadow tree assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1" autofocus="">Focusable</button>
-FAIL showModal: autofocus inside a shadow tree must be ignored: no focusable elements outside the shadow tree assert_equals: expected Element node <div></div> but got Element node <body>
+<!--
+ We focus this one between each test, to en...
+FAIL show: Autofocus on shadow host, yes delegatesFocus, sibling before assert_equals: expected Element node <div autofocus=""></div> but got Element node <button tabindex="-1">Focusable</button>
+FAIL showModal: Autofocus on shadow host, yes delegatesFocus, sibling before assert_equals: expected Element node <div autofocus=""></div> but got Element node <button tabindex="-1">Focusable</button>
+FAIL show: Autofocus on shadow host, yes delegatesFocus, sibling after assert_equals: expected Element node <div autofocus=""></div> but got Element node <button tabindex="-1">Focusable</button>
+FAIL showModal: Autofocus on shadow host, yes delegatesFocus, sibling after assert_equals: expected Element node <div autofocus=""></div> but got Element node <button tabindex="-1">Focusable</button>
+PASS show: Autofocus on shadow host, no delegatesFocus, no siblings
+PASS showModal: Autofocus on shadow host, no delegatesFocus, no siblings
+PASS show: Autofocus on shadow host, no delegatesFocus, sibling before
+PASS showModal: Autofocus on shadow host, no delegatesFocus, sibling before
+PASS show: Autofocus on shadow host, no delegatesFocus, sibling after
+PASS showModal: Autofocus on shadow host, no delegatesFocus, sibling after
+FAIL show: Autofocus inside shadow tree, yes delegatesFocus, no siblings assert_equals: expected Element node <div></div> but got Element node <button tabindex="-1" id="focus-between-tests">Focus betw...
+FAIL showModal: Autofocus inside shadow tree, yes delegatesFocus, no siblings assert_equals: expected Element node <div></div> but got Element node <body>
-<dialog data-description="When autofocus is not p...
-PASS show: autofocus inside a shadow tree must be ignored: focusable element before the shadow tree
-PASS showModal: autofocus inside a shadow tree must be ignored: focusable element before the shadow tree
-PASS show: autofocus inside a shadow tree must be ignored: focusable element after the shadow tree
-PASS showModal: autofocus inside a shadow tree must be ignored: focusable element after the shadow tree
+<!--
+ We focus this one between each test, to en...
+PASS show: Autofocus inside shadow tree, yes delegatesFocus, sibling before
+PASS showModal: Autofocus inside shadow tree, yes delegatesFocus, sibling before
+PASS show: Autofocus inside shadow tree, yes delegatesFocus, sibling after
+PASS showModal: Autofocus inside shadow tree, yes delegatesFocus, sibling after
+PASS show: Autofocus inside shadow tree, no delegatesFocus, no siblings
+PASS showModal: Autofocus inside shadow tree, no delegatesFocus, no siblings
+PASS show: Autofocus inside shadow tree, no delegatesFocus, sibling before
+PASS showModal: Autofocus inside shadow tree, no delegatesFocus, sibling before
+PASS show: Autofocus inside shadow tree, no delegatesFocus, sibling after
+PASS showModal: Autofocus inside shadow tree, no delegatesFocus, sibling after
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,48 +1,205 @@
<!DOCTYPE html>
<meta charset="utf-8">
+<title>dialog focus delegation</title>
<script src=""
<script src=""
<body>
-<dialog data-description="When autofocus is not present, the first focusable shadow-including descendant must be focused">
+<!--
+ We focus this one between each test, to ensure that for non-modal dialogs,
+ if there is no focus delegate, it stays focused (instead of causing focus to reset to the body).
+-->
+<button tabindex="-1" id="focus-between-tests">Focus between tests</button>
+
+<dialog data-description="No autofocus, no delegatesFocus, no siblings">
<template class="turn-into-shadow-tree">
<button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="No autofocus, no delegatesFocus, sibling before">
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <template class="turn-into-shadow-tree">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="No autofocus, no delegatesFocus, sibling after">
+ <template class="turn-into-shadow-tree">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+ <button tabindex="-1" class="focus-me">Focusable</button>
+</dialog>
+
+<dialog data-description="No autofocus, yes delegatesFocus, no siblings">
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button disabled>Non-focusable</button>
<button tabindex="-1" class="focus-me">Focusable</button>
<button disabled>Non-focusable</button>
</template>
</dialog>
-<dialog data-description="autofocus outside a shadow tree must take precedence over earlier in-shadow-tree focusable elements">
- <button disabled>Non-focusable</button>
+<dialog data-description="No autofocus, yes delegatesFocus, sibling before">
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="No autofocus, yes delegatesFocus, sibling after">
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+ <button tabindex="-1">Focusable</button>
+</dialog>
+
+<dialog data-description="Autofocus before, no delegatesFocus">
+ <button tabindex="-1" autofocus class="focus-me">Focusable</button>
<template class="turn-into-shadow-tree">
+ <button disabled>Non-focusable</button>
<button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
</template>
- <button tabindex="-1" autofocus>Focusable</button>
</dialog>
-<dialog data-description="autofocus inside a shadow tree must be ignored: no focusable elements outside the shadow tree">
+<dialog data-description="Autofocus before, yes delegatesFocus">
+ <button tabindex="-1" autofocus class="focus-me">Focusable</button>
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus after, no delegatesFocus">
<template class="turn-into-shadow-tree">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+ <button tabindex="-1" autofocus class="focus-me">Focusable</button>
+</dialog>
+
+<dialog data-description="Autofocus after, yes delegatesFocus">
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+ <button tabindex="-1" autofocus class="focus-me">Focusable</button>
+</dialog>
+
+<dialog data-description="Autofocus on shadow host, yes delegatesFocus, no siblings">
+ <template class="turn-into-shadow-tree delegates-focus autofocus">
+ <button disabled>Non-focusable</button>
<button tabindex="-1" class="focus-me">Focusable</button>
- <button tabindex="-1" autofocus>Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus on shadow host, yes delegatesFocus, sibling before">
+ <button tabindex="-1">Focusable</button>
+ <template class="turn-into-shadow-tree delegates-focus autofocus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus on shadow host, yes delegatesFocus, sibling after">
+ <template class="turn-into-shadow-tree delegates-focus autofocus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+ <button tabindex="-1">Focusable</button>
+</dialog>
+
+<dialog data-description="Autofocus on shadow host, no delegatesFocus, no siblings">
+ <template class="turn-into-shadow-tree autofocus">
+ <button disabled>Non-focusable</button>
<button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
</template>
</dialog>
-<dialog data-description="autofocus inside a shadow tree must be ignored: focusable element before the shadow tree">
+<dialog data-description="Autofocus on shadow host, no delegatesFocus, sibling before">
<button tabindex="-1" class="focus-me">Focusable</button>
- <template class="turn-into-shadow-tree">
+ <template class="turn-into-shadow-tree autofocus">
+ <button disabled>Non-focusable</button>
<button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus on shadow host, no delegatesFocus, sibling after">
+ <template class="turn-into-shadow-tree autofocus">
+ <button disabled>Non-focusable</button>
+ <button tabindex="-1">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+ <button tabindex="-1" class="focus-me">Focusable</button>
+</dialog>
+
+<dialog data-description="Autofocus inside shadow tree, yes delegatesFocus, no siblings">
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button tabindex="-1">Focusable</button>
+ <button tabindex="-1" autofocus class="focus-me">Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus inside shadow tree, yes delegatesFocus, sibling before">
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <template class="turn-into-shadow-tree delegates-focus">
+ <button tabindex="-1">Focusable</button>
<button tabindex="-1" autofocus>Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus inside shadow tree, yes delegatesFocus, sibling after">
+ <template class="turn-into-shadow-tree delegates-focus">
<button tabindex="-1">Focusable</button>
+ <button tabindex="-1" autofocus>Focusable</button>
+ <button disabled>Non-focusable</button>
</template>
+ <button tabindex="-1" class="focus-me">Focusable</button>
</dialog>
-<dialog data-description="autofocus inside a shadow tree must be ignored: focusable element after the shadow tree">
+<dialog data-description="Autofocus inside shadow tree, no delegatesFocus, no siblings">
<template class="turn-into-shadow-tree">
<button tabindex="-1">Focusable</button>
<button tabindex="-1" autofocus>Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
+</dialog>
+
+<dialog data-description="Autofocus inside shadow tree, no delegatesFocus, sibling before">
+ <button tabindex="-1" class="focus-me">Focusable</button>
+ <template class="turn-into-shadow-tree">
<button tabindex="-1">Focusable</button>
+ <button tabindex="-1" autofocus>Focusable</button>
+ <button disabled>Non-focusable</button>
</template>
+</dialog>
+
+<dialog data-description="Autofocus inside shadow tree, no delegatesFocus, sibling after">
+ <template class="turn-into-shadow-tree">
+ <button tabindex="-1">Focusable</button>
+ <button tabindex="-1" autofocus>Focusable</button>
+ <button disabled>Non-focusable</button>
+ </template>
<button tabindex="-1" class="focus-me">Focusable</button>
</dialog>
@@ -49,14 +206,19 @@
<script>
for (const template of document.querySelectorAll(".turn-into-shadow-tree")) {
const div = document.createElement("div");
- div.attachShadow({ mode: "open" });
+ div.attachShadow({ mode: "open", delegatesFocus: template.classList.contains("delegates-focus") });
+ div.autofocus = template.classList.contains("autofocus");
div.shadowRoot.append(template.content);
template.replaceWith(div);
}
+const focusBetweenTests = document.querySelector("#focus-between-tests");
+
for (const dialog of document.querySelectorAll("dialog")) {
for (const method of ["show", "showModal"]) {
test(t => {
+ focusBetweenTests.focus();
+
dialog[method]();
t.add_cleanup(() => dialog.close());
@@ -66,10 +228,17 @@
} else {
const shadowHost = dialog.querySelector("div");
const expectedFocusInsideShadowTree = shadowHost.shadowRoot.querySelector(".focus-me");
- assert_not_equals(expectedFocusInsideShadowTree, "Precondition check: the test was set up to expect a focused element, either outside the shadow tree or inside");
-
- assert_equals(document.activeElement, shadowHost);
- assert_equals(shadowHost.shadowRoot.activeElement, expectedFocusInsideShadowTree);
+ if (expectedFocusInsideShadowTree) {
+ assert_equals(document.activeElement, shadowHost);
+ assert_equals(shadowHost.shadowRoot.activeElement, expectedFocusInsideShadowTree);
+ } else {
+ // There is no focus delegate. Expected result depends on show() vs. showModal().
+ if (method === "show") {
+ assert_equals(document.activeElement, focusBetweenTests);
+ } else {
+ assert_equals(document.activeElement, document.body);
+ }
+ }
}
}, `${method}: ${dialog.dataset.description}`);
}
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames-expected.txt (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames-expected.txt 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -1,4 +1,4 @@
-PASS Tests inert node focusing across frames and iframes.
+FAIL Tests inert node focusing across frames and iframes. assert_equals: iframe-input expected Element node <input id="iframe-input" class="target" type="date"></input> but got null
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-focus-in-frames.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -37,7 +37,11 @@
let focusedElement = null;
element.addEventListener('focus', function() { focusedElement = element; }, false);
element.focus();
- assert_equals(focusedElement === element, expectFocus, element.id);
+ if (expectFocus) {
+ assert_equals(focusedElement, element, element.id);
+ } else {
+ assert_not_equals(focusedElement, element, element.id);
+ }
}
// Opening a modal dialog in frame1. It blocks other nodes in its document.
@@ -46,7 +50,7 @@
testFocus(frame1.querySelector('.target'), false);
const iframe = frame1.querySelector('#iframe1').contentDocument;
- testFocus(iframe.querySelector('.target'), false);
+ testFocus(iframe.querySelector('.target'), true);
// Even a modal dialog in the iframe is blocked by the modal dialog in the parent frame1.
iframe.querySelector('dialog').showModal();
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-label-focus.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-label-focus.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inert-label-focus.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -25,8 +25,8 @@
absoluteTop += parentNode.offsetTop;
}
- const x = absoluteLeft + element.offsetWidth / 2;
- const y = absoluteTop + element.offsetHeight / 2;
+ const x = Math.round(absoluteLeft + element.offsetWidth / 2);
+ const y = Math.round(absoluteTop + element.offsetHeight / 2);
const actions = new test_driver.Actions()
.pointerMove(x, y)
.pointerDown()
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes-expected.txt (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes-expected.txt 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -3,8 +3,8 @@
PASS Modal dialog in the outer iframe marks outer nodes in that iframe as inert.
PASS Modal dialog in the inner iframe marks outer nodes in that iframe as inert.
PASS Modal dialogs in both iframes mark outer nodes in these iframes as inert.
-FAIL Modal dialog in the main document marks outer nodes as inert. All contents of the outer iframe are also marked as inert. assert_equals: expected "" but got "(outer iframe: outer text)(outer iframe: dialog)"
-FAIL Modal dialogs in the main document and inner iframe mark outer nodes as inert. All contents of the outer iframe are also marked as inert. assert_equals: expected "" but got "(outer iframe: outer text)(outer iframe: dialog)"
-FAIL Modal dialogs in the main document and outer iframe mark outer nodes as inert. All contents of the outer iframe are also marked as inert. assert_equals: expected "" but got "(outer iframe: dialog)"
-FAIL Modal dialogs in the main document and both iframes mark outer nodes as inert. All contents of the outer iframe are also marked as inert. assert_equals: expected "" but got "(outer iframe: dialog)"
+PASS Modal dialog in the main document marks outer nodes as inert. Contents of the outer iframe aren't marked as inert.
+PASS Modal dialogs in the main document and inner iframe mark outer nodes as inert. Contents of the outer iframe aren't marked as inert.
+PASS Modal dialogs in the main document and outer iframe mark outer nodes as inert. Contents of the outer iframe aren't marked as inert.
+PASS Modal dialogs in the main document and both iframes mark outer nodes as inert. Contents of the outer iframe aren't marked as inert.
(main document: outer text) (main document: dialog)
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/inertness-with-modal-dialogs-and-iframes.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -4,9 +4,8 @@
<link rel="author" title="Oriol Brufau" href=""
<link rel="help" href=""
<meta name="assert" content="Checks that a modal dialog marks outer nodes as inert,
- but only in its document, not in the parent browsing context.
- Also, when an iframe is marked as inert by a modal dialog,
- all contents in the nested browsing context are marked as inert too.">
+ but only in its document, not in the parent browsing context,
+ nor in nested browsing contexts.">
<div id="log"></div>
<div id="wrapper">
(main document: outer text)
@@ -103,8 +102,8 @@
checkSelection(window, "(main document: dialog)");
checkSelection(innerIframeWindow, "(inner iframe: outer text)(inner iframe: dialog)");
- checkSelection(outerIframeWindow, "");
-}, "Modal dialog in the main document marks outer nodes as inert. All contents of the outer iframe are also marked as inert.");
+ checkSelection(outerIframeWindow, "(outer iframe: outer text)(outer iframe: dialog)");
+}, "Modal dialog in the main document marks outer nodes as inert. Contents of the outer iframe aren't marked as inert.");
promise_test(async function() {
showModals(this, [innerIframeWindow, window]);
@@ -111,8 +110,8 @@
checkSelection(window, "(main document: dialog)");
checkSelection(innerIframeWindow, "(inner iframe: dialog)");
- checkSelection(outerIframeWindow, "");
-}, "Modal dialogs in the main document and inner iframe mark outer nodes as inert. All contents of the outer iframe are also marked as inert.");
+ checkSelection(outerIframeWindow, "(outer iframe: outer text)(outer iframe: dialog)");
+}, "Modal dialogs in the main document and inner iframe mark outer nodes as inert. Contents of the outer iframe aren't marked as inert.");
promise_test(async function() {
showModals(this, [outerIframeWindow, window]);
@@ -119,8 +118,8 @@
checkSelection(window, "(main document: dialog)");
checkSelection(innerIframeWindow, "(inner iframe: outer text)(inner iframe: dialog)");
- checkSelection(outerIframeWindow, "");
-}, "Modal dialogs in the main document and outer iframe mark outer nodes as inert. All contents of the outer iframe are also marked as inert.");
+ checkSelection(outerIframeWindow, "(outer iframe: dialog)");
+}, "Modal dialogs in the main document and outer iframe mark outer nodes as inert. Contents of the outer iframe aren't marked as inert.");
promise_test(async function() {
showModals(this, [innerIframeWindow, outerIframeWindow, window]);
@@ -127,6 +126,6 @@
checkSelection(window, "(main document: dialog)");
checkSelection(innerIframeWindow, "(inner iframe: dialog)");
- checkSelection(outerIframeWindow, "");
-}, "Modal dialogs in the main document and both iframes mark outer nodes as inert. All contents of the outer iframe are also marked as inert.");
+ checkSelection(outerIframeWindow, "(outer iframe: dialog)");
+}, "Modal dialogs in the main document and both iframes mark outer nodes as inert. Contents of the outer iframe aren't marked as inert.");
</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-scroll-height.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-scroll-height.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-scroll-height.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -27,6 +27,6 @@
<script>
test(() => {
document.querySelector('dialog').showModal();
- assert_equals(document.scrollingElement.scrollHeight, 600);
+ assert_equals(document.scrollingElement.scrollHeight, window.innerHeight);
}, 'dialogs should be centered before computing overflow.');
</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log 2022-02-18 21:21:28 UTC (rev 290164)
@@ -50,7 +50,7 @@
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-close-event.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-close.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-enabled.html
-/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-delegatesfocus.html
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow-double-nested.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-shadow.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert.html
@@ -105,6 +105,7 @@
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-in-table-column-expected.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-in-table-column-ref.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-in-table-column.html
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-in-visibility-hidden.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-scroll-height.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-sibling-expected.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-sibling-ref.html
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,24 @@
+
+FAIL <input> that gets 'inert' attribute assert_equals: The element stops being focused expected Element node <body><div id="log"></div>
+
+<div class="test-wrapper" dat... but got Element node <input class="becomes-inert check-focus" inert=""></input>
+FAIL <input> whose parent gets 'inert' attribute assert_equals: The element stops being focused expected Element node <body><div id="log"></div>
+
+<div class="test-wrapper" dat... but got Element node <input class="check-focus"></input>
+FAIL <button> that gets 'inert' attribute assert_equals: The element stops being focused expected Element node <body><div id="log"></div>
+
+<div class="test-wrapper" dat... but got Element node <button class="becomes-inert check-focus" inert="">foo</b...
+FAIL <div> that gets 'inert' attribute assert_equals: The element stops being focused expected Element node <body><div id="log"></div>
+
+<div class="test-wrapper" dat... but got Element node <div class="becomes-inert check-focus" tabindex="-1" iner...
+FAIL <div> whose parent gets 'inert' attribute assert_equals: The element stops being focused expected Element node <body><div id="log"></div>
+
+<div class="test-wrapper" dat... but got Element node <div class="check-focus" tabindex="-1">bar</div>
+FAIL <div> whose grandparent gets 'inert' attribute assert_equals: The element stops being focused expected Element node <body><div id="log"></div>
+
+<div class="test-wrapper" dat... but got Element node <span class="check-focus" tabindex="-1">baz</span>
+
+
+foo
+bar
+baz
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative.html (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<meta charset="utf-8" />
+<title>Dynamic inertness on focused element</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href=""
+<meta name="assert" content="If a focused element becomes inert, it stops being focused.">
+<div id="log"></div>
+
+<div class="test-wrapper" data-name="<input> that gets 'inert' attribute">
+ <input class="becomes-inert check-focus">
+</div>
+
+<div class="test-wrapper" data-name="<input> whose parent gets 'inert' attribute">
+ <div class="becomes-inert">
+ <input class="check-focus">
+ </div>
+</div>
+
+<div class="test-wrapper" data-name="<button> that gets 'inert' attribute">
+ <button class="becomes-inert check-focus">foo</button>
+</div>
+
+<div class="test-wrapper" data-name="<div> that gets 'inert' attribute">
+ <div class="becomes-inert check-focus" tabindex="-1"></div>
+</div>
+
+<div class="test-wrapper" data-name="<div> whose parent gets 'inert' attribute">
+ <div class="becomes-inert">
+ <div class="check-focus" tabindex="-1">bar</div>
+ </div>
+</div>
+
+<div class="test-wrapper" data-name="<div> whose grandparent gets 'inert' attribute">
+ <div class="becomes-inert">
+ <p>
+ <span class="check-focus" tabindex="-1">baz</span>
+ </p>
+ </div>
+</div>
+
+<script src=""
+<script src=""
+<script>
+function nextRepaint() {
+ return new Promise(resolve => {
+ requestAnimationFrame(() => {
+ requestAnimationFrame(resolve);
+ });
+ });
+}
+
+const loaded = new Promise(resolve => {
+ addEventListener("load", resolve, {once: true});
+});
+promise_setup(() => loaded);
+
+for (const testWrapper of document.querySelectorAll(".test-wrapper")) {
+ const becomesInert = testWrapper.querySelector(".becomes-inert");
+ const checkFocus = testWrapper.querySelector(".check-focus");
+ promise_test(async function() {
+ checkFocus.focus();
+ assert_equals(document.activeElement, checkFocus, "The element is focused");
+
+ becomesInert.inert = true;
+
+ // The focus fixup rule should blur the element since it's no longer focusable.
+ // In Chromium this happens after a repaint (https://crbug.com/1275097).
+ await nextRepaint();
+ assert_equals(document.activeElement, document.body, "The element stops being focused");
+ }, testWrapper.dataset.name);
+}
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,41 @@
+
+PASS
+ normal `div`
+
+PASS
+ normal `span`
+
+PASS
+ normal `a`
+
+FAIL
+ `div` in `display: none`
+ assert_not_equals: got disallowed value Element node <div tabindex="-1" data-focusable="false">
+ `div` in...
+FAIL
+ `span` in `display: none`
+ assert_not_equals: got disallowed value Element node <span tabindex="-1" data-focusable="false">
+ `span` ...
+FAIL
+ `a` in `display: none`
+ assert_not_equals: got disallowed value Element node <a href="" data-focusable="false">
+ `a` in `display...
+PASS
+ inert `div`
+
+PASS
+ inert `span`
+
+PASS
+ inert `a`
+
+PASS
+ inert `div` in `display: none`
+
+PASS
+ inert `span` in `display: none`
+
+PASS
+ inert `a` in `display: none`
+
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative.html (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<meta charset="utf-8" />
+<title>Focusability of inert inside canvas</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href=""
+<link rel="help" href=""
+<link rel="help" href=""
+<link rel="help" href=""
+<meta name="assert" content="
+ Checks that inert elements are not focusable
+ even when being used as relevant canvas fallback content,
+ even in a display:none subtree">
+<div id="log"></div>
+<canvas>
+ <section>
+ <div tabindex="-1" data-focusable="true">
+ normal `div`
+ </div>
+ <span tabindex="-1" data-focusable="true">
+ normal `span`
+ </span>
+ <a href="" data-focusable="true">
+ normal `a`
+ </a>
+ </section>
+ <section style="display: none">
+ <div tabindex="-1" data-focusable="false">
+ `div` in `display: none`
+ </div>
+ <span tabindex="-1" data-focusable="false">
+ `span` in `display: none`
+ </span>
+ <a href="" data-focusable="false">
+ `a` in `display: none`
+ </a>
+ </section>
+ <section inert>
+ <div tabindex="-1" data-focusable="false">
+ inert `div`
+ </div>
+ <span tabindex="-1" data-focusable="false">
+ inert `span`
+ </span>
+ <a href="" data-focusable="false">
+ inert `a`
+ </a>
+ </section>
+ <section inert style="display: none">
+ <div tabindex="-1" data-focusable="false">
+ inert `div` in `display: none`
+ </div>
+ <span tabindex="-1" data-focusable="false">
+ inert `span` in `display: none`
+ </span>
+ <a href="" data-focusable="false">
+ inert `a` in `display: none`
+ </a>
+ </section>
+</canvas>
+<script src=""
+<script src=""
+<script>
+for (let element of document.querySelectorAll("[data-focusable]")) {
+ test(function() {
+ assert_not_equals(document.activeElement, element);
+ element.focus();
+ if (JSON.parse(element.dataset.focusable)) {
+ assert_equals(document.activeElement, element);
+ } else {
+ assert_not_equals(document.activeElement, element);
+ }
+ }, element.textContent);
+}
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,5 @@
+
+
+PASS Hit-testing doesn't reach contents of an inert iframe
+FAIL Hit-testing can reach contents of a no longer inert iframe assert_true: target is focused expected true got false
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative.html (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Hit-testing with inert iframe</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href=""
+<meta assert="assert" content="Contents of an inert iframe can't be reached by hit-testing">
+<script src=""
+<script src=""
+<script src=""
+<script src=""
+<script src=""
+
+<div id="wrapper" style="width: min-content">
+ <iframe id="iframe" inert></iframe>
+</div>
+
+<script>
+const iframe = document.getElementById("iframe");
+let iframeDoc;
+let target;
+
+promise_setup(async () => {
+ await new Promise(resolve => {
+ iframe.addEventListener("load", resolve, {once: true});
+ iframe.srcdoc = `
+ <style>#target { position: fixed; inset: 0 }</style>
+ <a id="target" href=""
+ `;
+ });
+ iframeDoc = iframe.contentDocument;
+ target = iframeDoc.getElementById("target");
+ target.addEventListener("click", e => {
+ e.preventDefault();
+ });
+});
+
+promise_test(async function() {
+ let reachedTarget = false;
+ target.addEventListener("mousedown", () => {
+ reachedTarget = true;
+ }, { once: true });
+
+ let reachedWrapper = false;
+ wrapper.addEventListener("mousedown", () => {
+ reachedWrapper = true;
+ }, { once: true });
+
+ await new test_driver.Actions()
+ .pointerMove(0, 0, { origin: wrapper })
+ .pointerDown()
+ .send();
+ this.add_cleanup(() => test_driver.click(document.body));
+
+ assert_false(target.matches(":focus"), "target is not focused");
+ assert_false(target.matches(":active"), "target is not active");
+ assert_false(target.matches(":hover"), "target is not hovered");
+ assert_false(reachedTarget, "target didn't get event");
+
+ assert_true(wrapper.matches(":hover"), "wrapper is hovered");
+ assert_true(reachedWrapper, "wrapper got event");
+}, "Hit-testing doesn't reach contents of an inert iframe");
+
+promise_test(async function() {
+ iframe.inert = false;
+
+ let reachedTarget = false;
+ target.addEventListener("mousedown", () => {
+ reachedTarget = true;
+ }, { once: true });
+
+ let reachedWrapper = false;
+ wrapper.addEventListener("mousedown", () => {
+ reachedWrapper = true;
+ }, { once: true });
+
+ await new test_driver.Actions()
+ .pointerMove(0, 0, { origin: wrapper })
+ .pointerDown()
+ .send();
+ this.add_cleanup(() => test_driver.click(document.body));
+
+ assert_true(target.matches(":focus"), "target is focused");
+ assert_true(target.matches(":active"), "target is active");
+ assert_true(target.matches(":hover"), "target is hovered");
+ assert_true(reachedTarget, "target got event");
+
+ assert_true(wrapper.matches(":hover"), "wrapper is hovered");
+ assert_false(reachedWrapper, "wrapper didn't get event");
+}, "Hit-testing can reach contents of a no longer inert iframe");
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,7 @@
+start
+
+start
+
+PASS Sequential navigation skips contents of inert iframe
+PASS Sequential navigation can pick contents of a no longer inert iframe
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative.html (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Tabbing with inert iframe</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href=""
+<link rel="help" href=""
+<meta assert="assert" content="Contents of an inert iframe can't be focused by tabbing">
+<script src=""
+<script src=""
+<script src=""
+<script src=""
+
+<div id="start" tabindex="0">start</div>
+<div id="inert" inert>
+ <iframe id="iframe"></iframe>
+</div>
+<div id="end" tabindex="0">start</a>
+
+<script>
+const tabKey = "\uE004";
+const start = document.getElementById("start");
+const inert = document.getElementById("inert");
+const end = document.getElementById("end");
+const iframe = document.getElementById("iframe");
+let iframeDoc;
+let target;
+
+promise_setup(async () => {
+ await new Promise(resolve => {
+ iframe.addEventListener("load", resolve, { once: true });
+ iframe.srcdoc = `<div id="target" tabindex="0">target</div>`;
+ });
+ iframeDoc = iframe.contentDocument;
+ target = iframeDoc.getElementById("target");
+});
+
+promise_test(async function() {
+ start.focus();
+ assert_equals(document.activeElement, start, "start got focus");
+ assert_false(iframeDoc.hasFocus(), "iframeDoc doesn't have focus");
+
+ await test_driver.send_keys(document.activeElement, tabKey);
+ assert_equals(document.activeElement, end, "end got focus");
+ assert_false(iframeDoc.hasFocus(), "iframeDoc still doesn't have focus");
+}, "Sequential navigation skips contents of inert iframe");
+
+promise_test(async function() {
+ start.focus();
+ assert_equals(document.activeElement, start, "start got focus");
+ assert_false(iframeDoc.hasFocus(), "iframeDoc doesn't have focus");
+
+ inert.inert = false;
+
+ await test_driver.send_keys(document.activeElement, tabKey);
+ assert_equals(document.activeElement, iframe, "iframe got focus");
+ assert_true(iframeDoc.hasFocus(), "iframeDoc has focus");
+
+ // The document element is also focusable in Firefox.
+ if (iframeDoc.activeElement === iframeDoc.documentElement) {
+ await test_driver.send_keys(document.activeElement, tabKey);
+ assert_equals(document.activeElement, iframe, "iframe got focus");
+ assert_true(iframeDoc.hasFocus(), "iframeDoc has focus");
+ }
+ assert_equals(iframeDoc.activeElement, target, "target got focus");
+}, "Sequential navigation can pick contents of a no longer inert iframe");
+</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-node-is-uneditable.tentative.html (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-node-is-uneditable.tentative.html 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-node-is-uneditable.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -16,11 +16,15 @@
var notEditable = document.querySelector('#not-editable');
var editable = document.querySelector('#editable');
-promise_test(async () => {
+promise_test(async function() {
notEditable.focus();
var oldValue = notEditable.textContent;
assert_equals(oldValue, "I'm not editable.");
- await test_driver.send_keys(document.body, 'a');
+ await promise_rejects_js(
+ this,
+ Error,
+ test_driver.send_keys(notEditable, 'a'),
+ "send_keys should reject for non-interactive elements");
assert_equals(notEditable.textContent, oldValue);
}, "Can't edit inert contenteditable");
@@ -28,7 +32,7 @@
editable.focus();
var oldValue = editable.textContent;
assert_equals(oldValue, "I'm editable.");
- await test_driver.send_keys(document.body, 'a');
+ await test_driver.send_keys(editable, 'a');
assert_not_equals(editable.textContent, oldValue);
}, "Can edit non-inert contenteditable");
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,6 @@
+
+PASS Modal dialog only marks outside nodes as inert
+PASS Inner nodes with 'inert' attribute become inert anyways
+PASS If the modal dialog has the 'inert' attribute, everything becomes inert
+FAIL If an ancestor of the dialog has the 'inert' attribute, everything becomes inert assert_equals: expected "" but got "dialog child"
+wrapper
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative.html (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<meta charset="utf-8" />
+<title>Interaction of 'inert' attribute with modal dialog</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href=""
+<meta name="assert" content="Checks that being part of a modal dialog does not protect a node from being marked inert by an 'inert' attribute.">
+<div id="log"></div>
+<div id="wrapper">
+ wrapper
+ <dialog id="dialog">
+ dialog
+ <span id="child">
+ child
+ </span>
+ </dialog>
+</div>
+<script src=""
+<script src=""
+<script>
+setup(() => {
+ dialog.showModal();
+ add_completion_callback(() => {
+ dialog.close();
+ getSelection().removeAllRanges();
+ });
+});
+
+function checkSelection(expectedText) {
+ const selection = getSelection();
+ selection.selectAllChildren(document.documentElement);
+ const actualText = selection.toString().trim();
+ assert_equals(actualText, expectedText);
+}
+
+test(function() {
+ checkSelection("dialog child");
+}, "Modal dialog only marks outside nodes as inert");
+
+test(function() {
+ child.inert = true;
+ this.add_cleanup(() => { child.inert = false; });
+ checkSelection("dialog");
+}, "Inner nodes with 'inert' attribute become inert anyways");
+
+test(function() {
+ dialog.inert = true;
+ this.add_cleanup(() => { dialog.inert = false; });
+ checkSelection("");
+}, "If the modal dialog has the 'inert' attribute, everything becomes inert");
+
+test(function() {
+ wrapper.inert = true;
+ this.add_cleanup(() => { wrapper.inert = false; });
+ checkSelection("");
+}, "If an ancestor of the dialog has the 'inert' attribute, everything becomes inert");
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,5 @@
+
+PASS Modal dialog only marks outside nodes as inert
+PASS Inner nodes with 'inert' attribute become inert anyways
+PASS If the modal dialog has the 'inert' attribute, everything becomes inert
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative.html (0 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative.html 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<meta charset="utf-8" />
+<title>Interaction of 'inert' attribute with modal dialog, when the dialog is the root element</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href=""
+<meta name="assert" content="Checks that being part of a modal dialog does not protect a node from being marked inert by an 'inert' attribute.">
+<div id="log"></div>
+<dialog id="dialog">
+ dialog
+ <span id="child">
+ child
+ </span>
+</dialog>
+<script src=""
+<script src=""
+<script>
+const dialog = document.getElementById("dialog");
+const root = document.documentElement;
+
+setup(() => {
+ root.remove();
+ document.append(dialog);
+ dialog.showModal();
+ add_completion_callback(() => {
+ getSelection().removeAllRanges();
+ });
+});
+
+function checkSelection(expectedText) {
+ const selection = getSelection();
+ selection.selectAllChildren(document.documentElement);
+ const actualText = selection.toString().trim();
+ assert_equals(actualText, expectedText);
+}
+
+test(function() {
+ checkSelection("dialog child");
+}, "Modal dialog only marks outside nodes as inert");
+
+test(function() {
+ child.inert = true;
+ this.add_cleanup(() => { child.inert = false; });
+ checkSelection("dialog");
+}, "Inner nodes with 'inert' attribute become inert anyways");
+
+test(function() {
+ dialog.inert = true;
+ this.add_cleanup(() => { dialog.inert = false; });
+ checkSelection("");
+}, "If the modal dialog has the 'inert' attribute, everything becomes inert");
+
+// Ideally this would happen in a completion callback, but then it would
+// be too late: the results would have been shown inside the dialog.
+dialog.remove();
+document.append(root);
+</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/inert/w3c-import.log (290163 => 290164)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/inert/w3c-import.log 2022-02-18 21:20:53 UTC (rev 290163)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/inert/w3c-import.log 2022-02-18 21:21:28 UTC (rev 290164)
@@ -14,8 +14,12 @@
None
------------------------------------------------------------------------
List of files:
+/LayoutTests/imported/w3c/web-platform-tests/inert/dynamic-inert-on-focused-element.tentative.html
+/LayoutTests/imported/w3c/web-platform-tests/inert/inert-canvas-fallback-content.tentative.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-computed-style.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-does-not-match-disabled-selector.tentative.html
+/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative.html
+/LayoutTests/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-in-shadow-dom.tentative.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-inlines.tentative.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-label-focus.tentative.html
@@ -24,3 +28,5 @@
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-node-is-unselectable.tentative.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-on-non-html.tentative.html
/LayoutTests/imported/w3c/web-platform-tests/inert/inert-on-slots.tentative.html
+/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-001.tentative.html
+/LayoutTests/imported/w3c/web-platform-tests/inert/inert-with-modal-dialog-002.tentative.html
Added: trunk/LayoutTests/platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-hittest.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,5 @@
+
+
+FAIL Hit-testing doesn't reach contents of an inert iframe assert_true: wrapper is hovered expected true got false
+FAIL Hit-testing can reach contents of a no longer inert iframe assert_true: target is focused expected true got false
+
Added: trunk/LayoutTests/platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt (0 => 290164)
--- trunk/LayoutTests/platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt (rev 0)
+++ trunk/LayoutTests/platform/ios-wk2/imported/w3c/web-platform-tests/inert/inert-iframe-tabbing.tentative-expected.txt 2022-02-18 21:21:28 UTC (rev 290164)
@@ -0,0 +1,10 @@
+start
+
+start
+
+FAIL Sequential navigation skips contents of inert iframe assert_equals: end got focus expected Element node <div id="end" tabindex="0">start
+
+<script>
+const tabKey =... but got Element node <div id="start" tabindex="0">start</div>
+FAIL Sequential navigation can pick contents of a no longer inert iframe assert_equals: iframe got focus expected Element node <iframe id="iframe" srcdoc="<div id="target" tabindex="0"... but got Element node <div id="start" tabindex="0">start</div>
+
