| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| </head> |
| <body> |
| |
| <div id="shadow-host"> |
| <button slot="slot-1" id="button-1">Button 1 (inert)</button> |
| <button slot="slot-2" id="button-2">Button 2 (not inert)</button> |
| </div> |
| <script> |
| const shadowHost = document.getElementById('shadow-host'); |
| const shadowRoot = shadowHost.attachShadow({ mode: 'open' }); |
| const inertDiv = document.createElement('div'); |
| inertDiv.inert = true; |
| shadowRoot.appendChild(inertDiv); |
| const slot1 = document.createElement('slot'); |
| slot1.name = 'slot-1'; |
| inertDiv.appendChild(slot1); |
| const slot2 = document.createElement('slot'); |
| slot2.name = 'slot-2'; |
| shadowRoot.appendChild(slot2); |
| |
| function testCanFocus(selector, canFocus) { |
| const element = document.querySelector(selector); |
| let focusedElement = null; |
| element.addEventListener('focus', function() { focusedElement = element; }, false); |
| element.focus(); |
| if (canFocus) |
| assert_true(focusedElement === element); |
| else |
| assert_false(focusedElement === element); |
| } |
| |
| testCanFocus('#button-1', false); |
| testCanFocus('#button-2', true); |
| done(); |
| </script> |
| </body> |
| </html> |