Add WPT for overlay user-agent rules
This was asked for in the HTML PR here:
https://github.com/whatwg/html/pull/9093#discussion_r1198920153
Change-Id: I94e6960803a3fa9c6e1da4dc4393691b1c969c4b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4555988
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Commit-Queue: Joey Arhar <jarhar@chromium.org>
Auto-Submit: Joey Arhar <jarhar@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1150875}
diff --git a/css/css-position/overlay/overlay-user-agent-rules.html b/css/css-position/overlay/overlay-user-agent-rules.html
new file mode 100644
index 0000000..427eb8f
--- /dev/null
+++ b/css/css-position/overlay/overlay-user-agent-rules.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9093">
+<link rel=help href="https://drafts.csswg.org/css-position-4/#overlay">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<title>CSS Position Test: User agent style for overlay</title>
+
+<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>
