content-visibility-047.html (1426B)
1 <!doctype HTML> 2 <meta charset="utf8"> 3 <title>Content Visibility: tab order navigation ignores hidden subtrees</title> 4 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> 5 <link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility"> 6 <meta name="assert" content="tab order navigation ignores hidden subtrees."> 7 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src="/resources/testdriver.js"></script> 11 <script src="/resources/testdriver-actions.js"></script> 12 <script src="/resources/testdriver-vendor.js"></script> 13 14 <style> 15 .hidden { 16 content-visibility: hidden; 17 } 18 </style> 19 20 <input id=one type=text></input> 21 <div class=hidden> 22 <input id=two type=text></input> 23 <input id=three type=text></input> 24 <input id=four type=text></input> 25 </div> 26 <input id=five type=text></input> 27 28 <script> 29 async_test((t) => { 30 const tab = "\uE004"; 31 32 async function runTest() { 33 await test_driver.send_keys(document.body, tab); 34 t.step(() => { 35 assert_equals(document.activeElement, document.getElementById("one")); 36 }); 37 38 await test_driver.send_keys(document.body, tab); 39 t.step(() => { 40 assert_equals(document.activeElement, document.getElementById("five")); 41 }); 42 43 t.done(); 44 } 45 46 window.onload = () => { requestAnimationFrame(runTest); }; 47 }, "Tab order navigation skips hidden subtrees"); 48 </script>