OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../../../resources/testharness.js"></script> |
| 3 <script src="../../../resources/testharnessreport.js"></script> |
| 4 <div id="host1"></div> |
| 5 <div id="host2"></div> |
| 6 <div id="host3"></div> |
| 7 <script> |
| 8 var root1 = host1.createShadowRoot(); |
| 9 var root2 = host2.createShadowRoot(); |
| 10 var root3 = host3.createShadowRoot(); |
| 11 |
| 12 root1.innerHTML = `<style>#t1 + div + div + #r1 {background-color:green}</st
yle> |
| 13 <div id="t1"></div> |
| 14 <div id="i1"></div> |
| 15 <div id="r1"></div> |
| 16 <div></div>`; |
| 17 |
| 18 root2.innerHTML = `<style>#t2 + div + div + #r2 {background-color:green}</st
yle> |
| 19 <div id="i2"></div> |
| 20 <div></div> |
| 21 <div id="r2"></div> |
| 22 <div></div>`; |
| 23 |
| 24 root3.innerHTML = `<style>#t3 + div + div + #r3 {background-color:green}</st
yle> |
| 25 <div id="t3"></div> |
| 26 <div></div> |
| 27 <div id="d3"></div> |
| 28 <div></div> |
| 29 <div id="r3"></div> |
| 30 <div></div>`; |
| 31 |
| 32 document.body.offsetTop; |
| 33 |
| 34 test(function() { |
| 35 assert_true(!!window.internals, "This test only works with internals exp
osed present"); |
| 36 }, "internals are exposed"); |
| 37 |
| 38 test(function() { |
| 39 var i1 = root1.querySelector('#i1'); |
| 40 var r1 = root1.querySelector('#r1'); |
| 41 assert_equals(getComputedStyle(r1).backgroundColor, "rgba(0, 0, 0, 0)",
"Background color should initially be transparent"); |
| 42 |
| 43 i1.parentNode.insertBefore(document.createElement('div'), i1); |
| 44 assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2, "
Inserted div plus #r1 recalculated"); |
| 45 assert_equals(getComputedStyle(r1).backgroundColor, "rgb(0, 128, 0)", "B
ackground color is green after class change"); |
| 46 }, "Insert between siblings"); |
| 47 |
| 48 test(function() { |
| 49 var i2 = root2.querySelector('#i2'); |
| 50 var r2 = root2.querySelector('#r2'); |
| 51 assert_equals(getComputedStyle(r2).backgroundColor, "rgba(0, 0, 0, 0)",
"Background color should initially be transparent"); |
| 52 |
| 53 var t2 = document.createElement('div'); |
| 54 t2.id = 't2'; |
| 55 i2.parentNode.insertBefore(t2, i2); |
| 56 assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2, "
Inserted div plus #r2 recalculated"); |
| 57 assert_equals(getComputedStyle(r2).backgroundColor, "rgb(0, 128, 0)", "B
ackground color is green after class change"); |
| 58 }, "Insert before siblings"); |
| 59 |
| 60 test(function() { |
| 61 var d3 = root3.querySelector('#d3'); |
| 62 var r3 = root3.querySelector('#r3'); |
| 63 |
| 64 d3.parentNode.removeChild(d3); |
| 65 assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "
#r3 recalculated"); |
| 66 assert_equals(getComputedStyle(r3).backgroundColor, "rgb(0, 128, 0)", "B
ackground color is green after class change"); |
| 67 }, "Remove between siblings"); |
| 68 |
| 69 </script> |
OLD | NEW |