Re-import dialog element WPT tests

https://bugs.webkit.org/show_bug.cgi?id=270017 Reviewed by Anne van Kesteren. Upstream commit: web-platform-tests/wpt@da26ae6 * LayoutTests/TestExpectations: * LayoutTests/imported/w3c/resources/resource-files.json: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/WEB_FEATURES.yml: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/backdrop-stacking-order.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-close-via-attribute-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-close-via-attribute.html: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focus-previous-outside.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusability-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusability.html: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-open.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-showModal-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-showModal.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-generated-content.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/modal-dialog-selection-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-display-none.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-nesting.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-expected.html: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-ref.html: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute.html: Added. * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-dynamic.html: * LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log: Canonical link: https://commits.webkit.org/275283@main
WebKit · Feb 24, 2024 · bb7f816 · bb7f816
1 parent 669e172
commit bb7f816
Show file tree

Hide file tree

Showing 21 changed files with 203 additions and 17 deletions.
diff --git a/LayoutTests/TestExpectations b/LayoutTests/TestExpectations
@@ -7426,6 +7426,8 @@ webkit.org/b/267951 imported/w3c/web-platform-tests/html/dom/elements/global-att
 webkit.org/b/267951 imported/w3c/web-platform-tests/html/dom/elements/global-attributes/dir-shadow-41.html [ ImageOnlyFailure ]
 webkit.org/b/267951 imported/w3c/web-platform-tests/html/dom/elements/global-attributes/dir_auto-N-EN.html [ ImageOnlyFailure ]
 
+webkit.org/b/250795 imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusability.html [ Skip ]
+
 # web-platform-tests/svg/painting/reftests failures
 imported/w3c/web-platform-tests/svg/painting/reftests/fallback-001.svg [ ImageOnlyFailure ]
 imported/w3c/web-platform-tests/svg/painting/reftests/marker-implicit-subpaths.html [ ImageOnlyFailure ]

diff --git a/LayoutTests/imported/w3c/resources/resource-files.json b/LayoutTests/imported/w3c/resources/resource-files.json
@@ -7370,6 +7370,7 @@
         "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-display-none-ref.html",
         "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-nesting-ref.html",
         "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-position-ref.html",
+        "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-ref.html",
         "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-correct-order-remove-readd-ref.html",
         "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-dynamic-ref.html",
         "web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-ref.html",

diff --git a/...eb-platform-tests/html/semantics/interactive-elements/the-dialog-element/WEB_FEATURES.yml b/...eb-platform-tests/html/semantics/interactive-elements/the-dialog-element/WEB_FEATURES.yml
@@ -0,0 +1,3 @@
+features:
+- name: dialog
+  files: "**"
diff --git a/...tests/html/semantics/interactive-elements/the-dialog-element/backdrop-stacking-order.html b/...tests/html/semantics/interactive-elements/the-dialog-element/backdrop-stacking-order.html
@@ -61,9 +61,6 @@
     z-index: -1000;  /* z-index has no effect. */
 }
 </style>
-<head>
-<meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-4" />
-</head>
 <body>
 Test for dialog::backdrop stacking order. The test passes if there are 6
 boxes enclosed in each other, becoming increasingly smaller and brighter

diff --git a/...semantics/interactive-elements/the-dialog-element/dialog-close-via-attribute-expected.txt b/...semantics/interactive-elements/the-dialog-element/dialog-close-via-attribute-expected.txt
@@ -0,0 +1,5 @@
+button
+
+FAIL Removing the open attribute from an open modal dialog should run the closing algorithm. assert_false: The dialog should not match :modal after closing. expected false got true
+FAIL Removing the open attribute from an open non-modal dialog should fire a close event. assert_true: The close event should be fired when removing the open attribute. expected true got false
+
diff --git a/...ts/html/semantics/interactive-elements/the-dialog-element/dialog-close-via-attribute.html b/...ts/html/semantics/interactive-elements/the-dialog-element/dialog-close-via-attribute.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/issues/5802">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+
+<button>button</button>
+<dialog>hello world</dialog>
+
+<script>
+const dialog = document.querySelector('dialog');
+const button = document.querySelector('button');
+
+promise_test(async t => {
+  dialog.showModal();
+
+  let closeFired = false;
+  let cancelFired = false;
+  dialog.addEventListener('close', () => closeFired = true);
+  dialog.addEventListener('cancel', () => cancelFired = true);
+
+  dialog.removeAttribute('open');
+  await new Promise(resolve => t.step_timeout(resolve, 0));
+  await new Promise(requestAnimationFrame);
+
+  assert_false(dialog.matches(':modal'),
+    'The dialog should not match :modal after closing.');
+  assert_false(cancelFired,
+    'The cancel event should not fire when removing the open attribute.');
+  assert_true(closeFired,
+    'The close event should be fired when removing the open attribute.');
+
+  let buttonFiredClick = false;
+  button.addEventListener('click', () => buttonFiredClick = true);
+  await test_driver.click(button);
+  assert_true(buttonFiredClick,
+    'The page should not be inert or blocked after removing the open attribute.');
+}, 'Removing the open attribute from an open modal dialog should run the closing algorithm.');
+
+promise_test(async t => {
+  dialog.show();
+
+  let closeFired = false;
+  let cancelFired = false;
+  dialog.addEventListener('close', () => closeFired = true);
+  dialog.addEventListener('cancel', () => cancelFired = true);
+
+  dialog.removeAttribute('open');
+  await new Promise(resolve => t.step_timeout(resolve, 0));
+  await new Promise(requestAnimationFrame);
+
+  assert_false(cancelFired,
+    'The cancel event should not fire when removing the open attribute.');
+  assert_true(closeFired,
+    'The close event should be fired when removing the open attribute.');
+}, 'Removing the open attribute from an open non-modal dialog should fire a close event.');
+</script>
diff --git a/...html/semantics/interactive-elements/the-dialog-element/dialog-focus-previous-outside.html b/...html/semantics/interactive-elements/the-dialog-element/dialog-focus-previous-outside.html
@@ -3,7 +3,6 @@
 <link rel=help href="https://github.com/whatwg/html/issues/8904">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
-<script src="/resources/declarative-shadow-dom-polyfill.js"></script>
 
 <button id=b1>button 1</button>
 <button id=b2>button 2</button>
@@ -33,8 +32,6 @@
 <dialog id=mydialog2>hello world</dialog>
 
 <script>
-polyfill_declarative_shadow_dom(document);
-
 test(() => {
   b1.focus();
   mydialog.show();

diff --git a/...s/html/semantics/interactive-elements/the-dialog-element/dialog-focusability-expected.txt b/...s/html/semantics/interactive-elements/the-dialog-element/dialog-focusability-expected.txt
@@ -0,0 +1,14 @@
+CONSOLE MESSAGE: Unhandled Promise Rejection: Error: assert_equals: Focus order mismatch at step 2/11 expected Element node <button id="within1">button</button> but got Element node <dialog tabindex="0" id="dialog2" open="">
+  <button id="...
+before button after 1 button after 2 button after 3 button  after 4
+
+Harness Error (FAIL), message = Unhandled rejection: assert_equals: Focus order mismatch at step 2/11 expected Element node <button id="within1">button</button> but got Element node <dialog tabindex="0" id="dialog2" open="">
+  <button id="...
+
+TIMEOUT The dialog element itself should not be keyboard focusable. Test timed out
+
+Harness Error (FAIL), message = Unhandled rejection: assert_equals: Focus order mismatch at step 2/11 expected Element node <button id="within1">button</button> but got Element node <dialog tabindex="0" id="dialog2" open="">
+  <button id="...
+
+TIMEOUT The dialog element itself should not be keyboard focusable. Test timed out
+
diff --git a/...orm-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusability.html b/...orm-tests/html/semantics/interactive-elements/the-dialog-element/dialog-focusability.html
@@ -0,0 +1,58 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>dialog element: focusability</title>
+<link rel=help href="https://github.com/whatwg/html/pull/8199">
+<link rel=author href="mailto:masonf@chromium.org">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+
+<button id="before">before</button>
+<dialog id="dialog1" open>
+  <button id="within1">button</button>
+</dialog>
+<button id="after1">after 1</button>
+<dialog tabindex=0 id="dialog2" open>
+  <button id="within2">button</button>
+</dialog>
+<button id="after2">after 2</button>
+<dialog tabindex="-1" id="dialog3" open>
+  <button id="within3">button</button>
+</dialog>
+<button id="after3">after 3</button>
+<dialog contenteditable="true" id="dialog4" open>
+  <button id="within4">button</button>
+</dialog>
+<button id="after4">after 4</button>
+
+<style>
+  #dialog1 { top: 25px; }
+  #dialog2 { top: 100px; }
+  #dialog3 { top: 175px; }
+  #dialog4 { top: 250px; }
+</style>
+
+<script>
+  function navigateForward() {
+    const TAB = '\ue004';
+    return test_driver.send_keys(document.body, TAB);
+  }
+  async function assert_focus_order(elements) {
+    assert_true(elements.length >= 2);
+    elements[0].focus();
+    for(let i=0;i<elements.length;++i) {
+      assert_equals(document.activeElement,elements[i],`Focus order mismatch at step ${i+1}/${elements.length}`);
+      await navigateForward();
+    }
+  }
+
+  async_test((t) => {
+    window.onload = async () => {
+      await assert_focus_order([before,within1,after1,dialog2,within2,after2,
+        within3,after3,dialog4,within4,after4]);
+      t.done();
+    };
+  }, "The dialog element itself should not be keyboard focusable.");
+</script>
diff --git a/...eb-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-open.html b/...eb-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-open.html
@@ -37,7 +37,9 @@
 
     // close event is async, give it a chance to be fired
     t.step_timeout(function() {
-      t.done();
+      requestAnimationFrame(() => {
+        t.done();
+      });
     }, 0);
   }, "On setting it to false, the close event should not be fired");
 </script>
diff --git a/...ests/html/semantics/interactive-elements/the-dialog-element/dialog-showModal-expected.txt b/...ests/html/semantics/interactive-elements/the-dialog-element/dialog-showModal-expected.txt
@@ -9,6 +9,6 @@ FAIL opening dialog without focusable children assert_equals: expected Element n
 <d...
 PASS opening dialog with multiple focusable children
 PASS opening dialog with multiple focusable children, one having the autofocus attribute
-PASS when opening multiple dialogs, the most recently opened is rendered on top
+FAIL when opening multiple dialogs, the most recently opened is rendered on top assert_equals: expected Element node <dialog id="d10" open=""></dialog> but got Element node <dialog id="d11" open=""></dialog>
 PASS Although the document is not attached to any pages, showModal() should execute as normal.
 OK
diff --git a/...atform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-showModal.html b/...atform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-showModal.html
@@ -161,11 +161,11 @@
     assert_equals(topElement(), d11);
 
     // Removing the open attribute and running through the showModal() algorithm
-    // again should not promote d10 to the top.
+    // again should promote d10 to the top.
     d10.removeAttribute("open");
     assert_equals(topElement(), d11);
     d10.showModal();
-    assert_equals(topElement(), d11);
+    assert_equals(topElement(), d10);
 
     // Closing d11 with close() should cause d10 to be the topmost element.
     d11.close();

diff --git a/...tml/semantics/interactive-elements/the-dialog-element/modal-dialog-generated-content.html b/...tml/semantics/interactive-elements/the-dialog-element/modal-dialog-generated-content.html
@@ -49,9 +49,6 @@
     background: red;
 }
 </style>
-<head>
-<meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-3" />
-</head>
 <body>
 Test for a modal dialog with ::before, ::after, and ::backdrop. The test passes
 if there are two green boxes, one with the texts "::before" and "::after" in it.

diff --git a/...tml/semantics/interactive-elements/the-dialog-element/modal-dialog-selection-expected.txt b/...tml/semantics/interactive-elements/the-dialog-element/modal-dialog-selection-expected.txt
@@ -2,5 +2,5 @@
 
 FAIL By default, text inside a modal dialog can be selected assert_equals: expected "345678" but got "123456789A"
 PASS Clicking on backdrop doesn't select text
-PASS 'user-select: none' prevents text from being selected
+FAIL 'user-select: none' prevents text from being selected assert_equals: expected "" but got "123456789A"
 
diff --git a/...-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-display-none.html b/...-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-display-none.html
@@ -1,7 +1,6 @@
 <!DOCTYPE html>
 <html>
 <head>
-<meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-3" />
 <link rel="match" href="top-layer-display-none-ref.html">
 <link rel="help" href="https://fullscreen.spec.whatwg.org/#new-stacking-layer">
 <style>

diff --git a/...tform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-nesting.html b/...tform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-nesting.html
@@ -1,7 +1,6 @@
 <!DOCTYPE html>
 <html>
 <head>
-<meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-7" />
 <link rel="match" href="top-layer-nesting-ref.html">
 <link rel="help" href="https://fullscreen.spec.whatwg.org/#new-stacking-layer">
 <style>

diff --git a/.../interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-expected.html b/.../interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-expected.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<meta charset="utf-8">
+<head>
+  <title>Shown modal dialog where the popover attribute is removed</title>
+</head>
+<body>
+  <dialog popover style="padding: 2em"></dialog>
+  <script>
+    const d = document.querySelector("dialog");
+    d.showModal();
+  </script>
+</body>
+<html>
+
diff --git a/...ntics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-ref.html b/...ntics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-ref.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<meta charset="utf-8">
+<head>
+  <title>Shown modal dialog where the popover attribute is removed</title>
+</head>
+<body>
+  <dialog popover style="padding: 2em"></dialog>
+  <script>
+    const d = document.querySelector("dialog");
+    d.showModal();
+  </script>
+</body>
+<html>
+
diff --git a/...semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute.html b/...semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<meta charset="utf-8">
+<meta name="assert" content="Removing the popover attribute of a hidden popover should not remove the dialog from the top layer.">
+<head>
+  <title>Shown modal dialog where the popover attribute is removed</title>
+  <link rel="help" href="https://html.spec.whatwg.org/multipage/popover.html#hide-popover-algorithm">
+  <link rel="match" href="top-layer-remove-popover-attribute-ref.html">
+</head>
+<body>
+  <dialog popover style="padding: 2em"></dialog>
+  <script>
+    const d = document.querySelector("dialog");
+    d.showModal();
+    d.popover = null;
+  </script>
+</body>
+<html>
diff --git a/...ts/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-dynamic.html b/...ts/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-dynamic.html
@@ -1,7 +1,6 @@
 <!DOCTYPE html>
 <html>
 <head>
-<meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-8" />
 <link rel="match" href="top-layer-stacking-dynamic-ref.html">
 <link rel="help" href="https://fullscreen.spec.whatwg.org/#new-stacking-layer">
 <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dialog-element">

diff --git a/.../web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log b/.../web-platform-tests/html/semantics/interactive-elements/the-dialog-element/w3c-import.log
@@ -14,6 +14,7 @@ Property values requiring vendor prefixes:
 None
 ------------------------------------------------------------------------
 List of files:
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/WEB_FEATURES.yml
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/abspos-dialog-layout.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/backdrop-descendant-selector-expected.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/backdrop-descendant-selector-ref.html
@@ -50,11 +51,13 @@ List of files:
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-canceling.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/dialog-close-event-async.html
 /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-via-attribute.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-previous-outside.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-focusability.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
@@ -183,6 +186,9 @@ List of files:
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-position-static-expected.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-position-static.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-position.html
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-expected.html
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute-ref.html
+/LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-remove-popover-attribute.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-correct-order-remove-readd-expected.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-correct-order-remove-readd-ref.html
 /LayoutTests/imported/w3c/web-platform-tests/html/semantics/interactive-elements/the-dialog-element/top-layer-stacking-correct-order-remove-readd.html