| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../../../resources/testharness.js"></script> |
| 3 <script src="../../../resources/testharnessreport.js"></script> |
| 4 <style> |
| 5 #parent1 { |
| 6 --mixin: { |
| 7 border: 5px solid black; |
| 8 }; |
| 9 } |
| 10 #parent2 { |
| 11 --mixin: { |
| 12 border: 10px dotted orange; |
| 13 }; |
| 14 } |
| 15 |
| 16 #child1, #child2, #child3 { |
| 17 @apply --mixin; |
| 18 } |
| 19 </style> |
| 20 <div id="parent1"> |
| 21 <div id="child1">X</div> |
| 22 </div> |
| 23 <div id="parent2"> |
| 24 <div id="child2">X</div> |
| 25 </div> |
| 26 <div id="parent3"> |
| 27 <div id="child3">X</div> |
| 28 </div> |
| 29 <script> |
| 30 test(function() { |
| 31 assert_equals(getComputedStyle(child1).borderWidth, '5px'); |
| 32 assert_equals(getComputedStyle(child2).borderWidth, '10px'); |
| 33 assert_equals(getComputedStyle(child3).borderWidth, '0px'); |
| 34 }, "Elements style identically aside from an @apply'd variable with different in
herited values are computed properly"); |
| 35 </script> |
| OLD | NEW |