| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <script src="../../../resources/js-test.js"></script> | 4 <script src="../../../resources/js-test.js"></script> |
| 5 <script src="resources/shadow-dom.js"></script> | 5 <script src="resources/shadow-dom.js"></script> |
| 6 </head> | 6 </head> |
| 7 <body> | 7 <body> |
| 8 <p>This tests that pressing Tab key should traverse into iframe and shadow tree,
and pressing Shift-Tab should reverse the order.</p> | 8 <p>This tests that pressing Tab key should traverse into iframe and shadow tree,
and pressing Shift-Tab should reverse the order.</p> |
| 9 <pre id="console"></pre> | 9 <pre id="console"></pre> |
| 10 <script> | 10 <script> |
| 11 function createTextInputElement(doc, id, tabIndex) { | 11 function createTextInputElement(doc, id, tabIndex) { |
| 12 var input = doc.createElement('input'); | 12 var input = doc.createElement('input'); |
| 13 input.type = 'text'; | 13 input.type = 'text'; |
| 14 input.id = id; | 14 input.id = id; |
| 15 input.tabIndex = tabIndex; | 15 input.tabIndex = tabIndex; |
| 16 return input; | 16 return input; |
| 17 } | 17 } |
| 18 | 18 |
| 19 if (window.testRunner) { | 19 var doc = document; |
| 20 testRunner.dumpAsText(); | |
| 21 var doc = document; | |
| 22 | 20 |
| 23 doc.body.appendChild(createTextInputElement(doc, 'input-01', 1)); | 21 doc.body.appendChild(createTextInputElement(doc, 'input-01', 1)); |
| 24 doc.body.appendChild(createTextInputElement(doc, 'input-02', 0)); | 22 doc.body.appendChild(createTextInputElement(doc, 'input-02', 0)); |
| 23 |
| 24 function addShadowHost(doc) { |
| 25 var shadowHost = doc.createElement('p'); |
| 26 shadowHost.id = 'host-01'; |
| 27 shadowHost.tabIndex = -1; |
| 28 var shadow = shadowHost.createShadowRoot(); |
| 29 doc.body.appendChild(shadowHost); |
| 30 shadow.appendChild(createTextInputElement(doc, 'input-03', 0)); |
| 31 } |
| 32 addShadowHost(doc); |
| 33 |
| 34 doc.body.appendChild(createTextInputElement(doc, 'input-04', 0)); |
| 35 |
| 36 function addIframe(doc) { |
| 37 var iframe = doc.createElement('iframe'); |
| 38 iframe.id = 'iframe'; |
| 39 doc.body.appendChild(iframe); |
| 40 doc = iframe.contentDocument; |
| 41 |
| 42 doc.body.appendChild(createTextInputElement(doc, 'input-05', 0)); |
| 43 doc.body.appendChild(createTextInputElement(doc, 'input-06', 1)); |
| 44 doc.body.appendChild(createTextInputElement(doc, 'input-07', -1)); |
| 25 | 45 |
| 26 function addShadowHost(doc) { | 46 function addShadowHost(doc) { |
| 27 var shadowHost = doc.createElement('p'); | 47 var shadowHost = doc.createElement('p'); |
| 28 shadowHost.id = 'host-01'; | 48 shadowHost.id = 'host-02'; |
| 29 shadowHost.tabIndex = -1; | 49 shadowHost.tabIndex = 1; |
| 30 var shadow = shadowHost.createShadowRoot(); | 50 var shadow = shadowHost.createShadowRoot(); |
| 31 doc.body.appendChild(shadowHost); | 51 doc.body.appendChild(shadowHost); |
| 32 shadow.appendChild(createTextInputElement(doc, 'input-03', 0)); | 52 |
| 53 shadow.appendChild(createTextInputElement(doc, 'input-08', 0)); |
| 54 shadow.appendChild(createTextInputElement(doc, 'input-09', 1)); |
| 55 shadow.appendChild(createTextInputElement(doc, 'input-10', -1)); |
| 33 } | 56 } |
| 34 addShadowHost(doc); | 57 addShadowHost(doc); |
| 35 | 58 |
| 36 doc.body.appendChild(createTextInputElement(doc, 'input-04', 0)); | 59 doc.body.appendChild(createTextInputElement(doc, 'input-11', 2)); |
| 60 doc.body.appendChild(createTextInputElement(doc, 'input-12', 1)); |
| 61 } |
| 62 addIframe(doc); |
| 37 | 63 |
| 38 function addIframe(doc) { | 64 doc.body.appendChild(createTextInputElement(doc, 'input-13', 1)); |
| 39 var iframe = doc.createElement('iframe'); | 65 doc.body.appendChild(createTextInputElement(doc, 'input-14', 0)); |
| 40 iframe.id = 'iframe'; | 66 doc.body.appendChild(createTextInputElement(doc, 'input-15', 2)); |
| 41 doc.body.appendChild(iframe); | |
| 42 doc = iframe.contentDocument; | |
| 43 | 67 |
| 44 doc.body.appendChild(createTextInputElement(doc, 'input-05', 0)); | 68 testFocusNavigationForward([ |
| 45 doc.body.appendChild(createTextInputElement(doc, 'input-06', 1)); | 69 'input-01', |
| 46 doc.body.appendChild(createTextInputElement(doc, 'input-07', -1)); | 70 'input-13', |
| 71 'input-15', |
| 72 'input-02', |
| 73 'host-01/input-03', |
| 74 'input-04', |
| 75 'iframe/input-06', |
| 76 'iframe/host-02', |
| 77 'iframe/host-02/input-09', |
| 78 'iframe/host-02/input-08', |
| 79 'iframe/input-12', |
| 80 'iframe/input-11', |
| 81 'iframe/input-05', |
| 82 'input-14', |
| 83 ]); |
| 47 | 84 |
| 48 function addShadowHost(doc) { | 85 testFocusNavigationBackward([ |
| 49 var shadowHost = doc.createElement('p'); | 86 'input-14', |
| 50 shadowHost.id = 'host-02'; | 87 'iframe/input-05', |
| 51 shadowHost.tabIndex = 1; | 88 'iframe/input-11', |
| 52 var shadow = shadowHost.createShadowRoot(); | 89 'iframe/input-12', |
| 53 doc.body.appendChild(shadowHost); | 90 'iframe/host-02/input-08', |
| 91 'iframe/host-02/input-09', |
| 92 'iframe/host-02', |
| 93 'iframe/input-06', |
| 94 'input-04', |
| 95 'host-01/input-03', |
| 96 'input-02', |
| 97 'input-15', |
| 98 'input-13', |
| 99 'input-01', |
| 100 ]); |
| 54 | 101 |
| 55 shadow.appendChild(createTextInputElement(doc, 'input-08', 0)); | 102 debug('\nTest finished.'); |
| 56 shadow.appendChild(createTextInputElement(doc, 'input-09', 1)); | |
| 57 shadow.appendChild(createTextInputElement(doc, 'input-10', -1)); | |
| 58 } | |
| 59 addShadowHost(doc); | |
| 60 | |
| 61 doc.body.appendChild(createTextInputElement(doc, 'input-11', 2)); | |
| 62 doc.body.appendChild(createTextInputElement(doc, 'input-12', 1)); | |
| 63 } | |
| 64 addIframe(doc); | |
| 65 | |
| 66 doc.body.appendChild(createTextInputElement(doc, 'input-13', 1)); | |
| 67 doc.body.appendChild(createTextInputElement(doc, 'input-14', 0)); | |
| 68 doc.body.appendChild(createTextInputElement(doc, 'input-15', 2)); | |
| 69 | |
| 70 testFocusNavigationForward([ | |
| 71 'input-01', | |
| 72 'input-13', | |
| 73 'input-15', | |
| 74 'input-02', | |
| 75 'host-01/input-03', | |
| 76 'input-04', | |
| 77 'iframe/input-06', | |
| 78 'iframe/host-02', | |
| 79 'iframe/host-02/input-09', | |
| 80 'iframe/host-02/input-08', | |
| 81 'iframe/input-12', | |
| 82 'iframe/input-11', | |
| 83 'iframe/input-05', | |
| 84 'input-14', | |
| 85 ]); | |
| 86 | |
| 87 testFocusNavigationBackward([ | |
| 88 'input-14', | |
| 89 'iframe/input-05', | |
| 90 'iframe/input-11', | |
| 91 'iframe/input-12', | |
| 92 'iframe/host-02/input-08', | |
| 93 'iframe/host-02/input-09', | |
| 94 'iframe/host-02', | |
| 95 'iframe/input-06', | |
| 96 'input-04', | |
| 97 'host-01/input-03', | |
| 98 'input-02', | |
| 99 'input-15', | |
| 100 'input-13', | |
| 101 'input-01', | |
| 102 ]); | |
| 103 | |
| 104 debug('\nTest finished.'); | |
| 105 } | |
| 106 </script> | 103 </script> |
| 107 </body> | 104 </body> |
| 108 </html> | 105 </html> |
| OLD | NEW |