src/third_party/WebKit/LayoutTests/fast/dom/shadow/content-pseudo-element-in-inert-shadow.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="resources/shadow-dom.js"></script>
   5 <script src="../../../resources/js-test.js"></script>
   6 </head>
   7 <body>
   8 <div id="sandbox"></div>
   9 <script>
  10 var borderColor;
  11
  12 function borderColorOf(node)
  13 {
  14     return document.defaultView.getComputedStyle(node, null).getPropertyValue('border-color');
  15 }
  16
  17 function borderColorShouldNotBe(selector, color)
  18 {
  19     var text = 'borderColorOf(getNodeInTreeOfTrees("' + selector + '"))';
  20     var unevaledString = '"' + color.replace(/\\/g, "\\\\").replace(/"/g, "\"") + '"';
  21     shouldNotBe(text, unevaledString);
  22 }
  23
  24 function cleanUp()
  25 {
  26     document.getElementById('sandbox').innerHTML = '';
  27 }
  28
  29 description('crbug.com/341372: Test for rules with ::content declared in inert shadow trees');
  30
  31 var sandbox = document.getElementById('sandbox');
  32 sandbox.appendChild(
  33     createDOM('div', {'id': 'host'},
  34         createShadowRoot(
  35             createDOM('style', {},
  36                 document.createTextNode('content::content div { border: 1px solid red; }'),
  37             createDOM('div', {},
  38                 document.createTextNode('inert')))),
  39         createShadowRoot(
  40             createDOM('content')),
  41         createDOM('div', {'id': 'target'},
  42             document.createTextNode('no border'))));
  43
  44 borderColorShouldNotBe('target', 'rgb(255, 0, 0)');
  45
  46 cleanUp();
  47 </script>
  48 </body>
  49 </html>