| OLD | NEW |
| 1 Content-Type: text/plain | 1 Content-Type: text/plain |
| 2 <html><head><style shadowcssshim="">template { display: none; }</style> | 2 <html><head> |
| 3 <title>Simple Web Components Example</title> | 3 <title>Simple Web Components Example</title> |
| 4 | 4 |
| 5 <script src="../../packages/polymer/testing/testing.js"></script> | 5 <script src="packages/polymer/testing/testing.js"></script> |
| 6 <style>template, | 6 <style>template, |
| 7 thead[template], | 7 thead[template], |
| 8 tbody[template], | 8 tbody[template], |
| 9 tfoot[template], | 9 tfoot[template], |
| 10 th[template], | 10 th[template], |
| 11 tr[template], | 11 tr[template], |
| 12 td[template], | 12 td[template], |
| 13 caption[template], | 13 caption[template], |
| 14 colgroup[template], | 14 colgroup[template], |
| 15 col[template], | 15 col[template], |
| 16 option[template] { | 16 option[template] { |
| 17 display: none; | 17 display: none; |
| 18 }</style></head> | 18 }</style></head> |
| 19 <body><polymer-element name="x-news" extends="ul"> | 19 <body><script src="packages/shadow_dom/shadow_dom.min.js"></script> |
| 20 <script src="packages/browser/interop.js"></script> |
| 21 <polymer-element name="x-news" extends="ul"> |
| 20 <template> | 22 <template> |
| 21 <style scoped=""> | 23 <style scoped=""> |
| 22 div.breaking { | 24 div.breaking { |
| 23 color: Red; | 25 color: Red; |
| 24 font-size: 20px; | 26 font-size: 20px; |
| 25 border: 1px dashed Purple; | 27 border: 1px dashed Purple; |
| 26 } | 28 } |
| 27 div.other { | 29 div.other { |
| 28 padding: 2px 0 0 0; | 30 padding: 2px 0 0 0; |
| 29 border: 1px solid Cyan; | 31 border: 1px solid Cyan; |
| 30 } | 32 } |
| 31 </style> | 33 </style> |
| 32 <div class="breaking"> | 34 <div class="breaking"> |
| 33 <h2>Breaking Stories</h2> | 35 <h2>Breaking Stories</h2> |
| 34 <ul> | 36 <ul> |
| 35 <content select=".breaking"></content> | 37 <content select=".breaking"></content> |
| 36 </ul> | 38 </ul> |
| 37 </div> | 39 </div> |
| 38 <div class="other"> | 40 <div class="other"> |
| 39 <h2>Other News</h2> | 41 <h2>Other News</h2> |
| 40 <ul> | 42 <ul> |
| 41 <content></content> | 43 <content></content> |
| 42 </ul> | 44 </ul> |
| 43 </div> | 45 </div> |
| 44 </template> | 46 </template> |
| 45 | 47 |
| 46 </polymer-element> | 48 </polymer-element> |
| 47 | |
| 48 <h1>Simple Web Components Example</h1> | 49 <h1>Simple Web Components Example</h1> |
| 49 <ul is="x-news"><shadow-root> | 50 <ul is="x-news"><shadow-root> |
| 50 <style scoped=""> | 51 <style scoped="">/* style hidden by testing.js */</style> |
| 51 div.breaking { | |
| 52 color: Red; | |
| 53 font-size: 20px; | |
| 54 border: 1px dashed Purple; | |
| 55 } | |
| 56 div.other { | |
| 57 padding: 2px 0 0 0; | |
| 58 border: 1px solid Cyan; | |
| 59 } | |
| 60 </style> | |
| 61 <div class="breaking"> | 52 <div class="breaking"> |
| 62 <h2>Breaking Stories</h2> | 53 <h2>Breaking Stories</h2> |
| 63 <ul> | 54 <ul> |
| 64 <content select=".breaking"></content> | 55 <content select=".breaking"></content> |
| 65 </ul> | 56 </ul> |
| 66 </div> | 57 </div> |
| 67 <div class="other"> | 58 <div class="other"> |
| 68 <h2>Other News</h2> | 59 <h2>Other News</h2> |
| 69 <ul> | 60 <ul> |
| 70 <content></content> | 61 <content></content> |
| 71 </ul> | 62 </ul> |
| 72 </div> | 63 </div> |
| 73 </shadow-root> | 64 </shadow-root> |
| 74 <li><a href="//example.com/stories/1">A story</a></li> | 65 <li><a href="//example.com/stories/1">A story</a></li> |
| 75 <li><a href="//example.com/stories/2">Another story</a></li> | 66 <li><a href="//example.com/stories/2">Another story</a></li> |
| 76 <li class="breaking"><a href="//example.com/stories/3">Also a story</a></li> | 67 <li class="breaking"><a href="//example.com/stories/3">Also a story</a></li> |
| 77 <li><a href="//example.com/stories/4">Yet another story</a></li> | 68 <li><a href="//example.com/stories/4">Yet another story</a></li> |
| 78 <li><a href="//example.com/stories/4">Awesome story</a></li> | 69 <li><a href="//example.com/stories/4">Awesome story</a></li> |
| 79 <li class="breaking"><a href="//example.com/stories/5">Horrible story</a></l
i> | 70 <li class="breaking"><a href="//example.com/stories/5">Horrible story</a></l
i> |
| 80 </ul> | 71 </ul> |
| 81 | 72 |
| 82 | 73 |
| 83 | 74 |
| 84 <script type="text/javascript" src="packages/shadow_dom/shadow_dom.debug.js"></s
cript> | |
| 85 <script type="text/javascript" src="packages/browser/interop.js"></script> | |
| 86 <script type="application/dart" src="news_index_test.html_bootstrap.dart"></scri
pt></body></html> | 75 <script type="application/dart" src="news_index_test.html_bootstrap.dart"></scri
pt></body></html> |
| OLD | NEW |