content-visibility-054.html (1065B)
1 <!doctype HTML> 2 <html> 3 <meta charset="utf8"> 4 <title>Display Locking: focus on styled element</title> 5 <link rel="author" title="Rakina Zata Amni" href="mailto:rakina@chromium.org"> 6 <link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility"> 7 <meta name="assert" content="focus does not target display-none but hidden elements"> 8 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 12 <div id="container" style="content-visibility: auto"> 13 <div id="focusable1" tabIndex="0"> 14 focusable thing 15 </div> 16 <div id="displayNoneParent"> 17 <div id="focusable2" tabIndex="0"> 18 focusable thing 19 </div> 20 </div> 21 </div> 22 23 <script> 24 test(() => { 25 focusable1.style.display = "none"; 26 focusable1.focus(); 27 assert_not_equals(document.activeElement, focusable1); 28 29 displayNoneParent.style.display = "none"; 30 focusable2.focus(); 31 assert_not_equals(document.activeElement, focusable2); 32 }, "Trying to focus on an element in a hidden subtree with display none will not work"); 33 </script> 34 </html>