src/third_party/WebKit/LayoutTests/fast/dom/shadow/stylesheets-order-in-shadow-dom.html

   1 <!DOCTYPE html>
   2 <script src="resources/shadow-dom.js"></script>
   3 <script src="../../../resources/js-test.js"></script>
   4 <style>
   5 .hello, div::shadow .hello {
   6     color: yellowgreen;
   7 }
   8 .world, div::shadow .world {
   9     color: red;
  10 }
  11 </style>
  12 <style>
  13 .world, div::shadow .world {
  14     color: yellow;
  15 }
  16 </style>
  17 <body></body>
  18 <script>
  19 description('crbug.com/396585: ShadowDom CSS doesn\'t merge style');
  20
  21 document.body.appendChild(
  22     createDOM('div', {'id': 'host'},
  23         createShadowRoot(
  24             createDOM('span', {'class': 'hello' },
  25                 document.createTextNode("Hello, ")),
  26             createDOM('span', {'id': 'world', 'class': 'hello world' },
  27                 document.createTextNode("World")))));
  28
  29 shouldBe('window.getComputedStyle(getNodeInTreeOfTrees("host/world")).color', '"rgb(255, 255, 0)"');
  30 </script>