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: Upper-boundary encapsulation: document's DOM tree access
ors</title> |
| 14 <link rel="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"
> |
| 15 <link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> |
| 16 <link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> |
| 17 <link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> |
| 18 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-b
oundary-encapsulation"> |
| 19 <meta name="assert" content="Upper-boundary encapsulation: The shadow nodes and
named shadow elements are not accessible using shadow host's document DOM tree a
ccessors."> |
| 20 <script src="../../../../../resources/testharness.js"></script> |
| 21 <script src="../../../../../resources/testharnessreport.js"></script> |
| 22 <script src="../../testcommon.js"></script> |
| 23 <link rel="stylesheet" href="../../../../../resources/testharness.css"> |
| 24 </head> |
| 25 <body> |
| 26 <div id="log"></div> |
| 27 <script> |
| 28 // A document's "DOM tree accessors" include: |
| 29 // (document.)head, title, body, images, embeds, plugins, links, forms, |
| 30 // scripts, getElementsByName(), cssElementMap, and currentScript |
| 31 // |
| 32 // Of these, it is unclear how document.cssElementMap can be tested. |
| 33 // Except for it, there is a test corresponding to each accessor. |
| 34 // |
| 35 // Additionally, there are obsolete accessors |
| 36 // <http://www.whatwg.org/specs/web-apps/current-work/multipage/obsolete.html#ot
her-elements,-attributes-and-apis>: |
| 37 // (document.)anchors, applets, and all. |
| 38 // |
| 39 // and some accessors defined in the DOM specification (formerly known as |
| 40 // "DOM Core") <http://dom.spec.whatwg.org/#interface-document>: |
| 41 // (document.)documentElement, getElementsByTagName(), |
| 42 // getElementsByTagNameNS(), getElementsByClassName(), and getElementById(). |
| 43 // |
| 44 // As it seems reasonable to have tests for these accessors, this file also |
| 45 // includes tests for them, except for document.documentElement which is |
| 46 // unclear whether we can test; the distribution process of Shadow DOM does not |
| 47 // alter the host element, so the document element (e.g. <html>) cannot be |
| 48 // replaced with an element in a shadow tree. |
| 49 |
| 50 // ---------------------------------------------------------------------------- |
| 51 // Constants and utility functions |
| 52 |
| 53 // Place the same HTML content into both the host document and the shadow root. |
| 54 // To differentiate these two, a class name is assigned to every element by |
| 55 // populateTestContentToHostDocument() and populateTestContentToShadowRoot(). |
| 56 var HTML_CONTENT = [ |
| 57 '<head>', |
| 58 '<title></title>', |
| 59 '<link rel="help" href="#">', |
| 60 '</head>', |
| 61 '<body>', |
| 62 '<p></p>', |
| 63 '<a name="test-name"></a>', |
| 64 '<a href="#"></a>', |
| 65 '<area href="#">', |
| 66 '<img src="#" alt="">', |
| 67 '<embed></embed>', |
| 68 '<form></form>', |
| 69 '<script><' + '/script>', |
| 70 '<applet></applet>', |
| 71 '</body>' |
| 72 ].join('\n'); |
| 73 |
| 74 function addClassNameToAllElements(document, root, className) { |
| 75 var nodeIterator = document.createNodeIterator( |
| 76 root, NodeFilter.SHOW_ELEMENT, null); |
| 77 var node; |
| 78 while (node = nodeIterator.nextNode()) |
| 79 node.className = className; |
| 80 } |
| 81 |
| 82 function populateTestContentToHostDocument(document) { |
| 83 document.documentElement.innerHTML = HTML_CONTENT; |
| 84 addClassNameToAllElements(document, document.documentElement, 'host'); |
| 85 } |
| 86 |
| 87 function populateTestContentToShadowRoot(shadowRoot) { |
| 88 shadowRoot.innerHTML = HTML_CONTENT; |
| 89 addClassNameToAllElements(shadowRoot.ownerDocument, shadowRoot, 'shadow'); |
| 90 } |
| 91 |
| 92 function createDocumentForTesting() { |
| 93 var doc = document.implementation.createHTMLDocument(''); |
| 94 populateTestContentToHostDocument(doc); |
| 95 var shadowRoot = doc.documentElement.createShadowRoot(); |
| 96 populateTestContentToShadowRoot(shadowRoot); |
| 97 return doc; |
| 98 } |
| 99 |
| 100 // Make sure the given HTMLCollection contains at least one elements and |
| 101 // all elements have the class named "host". This function works well with |
| 102 // HTMLCollection, HTMLAllCollection, and NodeList consisting of elements. |
| 103 function assert_collection(collection) { |
| 104 assert_true(collection.length > 0); |
| 105 Array.prototype.forEach.call(collection, function (element) { |
| 106 assert_equals(element.className, 'host'); |
| 107 }); |
| 108 } |
| 109 |
| 110 // ---------------------------------------------------------------------------- |
| 111 // Tests for DOM tree accessors defined in HTML specification |
| 112 |
| 113 test(function () { |
| 114 var doc = createDocumentForTesting(); |
| 115 assert_equals(doc.head.className, 'host'); |
| 116 assert_equals(doc.body.className, 'host'); |
| 117 }, |
| 118 '<head> and <body> in a shadow tree should not be accessible from ' + |
| 119 'owner document\'s "head" and "body" properties, respectively.' |
| 120 ); |
| 121 |
| 122 test(function () { |
| 123 var doc = document.implementation.createHTMLDocument(''); |
| 124 populateTestContentToHostDocument(doc); |
| 125 var shadowRoot = doc.documentElement.createShadowRoot(); |
| 126 populateTestContentToShadowRoot(shadowRoot); |
| 127 |
| 128 // Replace the content of <title> to distinguish elements in a host |
| 129 // document and a shadow tree. |
| 130 doc.getElementsByTagName('title')[0].innerText = 'Title of host document'; |
| 131 shadowRoot.getElementsByTagName('title')[0].innerText = |
| 132 'Title of shadow tree'; |
| 133 |
| 134 assert_equals(doc.title, 'Title of host document'); |
| 135 }, |
| 136 'The content of title element in a shadow tree should not be accessible ' + |
| 137 'from owner document\'s "title" attribute.' |
| 138 ); |
| 139 |
| 140 function testHTMLCollection(accessor) { |
| 141 var doc = createDocumentForTesting(); |
| 142 assert_collection(doc[accessor]); |
| 143 } |
| 144 |
| 145 generate_tests( |
| 146 testHTMLCollection, |
| 147 ['images', 'embeds', 'plugins', 'links', 'forms', 'scripts'].map( |
| 148 function (accessor) { |
| 149 return [ |
| 150 'Elements in a shadow tree should not be accessible from ' + |
| 151 'owner document\'s "' + accessor + '" attribute.', |
| 152 accessor |
| 153 ]; |
| 154 })); |
| 155 |
| 156 test(function () { |
| 157 var doc = createDocumentForTesting(); |
| 158 assert_collection(doc.getElementsByName('test-name')); |
| 159 }, |
| 160 'Elements in a shadow tree should not be accessible from owner ' + |
| 161 'document\'s getElementsByName() method.' |
| 162 ); |
| 163 |
| 164 // ---------------------------------------------------------------------------- |
| 165 // Tests for obsolete accessors |
| 166 |
| 167 generate_tests( |
| 168 testHTMLCollection, |
| 169 ['anchors', 'applets', 'all'].map( |
| 170 function (accessor) { |
| 171 return [ |
| 172 'Elements in a shadow tree should not be accessible from ' + |
| 173 'owner document\'s "' + accessor + '" attribute.', |
| 174 accessor |
| 175 ]; |
| 176 })); |
| 177 |
| 178 // ---------------------------------------------------------------------------- |
| 179 // Tests for accessors defined in DOM specification |
| 180 |
| 181 test(function () { |
| 182 var doc = createDocumentForTesting(); |
| 183 assert_collection(doc.getElementsByTagName('p')); |
| 184 }, |
| 185 'Elements in a shadow tree should not be accessible from owner ' + |
| 186 'document\'s getElementsByTagName() method.' |
| 187 ); |
| 188 |
| 189 test(function () { |
| 190 // Create a XML document. |
| 191 var namespace = 'http://www.w3.org/1999/xhtml'; |
| 192 var doc = document.implementation.createDocument(namespace, 'html'); |
| 193 doc.documentElement.appendChild(doc.createElementNS(namespace, 'head')); |
| 194 var body = doc.createElementNS(namespace, 'body'); |
| 195 var pHost = doc.createElementNS(namespace, 'p'); |
| 196 pHost.className = "host"; |
| 197 body.appendChild(pHost); |
| 198 doc.documentElement.appendChild(body); |
| 199 |
| 200 var shadowRoot = body.createShadowRoot(); |
| 201 var pShadow = doc.createElementNS(namespace, 'p'); |
| 202 pShadow.className = "shadow"; |
| 203 shadowRoot.appendChild(pShadow); |
| 204 |
| 205 assert_collection(doc.getElementsByTagNameNS(namespace, 'p')); |
| 206 }, |
| 207 'Elements in a shadow tree should not be accessible from owner ' + |
| 208 'document\'s getElementsByTagNameNS() method.' |
| 209 ); |
| 210 |
| 211 test(function () { |
| 212 var doc = document.implementation.createHTMLDocument(''); |
| 213 populateTestContentToHostDocument(doc); |
| 214 var shadowRoot = doc.documentElement.createShadowRoot(); |
| 215 populateTestContentToShadowRoot(shadowRoot); |
| 216 |
| 217 shadowRoot.getElementsByTagName('p')[0].id = 'test-id'; |
| 218 assert_equals(doc.getElementById('test-id'), null); |
| 219 }, |
| 220 'Elements in a shadow tree should not be accessible from owner ' + |
| 221 'document\'s getElementById() method.' |
| 222 ); |
| 223 </script> |
| 224 </body> |
| 225 </html> |
OLD | NEW |