Clean up modal dialog tests and split out :modal pseudo-class test

Fixes web-platform-tests/interop#79
nt1m · May 18, 2022 · 316ab94 · 316ab94
1 parent 76522e2
commit 316ab94
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 38 deletions.
diff --git a/css/selectors/modal-pseudo-class.html b/css/selectors/modal-pseudo-class.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<title>:modal pseudo-class</title>
+<link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
+<link rel="help" href="https://drafts.csswg.org/selectors/#modal-state">
+
+<dialog id="dialog">Just another dialog.</dialog>
+
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+  setup({ single_test: true });
+  const dialog = document.getElementById("dialog");
+  assert_false(dialog.matches(":modal"), "dialog is initially closed (does not match :modal)");
+
+  dialog.showModal();
+  assert_true(dialog.matches(":modal"), "dialog should match :modal after showModal() call");
+
+  dialog.close();
+  assert_false(dialog.matches(":modal"), "dialog should no longer match :modal after close() call");
+
+  dialog.show();
+  assert_false(dialog.matches(":modal"), "dialog shouldn't match :modal after show() call");
+
+  dialog.close();
+  dialog.showModal();
+  assert_true(dialog.matches(":modal"), "dialog should match :modal after showModal() call");
+
+  dialog.remove();
+  assert_false(dialog.matches(":modal"), "dialog shouldn't match :modal after being removed from document");
+  document.body.append(dialog);
+  assert_false(dialog.matches(":modal"), "dialog shouldn't match :modal after being re-appended to document");
+
+  dialog.close();
+</script>
diff --git a/html/semantics/interactive-elements/the-dialog-element/dialog-show-modal.html b/html/semantics/interactive-elements/the-dialog-element/dialog-show-modal.html
diff --git a/...lement/dialog-show-modal-inert-crash.html → ...element/dialog-showModal-inert-crash.html b/...lement/dialog-show-modal-inert-crash.html → ...element/dialog-showModal-inert-crash.html
diff --git a/html/semantics/interactive-elements/the-dialog-element/dialog-showModal.html b/html/semantics/interactive-elements/the-dialog-element/dialog-showModal.html
@@ -62,10 +62,12 @@
   test(function(){
     assert_false(d1.open);
     assert_false(d1.hasAttribute("open"));
+    assert_equals(getComputedStyle(d1).display, "none");
     d1.showModal();
     this.add_cleanup(function() { d1.close(); });
     assert_true(d1.open);
     assert_equals(d1.getAttribute("open"), "");
+    assert_equals(getComputedStyle(d1).display, "block");
     assert_equals(document.activeElement, b1);
   });
 
@@ -169,4 +171,18 @@
     d11.close();
     assert_equals(topElement(), d10);
   }, "when opening multiple dialogs, the most recently opened is rendered on top");
+
+  test(() => {
+    assert_false(d11.open);
+    d11.parentNode.removeChild(d11);
+    assert_throws_dom("INVALID_STATE_ERR", () => d11.showModal());
+
+    const doc = document.implementation.createHTMLDocument();
+    doc.body.appendChild(d11);
+    this.add_cleanup(() => document.body.append(d11));
+    assert_false(d11.open);
+    d11.showModal();
+    assert_true(d11.open);
+    this.add_cleanup(() => d11.close());
+  }, "Although the document is not attached to any pages, showModal() should execute as normal.");
 </script>