Add WPT for overlay user-agent rules

This was asked for in the HTML PR here: whatwg/html#9093 (comment) Change-Id: I94e6960803a3fa9c6e1da4dc4393691b1c969c4b
web-platform-tests · May 23, 2023 · fe57c4c · fe57c4c
1 parent b4fb421
commit fe57c4c
Showing 1 changed file with 40 additions and 0 deletions.
diff --git a/css/css-position/overlay/overlay-user-agent-rules.html b/css/css-position/overlay/overlay-user-agent-rules.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:[email protected]">
+<link rel=help href="https://github.com/whatwg/html/pull/9093">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<style>
+div {
+  overlay: auto;
+}
+</style>
+
+<body>
+<script>
+test(() => {
+  const div = document.createElement('div');
+  document.body.appendChild(div);
+  div.style.overlay = 'auto';
+  assert_equals(getComputedStyle(div).overlay, 'none');
+}, 'HTML elements should have overlay:none !important from the user-agent.');
+
+test(() => {
+  const svg = document.createElement('svg');
+  document.body.appendChild(svg);
+  svg.style.overlay = 'auto';
+  assert_equals(getComputedStyle(svg).overlay, 'none');
+}, 'SVG elements should have overlay:none !important from the user-agent.');
+
+test(() => {
+  const nullNamespace = document.createElementNS(null, 'div');
+  document.body.appendChild(nullNamespace);
+  assert_equals(getComputedStyle(nullNamespace).overlay, 'none');
+}, 'Null namespace elements should have overlay:none !important from the user-agent.');
+
+test(() => {
+  const weirdNamespace = document.createElementNS('hello world', 'div');
+  document.body.appendChild(weirdNamespace);
+  assert_equals(getComputedStyle(weirdNamespace).overlay, 'none');
+}, 'Arbitrary namespace elements should have overlay:none !important from the user-agent.');
+</script>