1 files changed, 78 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-content/content-none-details.html b/testing/web-platform/tests/css/css-content/content-none-details.html
new file mode 100644
index 0000000000..6ac94c3e86
--- /dev/null
+++ b/testing/web-platform/tests/css/css-content/content-none-details.html
@@ -0,0 +1,78 @@
+<!doctype html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>CSS Content: content:none on DETAILS</title>
+  <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1699964">
+  <link rel="help" href="https://drafts.csswg.org/css-content/#valdef-content-none">
+  <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1699964">
+  <link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
+  <meta name="flags" content="ahem">
+  <meta name="assert" content="content:none should inhibit the <details> children from having boxes.  Its pseudos should not be affected though.">
+  <link rel="match" href="content-none-details-ref.html">
+  <style>
+html,body {
+  color:black; background-color:white; font:4px/1 Ahem; padding:0; margin:0;
+}
+body { margin-left: 3ch; }
+body > * {
+  content:none;
+  padding:0; margin:0; border:none;
+}
+::marker { content: 'M'; }
+.after::after { content: 'A'; }
+.before::before { content: 'B'; }
+
+  </style>
+</head>
+<body>
+
+<script>
+  document.body.style.display = 'none';
+
+  const display = [
+    "display:block", "display:inline", "display:ruby", "display:none", "display:grid",
+    "display:flex", "display:table", "display:list-item", "display:contents",
+    "columns:2",
+  ];
+  const overflow = [
+    "", "overflow:scroll", "overflow:clip",
+  ];
+  const position = [
+    "", "position:absolute",
+  ];
+  const tags = [
+    "details",
+  ];
+  const classes = [
+    "", "after", "before",
+  ];
+  const body = document.body;
+  for (var d of display) {
+    for (var o of overflow) {
+      for (var p of position) {
+        for (var c of classes) {
+          for (var t of tags) {
+            let elem = document.createElement(t);
+            elem.style = d + ';' + o + ';' + p + ';'
+            elem.className = c;
+            elem.setAttribute("open", "true");
+            let summary = document.createElement("summary");
+            summary.append(document.createTextNode("FAIL"));
+            elem.append(summary);
+            elem.append(document.createTextNode("FAIL"));
+            body.append(elem);
+          }
+        }
+      }
+    }
+  }
+
+  document.body.style.display = '';
+</script>
+
+</body>
+</html>