| OLD | NEW | 
| (Empty) |  | 
 |    1 <!DOCTYPE html> | 
 |    2 <!--  | 
 |    3 Distributed under both the W3C Test Suite License [1] and the W3C | 
 |    4 3-clause BSD License [2]. To contribute to a W3C Test Suite, see the | 
 |    5 policies and contribution forms [3]. | 
 |    6  | 
 |    7 [1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license | 
 |    8 [2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license | 
 |    9 [3] http://www.w3.org/2004/10/27-testcases | 
 |   10  --> | 
 |   11 <html> | 
 |   12 <head> | 
 |   13 <title>Shadow DOM Test: A_10_04_03</title> | 
 |   14 <link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> | 
 |   15 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#content
     -element"> | 
 |   16 <meta name="assert" content="The content HTML element: invalid select attribute"
     > | 
 |   17 <script src="../../../../../resources/testharness.js"></script> | 
 |   18 <script src="../../../../../resources/testharnessreport.js"></script> | 
 |   19 <script src="../../testcommon.js"></script> | 
 |   20 <link rel="stylesheet" href="../../../../../resources/testharness.css"> | 
 |   21 </head> | 
 |   22 <body> | 
 |   23 <div id="log"></div> | 
 |   24 <script> | 
 |   25 test(unit(function (ctx) { | 
 |   26  | 
 |   27     var d = newRenderedHTMLDocument(ctx); | 
 |   28  | 
 |   29     d.body.innerHTML = | 
 |   30         '<ul class="cls">' + | 
 |   31             '<li id="li1" class="shadow">1</li>' + | 
 |   32             '<li id="li2" class="shadow2">2</li>' + | 
 |   33             '<li id="li3" class="shadow">3</li>' + | 
 |   34             '<li id="li4">4</li>' + | 
 |   35             '<li id="li5" class="shadow">5</li>' + | 
 |   36             '<li id="li6" class="shadow2">6</li>' + | 
 |   37         '</ul>'; | 
 |   38  | 
 |   39     var host = d.querySelector('.cls'); | 
 |   40     //Shadow root to play with | 
 |   41     var s = host.createShadowRoot(); | 
 |   42  | 
 |   43     var div = d.createElement('div'); | 
 |   44     div.innerHTML = '' + | 
 |   45         '<ul><content select="&@()"><span id="spandex">This is fallback content<
     /span></content></ul>'; | 
 |   46     s.appendChild(div); | 
 |   47  | 
 |   48     assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content sho
     uld be rendered'); | 
 |   49  | 
 |   50     assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Element should
      not be rendered'); | 
 |   51     assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Element should
      not be rendered'); | 
 |   52     assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Element should
      not be rendered'); | 
 |   53     assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Element should
      not be rendered'); | 
 |   54     assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Element should
      not be rendered'); | 
 |   55     assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 6: Element should
      not be rendered'); | 
 |   56  | 
 |   57 }), 'A_10_04_03_T01'); | 
 |   58  | 
 |   59  | 
 |   60 test(unit(function (ctx) { | 
 |   61  | 
 |   62 var d = newRenderedHTMLDocument(ctx); | 
 |   63  | 
 |   64     d.body.innerHTML = | 
 |   65         '<ul class="cls">' + | 
 |   66             '<li id="li1" class="shadow">1</li>' + | 
 |   67             '<li id="li2" class="shadow2">2</li>' + | 
 |   68             '<li id="li3" class="shadow">3</li>' + | 
 |   69             '<li id="li4">4</li>' + | 
 |   70             '<li id="li5" class="shadow">5</li>' + | 
 |   71             '<li id="li6" class="shadow2">6</li>' + | 
 |   72         '</ul>'; | 
 |   73  | 
 |   74     var host = d.querySelector('.cls'); | 
 |   75     //Shadow root to play with | 
 |   76     var s = host.createShadowRoot(); | 
 |   77  | 
 |   78     var div = d.createElement('div'); | 
 |   79     div.innerHTML = '' + | 
 |   80         '<ul><content select=".shadow, &@()"><span id="spandex">This is fallback
      content</span></content></ul>'; | 
 |   81     s.appendChild(div); | 
 |   82  | 
 |   83     assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content sho
     uld be rendered'); | 
 |   84  | 
 |   85     assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Element should
      not be rendered'); | 
 |   86     assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Element should
      not be rendered'); | 
 |   87     assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Element should
      not be rendered'); | 
 |   88     assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Element should
      not be rendered'); | 
 |   89     assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Element should
      not be rendered'); | 
 |   90     assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 6: Element should
      not be rendered'); | 
 |   91  | 
 |   92 }), 'A_10_04_03_T02'); | 
 |   93  | 
 |   94  | 
 |   95 test(unit(function (ctx) { | 
 |   96  | 
 |   97     var d = newRenderedHTMLDocument(ctx); | 
 |   98  | 
 |   99     d.body.innerHTML = | 
 |  100         '<ul class="cls">' + | 
 |  101             '<li id="li1" class="shadow">1</li>' + | 
 |  102             '<li id="li2" class="shadow2">2</li>' + | 
 |  103             '<li id="li3" class="shadow">3</li>' + | 
 |  104             '<li id="li4">4</li>' + | 
 |  105             '<li id="li5" class="shadow">5</li>' + | 
 |  106             '<li id="li6" class="shadow2">6</li>' + | 
 |  107         '</ul>'; | 
 |  108  | 
 |  109     var host = d.querySelector('.cls'); | 
 |  110     //Shadow root to play with | 
 |  111     var s = host.createShadowRoot(); | 
 |  112  | 
 |  113     var div = d.createElement('div'); | 
 |  114     div.innerHTML = '' + | 
 |  115         '<ul><content select=".shadow, &@(), #li4"><span id="spandex">This is fa
     llback content</span></content></ul>'; | 
 |  116     s.appendChild(div); | 
 |  117  | 
 |  118     assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content sho
     uld be rendered'); | 
 |  119  | 
 |  120     assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Element should
      not be rendered'); | 
 |  121     assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Element should
      not be rendered'); | 
 |  122     assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Element should
      not be rendered'); | 
 |  123     assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Element should
      not be rendered'); | 
 |  124     assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Element should
      not be rendered'); | 
 |  125     assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 6: Element should
      not be rendered'); | 
 |  126  | 
 |  127 }), 'A_10_04_03_T03'); | 
 |  128 </script> | 
 |  129 </body> | 
 |  130 </html> | 
| OLD | NEW |