| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <script src="../../../resources/js-test.js"></script> | 2 <script src="../../../resources/js-test.js"></script> |
| 3 <script src="resources/shadow-dom.js"></script> | 3 <script src="resources/shadow-dom.js"></script> |
| 4 <style> | 4 <style> |
| 5 div { background-color: white; } | 5 div { background-color: white; } |
| 6 div:focus { background-color: green; } | 6 div:focus { background-color: green; } |
| 7 </style> | 7 </style> |
| 8 <body> | 8 <body> |
| 9 <div id="sandbox"></div> | 9 <div id="sandbox"></div> |
| 10 </body> | 10 </body> |
| 11 <script> | 11 <script> |
| 12 description('Test if :focus matching state of shadow host is properly handled in
case of DOM mutation.'); | 12 description('Test if :focus matching state of shadow host is properly handled in
case of DOM mutation.'); |
| 13 | 13 |
| 14 function backgroundColorOf(selector) { | |
| 15 return window.getComputedStyle(getNodeInTreeOfTrees(selector)).backgroundCol
or; | |
| 16 } | |
| 17 | |
| 18 function backgroundColorShouldBe(selector, expected) { | |
| 19 shouldBeEqualToString('backgroundColorOf(\'' + selector + '\')', expected); | |
| 20 } | |
| 21 | |
| 22 function buildTree(parent, delegatesFocus) | 14 function buildTree(parent, delegatesFocus) |
| 23 { | 15 { |
| 24 parent.innerHTML = ''; | 16 parent.innerHTML = ''; |
| 25 parent.appendChild( | 17 parent.appendChild( |
| 26 createDOM('div', {id: 'host'}, | 18 createDOM('div', {id: 'host'}, |
| 27 createShadowRoot({delegatesFocus: delegatesFocus}, | 19 createShadowRoot({delegatesFocus: delegatesFocus}, |
| 28 createDOM('input', {id: 'input'})), | 20 createDOM('input', {id: 'input'})), |
| 29 createDOM('div', {id: 'dest'}))); | 21 createDOM('div', {id: 'dest'}))); |
| 30 | 22 |
| 31 parent.offsetTop; | 23 parent.offsetTop; |
| (...skipping 25 matching lines...) Expand all Loading... |
| 57 backgroundColorShouldBe('host', 'rgb(255, 255, 255)'); | 49 backgroundColorShouldBe('host', 'rgb(255, 255, 255)'); |
| 58 input.focus(); | 50 input.focus(); |
| 59 backgroundColorShouldBe('host', 'rgb(0, 128, 0)'); | 51 backgroundColorShouldBe('host', 'rgb(0, 128, 0)'); |
| 60 dest.appendChild(input); | 52 dest.appendChild(input); |
| 61 backgroundColorShouldBe('host', 'rgb(255, 255, 255)'); | 53 backgroundColorShouldBe('host', 'rgb(255, 255, 255)'); |
| 62 input.focus(); | 54 input.focus(); |
| 63 host.shadowRoot.appendChild(input); | 55 host.shadowRoot.appendChild(input); |
| 64 // appendChild() will blur the focus from input element, thus input is no longer
focused. | 56 // appendChild() will blur the focus from input element, thus input is no longer
focused. |
| 65 backgroundColorShouldBe('host', 'rgb(255, 255, 255)'); | 57 backgroundColorShouldBe('host', 'rgb(255, 255, 255)'); |
| 66 </script> | 58 </script> |
| OLD | NEW |