summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 09:22:09 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 09:22:09 +0000
commit43a97878ce14b72f0981164f87f2e35e14151312 (patch)
tree620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html
parentInitial commit. (diff)
downloadfirefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz
firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html')
-rw-r--r--testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html68
1 files changed, 68 insertions, 0 deletions
diff --git a/testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html b/testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html
new file mode 100644
index 0000000000..40f1b01f66
--- /dev/null
+++ b/testing/web-platform/tests/shadow-dom/focus/focus-shadowhost-display-none.html
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+#host:focus { display: none; }
+</style>
+<div id='sandbox'></div>
+<script>
+'use strict';
+
+// Check if shadow host with display:none CSS rule for :focus works. crbug.com/482830
+
+var host;
+var root;
+var input;
+
+function setupShadowDOM(delegatesFocus) {
+ sandbox.innerHTML = '';
+ host = sandbox.appendChild(document.createElement('div'));
+ host.id = 'host';
+
+ root = host.attachShadow({mode: 'open', delegatesFocus: delegatesFocus});
+ input = document.createElement('input');
+ root.appendChild(input);
+
+ host.tabIndex = 0;
+}
+
+promise_test(() => {
+ setupShadowDOM(false);
+ return new Promise(
+ function(resolve) {
+ host.focus();
+ assert_equals(window.getComputedStyle(host).display, 'none');
+ assert_equals(document.activeElement, host);
+ assert_equals(root.activeElement, null);
+
+ function onBlur() {
+ assert_equals(window.getComputedStyle(host).display, 'block');
+ assert_equals(document.activeElement, document.body);
+ assert_equals(root.activeElement, null);
+ host.removeEventListener('blur', onBlur);
+ resolve();
+ }
+ host.addEventListener('blur', onBlur);
+ });
+}, 'when shadow host itself is focused, it should match display:none, lose focus then becomes display:block again.');
+
+promise_test(() => {
+ setupShadowDOM(true);
+ return new Promise(
+ function(resolve) {
+ input.focus();
+ assert_equals(window.getComputedStyle(host).display, 'none');
+ assert_equals(document.activeElement, host);
+ assert_equals(root.activeElement, input);
+
+ function onBlur() {
+ assert_equals(window.getComputedStyle(host).display, 'block');
+ assert_equals(document.activeElement, document.body);
+ assert_equals(root.activeElement, null);
+ input.removeEventListener('blur', onBlur);
+ resolve();
+ }
+ input.addEventListener('blur', onBlur);
+ });
+}, 'when shadow host with delegatesFocus=true has focused element inside the shadow, it should also match display:none, then lose focus and become display:block again.');
+</script>