Diff
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (284156 => 284157)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2021-10-14 13:20:38 UTC (rev 284156)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2021-10-14 13:26:16 UTC (rev 284157)
@@ -1,3 +1,20 @@
+2021-10-14 Tim Nguyen <[email protected]>
+
+ Import new <dialog> focus-related WPT
+ https://bugs.webkit.org/show_bug.cgi?id=231736
+
+ Reviewed by Youenn Fablet.
+
+ Upstream commit: https://github.com/web-platform-tests/wpt/commit/d6ef7143ef347dcedd680fafa3a7d91e77624e0f
+
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected-expected.txt: Added.
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected.html: Added.
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert-expected.txt: Added.
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert.html: Added.
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close-expected.txt:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close.html:
+ * web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log:
+
2021-10-13 Tim Nguyen <[email protected]>
Implement <dialog> focusing steps
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected-expected.txt (0 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected-expected.txt 2021-10-14 13:26:16 UTC (rev 284157)
@@ -0,0 +1,9 @@
+
+
+FAIL dialog.show(): focusing steps should not run on disconnected <dialog> assert_equals: Focusing steps should not run expected Element node <input></input> but got Element node <body>
+<input>
+<script>
+test(() => {
+ const outerInput =...
+PASS Test that focusing steps do not run when dialog is disconnected
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected.html (0 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-disconnected.html 2021-10-14 13:26:16 UTC (rev 284157)
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>Test that focusing steps do not run when dialog is disconnected</title>
+<script src=""
+<script src=""
+</head>
+<body>
+<input>
+<script>
+test(() => {
+ const outerInput = document.querySelector("input");
+ outerInput.focus();
+ assert_equals(document.activeElement, outerInput,
+ "Focus should be on element we just focused");
+
+ const dialog = document.createElement("dialog");
+ assert_false(dialog.open, "Dialog should initially be closed");
+
+ const innerInput = document.createElement("input");
+ innerInput.autofocus = true;
+ dialog.append(innerInput);
+
+ dialog.show();
+
+ assert_equals(document.activeElement, outerInput, "Focusing steps should not run");
+
+ // Clean up
+ dialog.close();
+}, "dialog.show(): focusing steps should not run on disconnected <dialog>");
+
+test(() => {
+ assert_throws_dom("InvalidStateError", () => {
+ document.createElement("dialog").showModal();
+ }, "dialog.showModal() should throw on disconnected <dialog>");
+});
+</script>
+</body>
+</html>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert-expected.txt (0 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert-expected.txt 2021-10-14 13:26:16 UTC (rev 284157)
@@ -0,0 +1,6 @@
+
+
+FAIL Dialog focusing steps should not run when dialog is inert assert_equals: Dialog focusing steps should not run when dialog is inert expected Element node <input id="outer-input"></input> but got Element node <body>
+<input id="outer-input">
+<dialog inert="" open="">...
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert.html (0 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert.html 2021-10-14 13:26:16 UTC (rev 284157)
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>Test that focusing steps do not run when dialog is inert</title>
+<script src=""
+<script src=""
+</head>
+<body>
+<input id="outer-input">
+<dialog>
+ <input autofocus>
+</dialog>
+<script>
+function test_focusing_steps_with_inert_dialog(isModal) {
+ const outerInput = document.querySelector("#outer-input");
+ outerInput.focus();
+ assert_equals(document.activeElement, outerInput,
+ "Focus should be on element we just focused");
+
+ const dialog = document.querySelector("dialog");
+ assert_false(dialog.open, "Dialog should initially be closed");
+
+ dialog.inert = true;
+
+ if (isModal) {
+ dialog.showModal();
+ } else {
+ dialog.show();
+ }
+
+ assert_equals(document.activeElement, outerInput,
+ "Dialog focusing steps should not run when dialog is inert");
+
+ // Clean up
+ dialog.close();
+ dialog.inert = false;
+}
+
+test(() => {
+ test_focusing_steps_with_inert_dialog(false);
+ test_focusing_steps_with_inert_dialog(true);
+}, "Dialog focusing steps should not run when dialog is inert");
+</script>
+</body>
+</html>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close-expected.txt (284156 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close-expected.txt 2021-10-14 13:20:38 UTC (rev 284156)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close-expected.txt 2021-10-14 13:26:16 UTC (rev 284157)
@@ -1,8 +1,9 @@
-
-PASS Focus should be moved to the previously focused element(Simple dialog usage)
-PASS Focus should be moved to the previously focused element(Complex dialog usage)
+PASS Focus should be moved to the previously focused element (Simple dialog usage)
+PASS Focus should be moved to the previously focused element (Complex dialog usage)
+PASS Focus should be moved to the previously focused element even if it has moved in between show/close
+PASS Focus should be moved to the previously focused element even if it has moved to shadow DOM root in between show/close
PASS Focus should be moved to the body if the previously focused element is removed
PASS Focus should be moved to the shadow DOM host if the previouly focused element is a shadow DOM node
FAIL Focus should not scroll if the previously focused element is outside the viewport assert_true: expected true got false
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close.html (284156 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close.html 2021-10-14 13:20:38 UTC (rev 284156)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/focus-after-close.html 2021-10-14 13:26:16 UTC (rev 284157)
@@ -1,6 +1,6 @@
<!DOCTYPE html>
-<meta charset=urf-8>
-<meta name=viewport content="width=device-width,initial-scale=1">
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Test focus is moved to the previously focused element when dialog is closed</title>
<script src=""
<script src=""
@@ -21,7 +21,7 @@
function test_move_to_previously_focused(showModal) {
const input = document.querySelector("input");
input.focus();
- const dialog = document.querySelector('dialog');
+ const dialog = document.querySelector("dialog");
if (showModal) {
dialog.showModal();
} else {
@@ -36,7 +36,7 @@
async function test_move_to_previously_focused_with_complex_dialog_usage(showModal) {
const input = document.querySelector("input");
input.focus();
- const dialog = document.querySelector('dialog');
+ const dialog = document.querySelector("dialog");
if (showModal) {
dialog.showModal();
} else {
@@ -56,12 +56,66 @@
assert_equals(document.activeElement, input);
}
+// Test focus is moved to the previously focused element even if that element moved in between
+function test_element_move_in_between_show_close(showModal) {
+ const input = document.querySelector("input");
+ input.focus();
+ const dialog = document.querySelector("dialog");
+
+ assert_equals(input.nextElementSibling, dialog, "Element is in correct position");
+
+ if (showModal) {
+ dialog.showModal();
+ } else {
+ dialog.show();
+ }
+
+ document.body.appendChild(input);
+ assert_not_equals(input.nextElementSibling, dialog, "Element should have moved");
+
+ dialog.close();
+ assert_equals(document.activeElement, input, "Focus should be restored to previously focused input");
+
+ // Clean up
+ document.body.insertBefore(input, dialog);
+}
+
+// Test focus is moved to the previously focused element even if that element moved to shadow root in between
+function test_element_move_to_shadow_root_in_between_show_close(showModal) {
+ const input = document.querySelector("input");
+ input.focus();
+ const dialog = document.querySelector("dialog");
+
+ assert_equals(input.nextElementSibling, dialog, "Element is in correct position");
+
+ if (showModal) {
+ dialog.showModal();
+ } else {
+ dialog.show();
+ }
+
+ const shadowHost = document.createElement("div");
+ const shadowRoot = shadowHost.attachShadow({mode: "open"});
+ shadowRoot.appendChild(input);
+ document.body.appendChild(shadowHost);
+
+ assert_not_equals(input.nextElementSibling, dialog, "Element should have moved");
+
+ dialog.close();
+ assert_equals(shadowRoot.activeElement, input, "Focus should be restored to previously focused input");
+ assert_equals(document.activeElement, shadowHost, "document.activeElement should be previously focused input's shadow DOM host");
+
+ // Clean up
+ document.body.insertBefore(input, dialog);
+ shadowHost.remove();
+}
+
// Test focus is moved to <body> if the previously focused
// element can't be focused
function test_move_to_body_if_fails(showModal) {
const input = document.querySelector("input");
input.focus();
- const dialog = document.querySelector('dialog');
+ const dialog = document.querySelector("dialog");
if (showModal) {
dialog.showModal();
} else {
@@ -70,7 +124,9 @@
dialog.close();
input.remove();
assert_equals(document.activeElement, document.body);
- document.body.appendChild(input);
+
+ // Clean up
+ document.body.insertBefore(input, dialog);
}
// Test focus is moved to shadow host if the previously
@@ -78,7 +134,7 @@
function test_move_to_shadow_host(showModal) {
const shadowHost = document.createElement("div");
- const shadowRoot = shadowHost.attachShadow({mode: 'open'});
+ const shadowRoot = shadowHost.attachShadow({mode: "open"});
shadowRoot.appendChild(document.createElement("input"));
document.body.appendChild(shadowHost);
@@ -88,7 +144,7 @@
assert_equals(document.activeElement, shadowHost);
assert_equals(shadowRoot.activeElement, inputElement);
- const dialog = document.querySelector('dialog');
+ const dialog = document.querySelector("dialog");
if (showModal) {
dialog.showModal();
} else {
@@ -98,6 +154,9 @@
assert_equals(document.activeElement, shadowHost);
assert_equals(shadowRoot.activeElement, inputElement);
+
+ // Clean up
+ shadowHost.remove();
}
// Test moving the focus doesn't scroll the viewport
@@ -112,7 +171,7 @@
// scrolled to it
assert_true(document.documentElement.scrollTop > 0 );
- const dialog = document.querySelector('dialog');
+ const dialog = document.querySelector("dialog");
if (showModal) {
dialog.showModal();
} else {
@@ -131,26 +190,36 @@
test(() => {
test_move_to_previously_focused(true);
test_move_to_previously_focused(false);
-}, 'Focus should be moved to the previously focused element(Simple dialog usage)');
+}, "Focus should be moved to the previously focused element (Simple dialog usage)");
promise_test(async () => {
await test_move_to_previously_focused_with_complex_dialog_usage(true);
await test_move_to_previously_focused_with_complex_dialog_usage(false);
-}, 'Focus should be moved to the previously focused element(Complex dialog usage)');
+}, "Focus should be moved to the previously focused element (Complex dialog usage)");
test(() => {
+ test_element_move_in_between_show_close(true);
+ test_element_move_in_between_show_close(false);
+}, "Focus should be moved to the previously focused element even if it has moved in between show/close");
+
+test(() => {
+ test_element_move_to_shadow_root_in_between_show_close(true);
+ test_element_move_to_shadow_root_in_between_show_close(false);
+}, "Focus should be moved to the previously focused element even if it has moved to shadow DOM root in between show/close");
+
+test(() => {
test_move_to_body_if_fails(true);
test_move_to_body_if_fails(false);
-}, 'Focus should be moved to the body if the previously focused element is removed');
+}, "Focus should be moved to the body if the previously focused element is removed");
test(() => {
test_move_to_shadow_host(true);
test_move_to_shadow_host(false);
-}, 'Focus should be moved to the shadow DOM host if the previouly focused element is a shadow DOM node');
+}, "Focus should be moved to the shadow DOM host if the previouly focused element is a shadow DOM node");
test(() => {
test_move_focus_dont_scroll_viewport(true);
test_move_focus_dont_scroll_viewport(false);
-}, 'Focus should not scroll if the previously focused element is outside the viewport');
+}, "Focus should not scroll if the previously focused element is outside the viewport");
</script>
</body>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log (284156 => 284157)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log 2021-10-14 13:20:38 UTC (rev 284156)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log 2021-10-14 13:26:16 UTC (rev 284157)
@@ -41,6 +41,8 @@
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-cancel-with-select.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-focusing-steps-disconnected.html
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-inert.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusing-steps-prevent-autofocus.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-form-submission.html
/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-inert.tentative.html
