diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
| commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
| tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/shadow-dom/untriaged/shadow-trees | |
| parent | Initial commit. (diff) | |
| download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip | |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/shadow-dom/untriaged/shadow-trees')
22 files changed, 1360 insertions, 0 deletions
diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest-ref.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest-ref.html new file mode 100644 index 0000000000..3050cefe9d --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" > + <title>Shadow DOM Test Ref file - Tests nested shadow tree.</title> + <link rel="author" title="shingo.miyazawa" href="mailto:kumatronik@gmail.com" > + <script src="../../../../html/resources/common.js"></script> + <meta name="assert" content="nested shadow tree style is valid." > + <style> + #host { + width: 100px; + height: 100px; + background-color: red; + } + </style> + </head> + <body> + <p>The test passes if there is a green square. Test failed if there is a red square.</p> + <div id='host'> + <div id="sub" style="width: 100%;height:100%;"> + <div style="width:100%; height:100%;background-color: green;"></div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest.html new file mode 100644 index 0000000000..8d02227fcf --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" > + <title>Shadow DOM Test - Tests nested shadow tree.</title> + <link rel="match" href="nested_tree_reftest-ref.html" > + <link rel="author" title="shingo.miyazawa" href="mailto:kumatronik@gmail.com" > + <link rel="help" href="https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#nested-shadow-trees" > + <script src="../../../../html/resources/common.js"></script> + <meta name="assert" content="nested shadow tree style is valid." > + <style> + #host { + width: 100px; + height: 100px; + background-color: red; + } + </style> + </head> + <body> + <p>The test passes if there is a green square. Test failed if there is a red square.</p> + <div id='host'> + </div> + <script> + var shadowRoot = document.getElementById('host').attachShadow({mode: 'open'}); + shadowRoot.innerHTML = '<div id="sub" style="width: 100%;height:100%;"></div>'; + var nestedRoot = shadowRoot.getElementById('sub').attachShadow({mode: 'open'}); + nestedRoot.innerHTML = '<div style="width:100%; height:100%;background-color: green;"></div>'; + </script> + </body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001-ref.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001-ref.html new file mode 100644 index 0000000000..c74cf99e70 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>Shadow DOM Test: Basic reprojection (reference)</title> +<link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> +<link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> +<style> +.pass { color: green; } +</style> +</head> +<body> +<p>You should see green text saying "Apple" and "Orange" below.</p> +<div id="host"> + <div id="host2"> + <div>Hello a Shadow Root2.</div> + <div> + Hello a Shadow Root. + <div class="pass">Apple.</div> + <div class="pass">Orange.</div> + <div>Banana.</div> + </div> + </div> +</div> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001.html new file mode 100644 index 0000000000..e2f5212b9a --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>Shadow DOM Test - Tests a reprojection.</title> +<link rel="match" href="reprojection-001-ref.html"> +<link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> +<link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#reprojection"> +<meta name="assert" content="a node is distributed into more than one insertion point."> +<script src="../../../../html/resources/common.js"></script> +<style> +.pass { color: green; } +</style> +</head> +<body> +<p>You should see green text saying "Apple" and "Orange" below.</p> +<div id="host"> + <div class="pass">Apple.</div> + <div class="pass">Orange.</div> +</div> +<script> + var shadowRoot = host.attachShadow({mode: 'open'}); + shadowRoot.innerHTML = '<div id="host2">Hello a Shadow Root.<slot></slot><div>Banana.</div></div>'; + var host2 = shadowRoot.getElementById("host2"); + var shadowRoot2 = host2.attachShadow({mode: 'open'}); + shadowRoot2.innerHTML = '<div>Hello a Shadow Root2.</div><div><slot></slot></div>'; +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-001-ref.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-001-ref.html new file mode 100644 index 0000000000..619f337853 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-001-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Basic shadow root (reference)</title> +<link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<style> +p { color: black; } +div { color: green; } +</style> +</head> +<body> +<p>You should see green text saying "PASS" below.</p> +<div>PASS</div> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-001.html new file mode 100644 index 0000000000..99cacded05 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-001.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Basic shadow root</title> +<link rel="match" href="shadow-root-001-ref.html"> +<link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#shadow-trees"> +<meta name="assert" content="When a shadow root is attached, the shadow tree is rendered."> +<script src="../../../html/resources/common.js"></script> +<style> +p { color: black; } +* { color: red; } +</style> +</head> +<body> +<p>You should see green text saying "PASS" below.</p> +<div id="host">FAIL</div> +<script> +var shadowRoot = window.host.attachShadow({mode: 'open'}); +shadowRoot.innerHTML = + '<style>#pass { color: green; }</style>\n' + + '<div id="pass">PASS</div>'; +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-002-ref.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-002-ref.html new file mode 100644 index 0000000000..eda41b9c04 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-002-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Basic distribution (reference)</title> +<link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<style> +p { color: black; } +div { color: green; } +</style> +</head> +<body> +<p> +You should see four lines of green text "A", "B", "C" and "D" below, +in this order. +</p> +<div>A</div> +<div>B</div> +<div>C</div> +<div>D</div> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-002.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-002.html new file mode 100644 index 0000000000..a26e817aae --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/shadow-root-002.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>Shadow DOM Test: Basic distribution</title> +<link rel="match" href="shadow-root-002-ref.html"> +<link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#shadow-trees"> +<meta name="assert" content="On distribution, content element is replaced with the shadow host's children."> +<script src="../../../html/resources/common.js"></script> +<style> +p { color: black; } +.pass { color: green; } +* { color: red; } +</style> +</head> +<body> +<p> +You should see four lines of green text "A", "B", "C" and "D" below, +in this order. +</p> +<div id="host"> +<div class="pass">B</div> +<div class="pass">C</div> +</div> +<script> +var shadowRoot = window.host.attachShadow({mode: 'open'}); + +shadowRoot.innerHTML = + '<style>\n' + + '.shadow-pass { color: green; }\n' + + '* { color: red; }\n' + + '</style>' + + '<div class="shadow-pass">A</div>\n' + + '<slot>FAIL</slot>' + + '<div class="shadow-pass">D</div>'; +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-001.html new file mode 100644 index 0000000000..3007fafc54 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-001.html @@ -0,0 +1,218 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Upper-boundary encapsulation: document's DOM tree accessors</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The shadow nodes and named shadow elements are not accessible using shadow host's document DOM tree accessors."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +// A document's "DOM tree accessors" include: +// (document.)head, title, body, images, embeds, plugins, links, forms, +// scripts, getElementsByName(), cssElementMap, and currentScript +// +// Of these, it is unclear how document.cssElementMap can be tested. +// Except for it, there is a test corresponding to each accessor. +// +// Additionally, there are obsolete accessors +// <http://www.whatwg.org/specs/web-apps/current-work/multipage/obsolete.html#other-elements,-attributes-and-apis>: +// (document.)anchors, applets, and all. +// +// and some accessors defined in the DOM specification (formerly known as +// "DOM Core") <http://dom.spec.whatwg.org/#interface-document>: +// (document.)documentElement, getElementsByTagName(), +// getElementsByTagNameNS(), getElementsByClassName(), and getElementById(). +// +// As it seems reasonable to have tests for these accessors, this file also +// includes tests for them, except for document.documentElement which is +// unclear whether we can test; the distribution process of Shadow DOM does not +// alter the host element, so the document element (e.g. <html>) cannot be +// replaced with an element in a shadow tree. + +// ---------------------------------------------------------------------------- +// Constants and utility functions + +// Place the same HTML content into both the host document and the shadow root. +// To differentiate these two, a class name is assigned to every element by +// populateTestContentToHostDocument() and populateTestContentToShadowRoot(). +var HTML_CONTENT = [ + '<head>', + '<title></title>', + '<link rel="help" href="#">', + '</head>', + '<body>', + '<p></p>', + '<a name="test-name"></a>', + '<a href="#"></a>', + '<area href="#">', + '<img src="#" alt="">', + '<embed></embed>', + '<form></form>', + '<script><' + '/script>', + '</body>' +].join('\n'); + +function addClassNameToAllElements(document, root, className) { + var nodeIterator = document.createNodeIterator( + root, NodeFilter.SHOW_ELEMENT, null); + var node; + while (node = nodeIterator.nextNode()) + node.className = className; +} + +function populateTestContentToHostDocument(document) { + document.documentElement.innerHTML = HTML_CONTENT; + addClassNameToAllElements(document, document.documentElement, 'host'); +} + +function populateTestContentToShadowRoot(shadowRoot) { + shadowRoot.innerHTML = HTML_CONTENT; + addClassNameToAllElements(shadowRoot.ownerDocument, shadowRoot, 'shadow'); +} + +function createDocumentForTesting() { + var doc = document.implementation.createHTMLDocument(''); + populateTestContentToHostDocument(doc); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + populateTestContentToShadowRoot(shadowRoot); + return doc; +} + +// Make sure the given HTMLCollection contains at least one elements and +// all elements have the class named "host". This function works well with +// HTMLCollection, HTMLAllCollection, and NodeList consisting of elements. +function assert_collection(collection) { + assert_true(collection.length > 0); + Array.prototype.forEach.call(collection, function (element) { + assert_equals(element.className, 'host'); + }); +} + +// ---------------------------------------------------------------------------- +// Tests for DOM tree accessors defined in HTML specification + +test(function () { + var doc = createDocumentForTesting(); + assert_equals(doc.head.className, 'host'); + assert_equals(doc.body.className, 'host'); +}, + '<head> and <body> in a shadow tree should not be accessible from ' + + 'owner document\'s "head" and "body" properties, respectively.' +); + +test(function () { + var doc = document.implementation.createHTMLDocument(''); + populateTestContentToHostDocument(doc); + + // Note: this test is originally written to replace document.documentElement + // with shadow contents, but among Shadow DOM V1 allowed elements body is the + // most approximate to it, though some test may make lesser sense. + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + populateTestContentToShadowRoot(shadowRoot); + + // Replace the content of <title> to distinguish elements in a host + // document and a shadow tree. + doc.getElementsByTagName('title')[0].textContent = 'Title of host document'; + shadowRoot.querySelector('title').textContent = + 'Title of shadow tree'; + + assert_equals(doc.title, 'Title of host document'); +}, + 'The content of title element in a shadow tree should not be accessible ' + + 'from owner document\'s "title" attribute.' +); + +function testHTMLCollection(accessor) { + var doc = createDocumentForTesting(); + assert_collection(doc[accessor]); +} + +generate_tests( + testHTMLCollection, + ['images', 'embeds', 'plugins', 'links', 'forms', 'scripts'].map( + function (accessor) { + return [ + 'Elements in a shadow tree should not be accessible from ' + + 'owner document\'s "' + accessor + '" attribute.', + accessor + ]; + })); + +test(function () { + var doc = createDocumentForTesting(); + assert_collection(doc.getElementsByName('test-name')); +}, + 'Elements in a shadow tree should not be accessible from owner ' + + 'document\'s getElementsByName() method.' +); + +// ---------------------------------------------------------------------------- +// Tests for obsolete accessors + +generate_tests( + testHTMLCollection, + ['anchors', 'all'].map( + function (accessor) { + return [ + 'Elements in a shadow tree should not be accessible from ' + + 'owner document\'s "' + accessor + '" attribute.', + accessor + ]; + })); + +// ---------------------------------------------------------------------------- +// Tests for accessors defined in DOM specification + +test(function () { + var doc = createDocumentForTesting(); + assert_collection(doc.getElementsByTagName('p')); +}, + 'Elements in a shadow tree should not be accessible from owner ' + + 'document\'s getElementsByTagName() method.' +); + +test(function () { + // Create a XML document. + var namespace = 'http://www.w3.org/1999/xhtml'; + var doc = document.implementation.createDocument(namespace, 'html'); + doc.documentElement.appendChild(doc.createElementNS(namespace, 'head')); + var body = doc.createElementNS(namespace, 'body'); + var pHost = doc.createElementNS(namespace, 'p'); + pHost.className = "host"; + body.appendChild(pHost); + doc.documentElement.appendChild(body); + + var shadowRoot = body.attachShadow({mode: 'open'}); + var pShadow = doc.createElementNS(namespace, 'p'); + pShadow.className = "shadow"; + shadowRoot.appendChild(pShadow); + + assert_collection(doc.getElementsByTagNameNS(namespace, 'p')); +}, + 'Elements in a shadow tree should not be accessible from owner ' + + 'document\'s getElementsByTagNameNS() method.' +); + +test(function () { + var doc = document.implementation.createHTMLDocument(''); + populateTestContentToHostDocument(doc); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + populateTestContentToShadowRoot(shadowRoot); + + shadowRoot.querySelectorAll('p')[0].id = 'test-id'; + assert_equals(doc.getElementById('test-id'), null); +}, + 'Elements in a shadow tree should not be accessible from owner ' + + 'document\'s getElementById() method.' +); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-002.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-002.html new file mode 100644 index 0000000000..88a2efc2d3 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-002.html @@ -0,0 +1,62 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Upper-boundary encapsulation: shadow root's DOM tree accessors</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The nodes are accessible using shadow root's DOM tree accessor methods."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +function assert_singleton_node_list(nodeList, expectedNode) { + assert_equals(nodeList.length, 1); + assert_equals(nodeList[0], expectedNode); +} + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var image = doc.createElement('img'); + shadowRoot.appendChild(image); + + assert_singleton_node_list(shadowRoot.querySelectorAll('img'), image); +}, + 'Elements in a shadow tree should be accessible via shadow root\'s ' + + 'querySelectorAll() DOM tree accessor.' +); + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var div = doc.createElement('div'); + div.className = 'div-class'; + shadowRoot.appendChild(div); + + assert_singleton_node_list( + shadowRoot.querySelectorAll('.div-class'), div); +}, + 'Elements with a specific class in a shadow tree should be accessible via' + + 'shadow root\'s querySelectorAll() DOM tree accessor.' +); + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var div = doc.createElement('div'); + div.id = 'div-id'; + shadowRoot.appendChild(div); + + assert_equals(shadowRoot.getElementById('div-id'), div); +}, + 'Elements in a shadow tree should be accessible via shadow root\'s ' + + 'getElementById() DOM tree accessor.' +); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-001.html new file mode 100644 index 0000000000..58c8adc087 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-001.html @@ -0,0 +1,99 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Upper-boundary encapsuration on ownerDocument: basic tests</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The ownerDocument property of all nodes in shadow tree refers to the document of the shadow host."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + doc.body.innerHTML = '<div>A<div>B</div>C<div><span>D</span></div>E</div>'; + var nodeIterator = doc.createNodeIterator(doc.body, + NodeFilter.SHOW_ELEMENT, null); + var node; + while (node = nodeIterator.nextNode()) { + var shadowRoot = node.attachShadow({mode: 'open'}); + assert_equals(shadowRoot.ownerDocument, doc); + } +}, 'ownerDocument property of a shadow root should be the document of the ' + + 'shadow host, regardless of the location of the shadow host.'); + +test(function () { + var MAX_DEPTH = 16; + var doc = document.implementation.createHTMLDocument('Test'); + var tail = doc.body; + for (var depth = 1; depth <= MAX_DEPTH; ++depth) { + var div = doc.createElement('div'); + div.id = 'depth-' + depth; + tail.appendChild(div); + tail = div; + } + + for (var depth = 1; depth <= MAX_DEPTH; ++depth) { + var host = doc.getElementById('depth-' + depth); + var shadowRoot = host.attachShadow({mode: 'open'}); + assert_equals(shadowRoot.ownerDocument, doc, + 'ownerDocument mismatch for #depth-' + depth); + } +}, 'ownerDocument property of elements in a shadow tree should match ' + + 'the document of the shadow host, regardless of the element\'s location ' + + 'in a shadow tree.'); + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var div = doc.createElement('div'); + shadowRoot.appendChild(div); + assert_equals(div.ownerDocument, doc); +}, 'Elements added to a shadow tree should automatically get a valid ' + + 'ownerDocument.'); + +test(function () { + var doc1 = document.implementation.createHTMLDocument('Test 1'); + var doc2 = document.implementation.createHTMLDocument('Test 2'); + var shadowRoot = doc1.body.attachShadow({mode: 'open'}); + var div = doc2.createElement('div'); + shadowRoot.appendChild(div); + assert_equals(div.ownerDocument, doc1); +}, 'ownerDocument property of an element in a shadow tree should be the ' + + 'document of the shadow host, even if the host element is created from ' + + 'another document.'); + +test(function () { + var doc1 = document.implementation.createHTMLDocument('Test 1'); + var doc2 = document.implementation.createHTMLDocument('Test 2'); + var shadowRoot = doc1.body.attachShadow({mode: 'open'}); + doc2.body.innerHTML = + '<div id="root">A<div>B</div>C<div><span>D</span></div>E</div>'; + shadowRoot.appendChild(doc2.getElementById('root')); + var nodeIterator = doc1.createNodeIterator( + shadowRoot.getElementById('root'), 0xFFFFFFFF, null); + var node; + while (node = nodeIterator.nextNode()) { + assert_equals(node.ownerDocument, doc1); + } +}, 'All children nodes of a shadow root get a valid ownerDocument when ' + + 'added to a shadow tree.'); + +test(function () { + var doc1 = document.implementation.createHTMLDocument('Test 1'); + var doc2 = document.implementation.createHTMLDocument('Test 2'); + var shadowRoot = doc1.body.attachShadow({mode: 'open'}); + doc2.body.innerHTML = '<div id="parent"><div id="child"></div></div>'; + shadowRoot.appendChild(doc2.getElementById('child')); + assert_equals(doc2.getElementById('parent').ownerDocument, doc2); +}, 'ownerDocument property of a node should remain the same, even if its ' + + 'child is adopted into a shadow tree.'); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-002.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-002.html new file mode 100644 index 0000000000..3ef53fc5ab --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-002.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Upper-boundary encapsuration on ownerDocument: with all HTML5 elements</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The ownerDocument property of all nodes in shadow tree refers to the document of the shadow host."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +function testElement(elementName) { + var doc = document.implementation.createHTMLDocument('Test'); + var element = doc.createElement(elementName); + doc.body.appendChild(element); + var shadowRoot = element.attachShadow({mode: 'open'}); + HTML5_SHADOW_ALLOWED_ELEMENTS.forEach(function (name) { + shadowRoot.appendChild(doc.createElement(name)); + }); + + var iterator = doc.createNodeIterator(shadowRoot, 0xFFFFFFFF, null); + var node; + while (node = iterator.nextNode()) { + assert_equals(node.ownerDocument, doc); + } +} + +var testParameters = HTML5_SHADOW_ALLOWED_ELEMENTS.map(function (name) { + return [ + 'ownerDocument property of any elements in a shadow tree should ' + + 'match the document of the shadow host, when the host is a "' + + name + '" element.', + name + ]; +}); + +generate_tests(testElement, testParameters); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-001.html new file mode 100644 index 0000000000..f3ca2b786f --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-001.html @@ -0,0 +1,71 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Upper-boundary encapsulation: document's Selector APIs</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: Nodes in a shadow tree must not be accessible through selector APIs of owner document."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +// Return a document containing the structure below: +// +// <body> - - - - - {shadow-root} +// | | +// | +-- <p class="test-class" id="test-id"> +// | +// +-- <p class="test-class" id="test-id"> +function createTestDocument() { + var doc = document.implementation.createHTMLDocument('Test'); + var pHost = doc.createElement('p'); + pHost.className = 'test-class'; + pHost.id = 'test-id'; + doc.body.appendChild(pHost); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var pShadow = doc.createElement('p'); + pShadow.className = 'test-class'; + pShadow.id = 'test-id'; + shadowRoot.appendChild(pShadow); + return { + doc: doc, + pHost: pHost, + pShadow: pShadow + }; +} + +test(function () { + var documentObject = createTestDocument(); + var doc = documentObject.doc; + var pHost = documentObject.pHost; + assert_equals(doc.querySelector('p'), pHost); + assert_equals(doc.querySelector('.test-class'), pHost); + assert_equals(doc.querySelector('#test-id'), pHost); +}, + 'Elements in a shadow tree should not be accessible from ' + + 'owner document\'s querySelector() method.' +); + +function assert_singleton_node_list(nodeList, expectedNode) { + assert_equals(nodeList.length, 1); + assert_equals(nodeList[0], expectedNode); +} + +test(function () { + var documentObject = createTestDocument(); + var doc = documentObject.doc; + var pHost = documentObject.pHost; + assert_singleton_node_list(doc.querySelectorAll('p'), pHost); + assert_singleton_node_list(doc.querySelectorAll('.test-class'), pHost); + assert_singleton_node_list(doc.querySelectorAll('#test-id'), pHost); +}, + 'Elements in a shadow tree should not be accessible from ' + + 'owner document\'s querySelectorAll() method.' +); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-002.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-002.html new file mode 100644 index 0000000000..6167f57e4e --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-002.html @@ -0,0 +1,75 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Upper-boundary encapsulation: shadow root's Selector APIs</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: Nodes in a shadow tree must be accessible through selector APIs of the shadow root."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +// Return a document containing the structure below: +// +// <body> - - - - - {shadow-root} +// | | +// | +-- <p class="test-class" id="test-id"> +// | +// +-- <p class="test-class" id="test-id"> +function createTestDocument() { + var doc = document.implementation.createHTMLDocument('Test'); + var pHost = doc.createElement('p'); + pHost.className = 'test-class'; + pHost.id = 'test-id'; + doc.body.appendChild(pHost); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var pShadow = doc.createElement('p'); + pShadow.className = 'test-class'; + pShadow.id = 'test-id'; + shadowRoot.appendChild(pShadow); + return { + doc: doc, + shadowRoot: shadowRoot, + pHost: pHost, + pShadow: pShadow + }; +} + +test(function () { + var documentObject = createTestDocument(); + var shadowRoot = documentObject.shadowRoot; + var pShadow = documentObject.pShadow; + assert_equals(shadowRoot.querySelector('p'), pShadow); + assert_equals(shadowRoot.querySelector('.test-class'), pShadow); + assert_equals(shadowRoot.querySelector('#test-id'), pShadow); +}, + 'Elements in a shadow tree should be accessible from ' + + 'shadow root\'s querySelector() method.' +); + +function assert_singleton_node_list(nodeList, expectedNode) { + assert_equals(nodeList.length, 1); + assert_equals(nodeList[0], expectedNode); +} + +test(function () { + var documentObject = createTestDocument(); + var shadowRoot = documentObject.shadowRoot; + var pShadow = documentObject.pShadow; + assert_singleton_node_list(shadowRoot.querySelectorAll('p'), pShadow); + assert_singleton_node_list(shadowRoot.querySelectorAll('.test-class'), + pShadow); + assert_singleton_node_list(shadowRoot.querySelectorAll('#test-id'), + pShadow); +}, + 'Elements in a shadow tree should be accessible from ' + + 'shadow root\'s querySelectorAll() method.' +); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/shadow-root-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/shadow-root-001.html new file mode 100644 index 0000000000..97f5c35717 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/shadow-root-001.html @@ -0,0 +1,54 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Shadow root's parentNode() and parentElement()</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The parentNode and parentElement attributes of the shadow root object must always return null."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + assert_equals(shadowRoot.parentNode, null); +}, 'The parentNode attribute of a shadow root must always return null.'); + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + assert_equals(shadowRoot.parentElement, null); +}, 'The parentElement attribute of a shadow root must always return null.'); + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var outerShadowRoot = doc.body.attachShadow({mode: 'open'}); + var div = doc.createElement('div'); + outerShadowRoot.appendChild(div); + var innerShadowRoot = div.attachShadow({mode: 'open'}); + assert_equals(innerShadowRoot.parentNode, null); +}, + 'The parentNode attribute of a shadow root must always return null, ' + + 'even if the shadow root is nested inside another shadow root.' +); + +test(function () { + var doc = document.implementation.createHTMLDocument('Test'); + var outerShadowRoot = doc.body.attachShadow({mode: 'open'}); + var div = doc.createElement('div'); + outerShadowRoot.appendChild(div); + var innerShadowRoot = div.attachShadow({mode: 'open'}); + assert_equals(innerShadowRoot.parentElement, null); +}, + 'The parentElement attribute of a shadow root must always return null, ' + + 'even if the shadow root is nested inside another shadow root.' +); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-005.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-005.html new file mode 100644 index 0000000000..b82a9523a9 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-005.html @@ -0,0 +1,64 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: A_04_01_05</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation:The nodes with a unique id and named elements are not addressable from any attributes of elements in shadow host's document"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +// check label.for attribute +test(function () { + var d = newHTMLDocument(); + var div = d.createElement('div'); + d.body.appendChild(div); + var s = div.attachShadow({mode: 'open'}); + + // node in shadow with id + var input = d.createElement('input'); + input.setAttribute('type', 'text'); + input.setAttribute('id', 'input_id'); + d.body.appendChild(input); + s.appendChild(input); + + // node in host with a reference to host element with id + var label = d.createElement('label'); + label.setAttribute('for', 'input_id'); + d.body.appendChild(label); + + assert_equals(label.control, null, 'Elements in shadow DOM must not be accessible from ' + + 'owner\'s document label.for attribute'); + +}, 'A_04_01_05_T01'); + +// check form associated elements +test(function () { + + HTML5_FORM_ASSOCIATED_ELEMENTS.forEach(function (tagName) { + var d = newHTMLDocument(); + var div = d.createElement('div'); + d.body.appendChild(div); + var s = div.attachShadow({mode: 'open'}); + + var form = d.createElement('form'); + form.setAttribute('id', 'form_id'); + d.body.appendChild(form); + + var el = d.createElement(tagName); + el.setAttribute('form', 'form_id'); + d.body.appendChild(el); + + s.appendChild(form); + + assert_equals(el.form, null, 'Elements in shadow DOM must not be accessible from ' + + 'owner\'s document ' + tagName + '.form attribute'); + }); +}, 'A_04_01_05_T02'); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-007.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-007.html new file mode 100644 index 0000000000..0cfe169b44 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-007.html @@ -0,0 +1,65 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: A_04_01_07</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation:The nodes with a unique id and named elements are addressable from any attributes of elements in the same shadow DOM subtree"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +// check for label.control +test(function () { + var d = newHTMLDocument(); + var div = d.createElement('div'); + d.body.appendChild(div); + var s = div.attachShadow({mode: 'open'}); + + var input = d.createElement('input'); + input.setAttribute('type', 'text'); + input.setAttribute('id', 'input_id'); + d.body.appendChild(input); + + var label = d.createElement('label'); + label.setAttribute('for', 'input_id'); + s.appendChild(label); + s.appendChild(input); + + assert_equals(label.control, input, 'Elements in shadow DOM must be accessible from ' + + 'shadow document label.for attribute'); + +}, 'A_04_01_07_T01'); + +// check for elem.form associated elements +test(function () { + + HTML5_FORM_ASSOCIATED_ELEMENTS.forEach(function (tagName) { + d = newHTMLDocument(); + + var form = d.createElement('form'); + var el = d.createElement(tagName); + + d.body.appendChild(form); + d.body.appendChild(el); + + form.setAttribute('id', 'form_id'); + el.setAttribute('form', 'form_id'); + + div = d.createElement('div'); + d.body.appendChild(div); + + var s = div.attachShadow({mode: 'open'}); + s.appendChild(form); + s.appendChild(el); + + assert_equals(el.form, form, 'Elements in shadow DOM must be accessible from ' + + 'shadow document ' + tagName + '.form attribute'); + }); +}, 'A_04_01_07_T02'); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-009.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-009.html new file mode 100644 index 0000000000..f37f17bc1a --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-009.html @@ -0,0 +1,235 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: A_04_01_09</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Mikhail Fursov" href="mailto:mfursov@unipro.ru"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: no nodes other than shadow root descendants are accessible with shadow root DOM tree accessor methods"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +var A_04_01_09 = new Object(); + +A_04_01_09.setupBlock = function (ctx, prefix, root) { + // create <div id='prefix+_id1' class='cls'><p class='cls'><div id='prefix+_id2' class='cls'></div></p></div> like structure + // where <p> will be used as shadow host element + + ctx[prefix + '_div1'] = ctx.d.createElement('div'); + ctx[prefix + '_div1'].setAttribute('id', prefix + '_id1'); + ctx[prefix + '_div1'].setAttribute('class', 'cls'); + + ctx[prefix + '_p1'] = ctx.d.createElement('p'); + ctx[prefix + '_p1'].setAttribute('class', 'cls'); + ctx[prefix + '_p1'].setAttribute('test', 'A_04_01_09'); + + ctx[prefix + '_div2'] = ctx.d.createElement('div'); + ctx[prefix + '_div2'].setAttribute('id', prefix + '_id2'); + ctx[prefix + '_div2'].setAttribute('class', 'cls'); + ctx[prefix + '_div2'].setAttribute('test', 'A_04_01_09'); + + root.appendChild(ctx[prefix + '_div1']); + ctx[prefix + '_div1'].appendChild(ctx[prefix + '_p1']); + ctx[prefix + '_p1'].appendChild(ctx[prefix + '_div2']); +}; + +A_04_01_09.setup = function () { + var ctx = {}; + + ctx.d = newHTMLDocument(); + A_04_01_09.setupBlock(ctx, 'd', ctx.d.body); + + ctx.s1 = ctx.d_p1.attachShadow({mode: 'open'}); + A_04_01_09.setupBlock(ctx, 's1', ctx.s1); + + ctx.s2 = ctx.s1_p1.attachShadow({mode: 'open'}); + A_04_01_09.setupBlock(ctx, 's2', ctx.s2); + + assert_true(ctx.d_div1 != null, 'setup:d_div1'); + assert_true(ctx.d_div2 != null, 'setup:d_div2'); + assert_true(ctx.s1_div1 != null, 'setup: s1_div1'); + assert_true(ctx.s1_div2 != null, 'setup: s1_div2'); + assert_true(ctx.s2_div1 != null, 'setup: s2_div1'); + assert_true(ctx.s2_div2 != null, 'setup: s2_div2'); + + return ctx; +}; + +//check querySelectorAll +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder( + ctx.s1.querySelectorAll('div'), [ctx.s1_div1, ctx.s1_div2], + 'nodes, other than shadow root descendants, should not be accessible with ' + + 'ShadowRoot.getElementsByTagName (s1)'); + + assert_nodelist_contents_equal_noorder( + ctx.s2.querySelectorAll('div'), [ctx.s2_div1, ctx.s2_div2], + 'nodes, other than shadow root descendants, should not be accessible with ' + + 'ShadowRoot.getElementsByTagName (s2)'); + +}, 'A_04_01_09_T01'); + +//check querySelectorAll for class +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder( + ctx.s1.querySelectorAll('.cls'), [ctx.s1_div1, ctx.s1_p1, ctx.s1_div2], + 'nodes, other than shadow root descendants, should not be accessible with ' + + 'ShadowRoot.getElementsByClassName (s1)'); + + assert_nodelist_contents_equal_noorder( + ctx.s2.querySelectorAll('.cls'), [ctx.s2_div1, ctx.s2_p1, ctx.s2_div2], + 'nodes, other than shadow root descendants, should not be accessible with ' + + 'ShadowRoot.getElementsByClassName (s2)'); + +}, 'A_04_01_09_T03'); + +// check querySelector for id +test(function () { + var ctx = A_04_01_09.setup(); + + assert_equals(ctx.d.querySelector('#s1_id1'), null, 'Expected no access to s1_div1 from d.querySelector()'); + assert_equals(ctx.d.querySelector('#s1_id2'), null, 'Expected no access to s1_div2 from d.querySelector()'); + assert_equals(ctx.d.querySelector('#s2_id1'), null, 'Expected no access to s2_div1 from d.querySelector()'); + assert_equals(ctx.d.querySelector('#s2_id2'), null, 'Expected no access to s2_div1 from d.querySelector()'); + + assert_equals(ctx.s1.querySelector('#d_id1'), null, 'Expected no access to d_div1 from s1.querySelector()'); + assert_equals(ctx.s1.querySelector('#d_id2'), null, 'Expected no access to d_div2 from s1.querySelector()'); + assert_equals(ctx.s2.querySelector('#d_id1'), null, 'Expected no access to d_div1 from s2.querySelector()'); + assert_equals(ctx.s2.querySelector('#d_id2'), null, 'Expected no access to d_div1 from s2.querySelector()'); + + assert_equals(ctx.d.querySelector('#d_id1'), ctx.d_div1, 'Expected access to d_div1 form d.querySelector()'); + assert_equals(ctx.d.querySelector('#d_id2'), ctx.d_div2, 'Expected access to d_div2 form d.querySelector()'); + assert_equals(ctx.s1.querySelector('#s1_id1'), ctx.s1_div1, 'Expected access to s1_div1 form s1.querySelector()'); + assert_equals(ctx.s1.querySelector('#s1_id2'), ctx.s1_div2, 'Expected access to s1_div2 form s1.querySelector()'); + assert_equals(ctx.s2.querySelector('#s2_id1'), ctx.s2_div1, 'Expected access to s2_div1 form s2.querySelector()'); + assert_equals(ctx.s2.querySelector('#s2_id2'), ctx.s2_div2, 'Expected access to s2_div2 form s2.querySelector()'); + + assert_equals(ctx.s1.querySelector('#s2_id1'), null, 'Expected no access to s2_div1 form s1.querySelector()'); + assert_equals(ctx.s1.querySelector('#s2_id2'), null, 'Expected no access to s2_div2 form s1.querySelector()'); + assert_equals(ctx.s2.querySelector('#s1_id1'), null, 'Expected no access to s1_div1 form s2.querySelector()'); + assert_equals(ctx.s2.querySelector('#s1_id2'), null, 'Expected no access to s1_div2 form s2.querySelector()'); + +}, 'A_04_01_09_T05'); + + +//check querySelector for element +test(function () { + var ctx = A_04_01_09.setup(); + + assert_equals(ctx.d.querySelector('p'), ctx.d_p1, 'Expected access to d_p1 from d.querySelector()'); + assert_equals(ctx.s1.querySelector('p'), ctx.s1_p1, 'Expected access to s1_p1 from s1.querySelector()'); + assert_equals(ctx.s2.querySelector('p'), ctx.s2_p1, 'Expected access to s2_p1 from s2.querySelector()'); + +}, 'A_04_01_09_T06'); + +// check querySelectorAll for element +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('p'), [ctx.d_p1], 'Expected access to d_p1 from d.querySelectorAll()'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('p'), [ctx.s1_p1], 'Expected access to s1_p1 s1.querySelectorAll'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('p'), [ctx.s2_p1], 'Expected access to s2_p1 from s2.querySelectorAll'); + +}, 'A_04_01_09_T07'); + +// check querySelectorAll for class +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('.cls'), [ctx.d_div1, ctx.d_p1, ctx.d_div2], 'd.querySelectorAll() return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('.cls'), [ctx.s1_div1, ctx.s1_p1, ctx.s1_div2], 's1.querySelectorAll() return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('.cls'), [ctx.s2_div1, ctx.s2_p1, ctx.s2_div2], 's2.querySelectorAll() return wrong result'); + +}, 'A_04_01_09_T08'); + +//check querySelectorAll with whildcat +test(function () { + var ctx = A_04_01_09.setup(); + + //assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('*'), [ctx.d_div1, ctx.d_p1, ctx.d_div2], 'd.querySelectorAll'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('*'), [ctx.s1_div1, ctx.s1_p1, ctx.s1_div2], 's1.querySelectorAll(\'*\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('*'), [ctx.s2_div1, ctx.s2_p1, ctx.s2_div2], 's2.querySelectorAll(\'*\') return wrong result'); + +}, 'A_04_01_09_T09'); + +//check querySelectorAll with attribute value +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('[test=A_04_01_09]'), [ctx.d_p1, ctx.d_div2], 'd.querySelectorAll(\'[test=A_04_01_09]\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('[test=A_04_01_09]'), [ctx.s1_p1, ctx.s1_div2], 's1.querySelectorAll(\'[test=A_04_01_09]\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('[test=A_04_01_09]'), [ctx.s2_p1, ctx.s2_div2], 's2.querySelectorAll(\'[test=A_04_01_09]\') return wrong result'); + +}, 'A_04_01_09_T10'); + +//check querySelectorAll with parent-child selection +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('div:first-child'), [ctx.d_div1, ctx.d_div2], 'd.querySelectorAll(\'div:first-child\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('div:first-child'), [ctx.s1_div1,ctx.s1_div2], 's1.querySelectorAll(\'div:first-child\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('div:first-child'), [ctx.s2_div1,ctx.s2_div2], 's2.querySelectorAll(\'div:first-child\') return wrong result'); + +}, 'A_04_01_09_T11'); + +//check querySelectorAll with parent-child selection +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('div:last-child'), [ctx.d_div1, ctx.d_div2], 'd.querySelectorAll(\'div:last-child\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('div:last-child'), [ctx.s1_div1, ctx.s1_div2], 's1.querySelectorAll(\'div:last-child\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('div:last-child'), [ctx.s2_div1, ctx.s2_div2], 's2.querySelectorAll(\'div:last-child\') return wrong result'); + +}, 'A_04_01_09_T12'); + +//check querySelectorAll with parent-child selection +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('p:only-child'), [ctx.d_p1], 'd.querySelectorAll(\'p:only-child\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('p:only-child'), [ctx.s1_p1], 's1.querySelectorAll(\'p:only-child\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('p:only-child'), [ctx.s2_p1], 's2.querySelectorAll(\'p:only-child\') return wrong result'); + +}, 'A_04_01_09_T13'); + +//check querySelectorAll with parent-child selection +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('div:empty'), [ctx.d_div2], 'd.querySelectorAll(\'div:empty\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('div:empty'), [ctx.s1_div2], 's1.querySelectorAll(\'div:empty\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('div:empty'), [ctx.s2_div2], 's2.querySelectorAll(\'div:empty\') return wrong result'); + +}, 'A_04_01_09_T14'); + +//check querySelectorAll with parent-child selection +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('p div'), [ctx.d_div2], 'd.querySelectorAll(\'p div\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('p div'), [ctx.s1_div2], 's1.querySelectorAll(\'p div\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('p div'), [ctx.s2_div2], 's2.querySelectorAll(\'p div\') return wrong result'); + +}, 'A_04_01_09_T15'); + +//check querySelectorAll with parent-child selection +test(function () { + var ctx = A_04_01_09.setup(); + + assert_nodelist_contents_equal_noorder(ctx.d.querySelectorAll('p > div'), [ctx.d_div2], 'd.querySelectorAll(\'p > div\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s1.querySelectorAll('p > div'), [ctx.s1_div2], 's1.querySelectorAll(\'p > div\') return wrong result'); + assert_nodelist_contents_equal_noorder(ctx.s2.querySelectorAll('p > div'), [ctx.s2_div2], 's2.querySelectorAll(\'p > div\') return wrong result'); + +}, 'A_04_01_09_T16'); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-011.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-011.html new file mode 100644 index 0000000000..48ac1c7540 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/test-011.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: A_04_01_11</title> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation:The style sheets, represented by the shadow nodes are not accessible using shadow host document's CSSOM extensions"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +<script src="../../../resources/shadow-dom-utils.js"></script> +</head> +<body> +<div id="log"></div> +<script> +// check that <link> element added to head is not exposed +test(unit(function (ctx) { + + var d = newRenderedHTMLDocument(ctx); + var initialStyleSheetsCount = d.styleSheets.length; + + var link = d.createElement('link'); + link.setAttribute('rel', 'stylesheet'); + d.body.appendChild(link); + + //create Shadow root + var root = d.createElement('div'); + d.body.appendChild(root); + var s = root.attachShadow({mode: 'open'}); + + s.appendChild(link); + + assert_equals(d.styleSheets.length, initialStyleSheetsCount, 'stylesheet link elements in shadow DOM must not be ' + + 'exposed via the document.styleSheets collection'); + + +}), 'A_04_01_11_T2'); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-001.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-001.html new file mode 100644 index 0000000000..6e4cbbd9b7 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-001.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Window object named properties: Frames</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The nodes and named elements are not accessible from Window object named properties."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +test(function () { + var host = document.createElement('div'); + try { + host.style.display = 'none'; + document.body.appendChild(host); + var shadowRoot = host.attachShadow({mode: 'open'}); + var iframe = document.createElement('iframe'); + iframe.style.display = 'none'; + iframe.name = 'test-name'; + shadowRoot.appendChild(iframe); + assert_false('test-name' in window); + } finally { + if (host.parentNode) + host.parentNode.removeChild(host); + } +}, + 'An iframe element in a shadow tree should not be accessible from ' + + 'window\'s named properties with its "name" attribute value.' +); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-002.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-002.html new file mode 100644 index 0000000000..957e087e86 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-002.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Window object named properties: "name" attribute</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The nodes and named elements are not accessible from Window object named properties."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +function testNameAttribute(elementName) { + var doc = document.implementation.createHTMLDocument('Title'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var element = doc.createElement(elementName); + element.name = 'test-name'; + shadowRoot.appendChild(element); + assert_false('test-name' in window); +} + +var namedElements = [ + 'a', 'applet', 'area', 'embed', 'form', 'frameset', 'img', 'object' +]; + +var nameAttributeTestParameter = namedElements.map(function (elementName) { + return [ + '"' + elementName + '" element with name attribute in a shadow tree ' + + 'should not be accessible from window object\'s named property.', + elementName + ]; +}); + +generate_tests(testNameAttribute, nameAttributeTestParameter); +</script> +</body> +</html> diff --git a/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-003.html b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-003.html new file mode 100644 index 0000000000..00d3931266 --- /dev/null +++ b/testing/web-platform/tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/window-named-properties-003.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<title>Shadow DOM Test: Window object named properties: "id" attribute</title> +<link rel="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"> +<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> +<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com"> +<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#upper-boundary-encapsulation"> +<meta name="assert" content="Upper-boundary encapsulation: The nodes and named elements are not accessible from Window object named properties."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="../../../../html/resources/common.js"></script> +</head> +<body> +<div id="log"></div> +<script> +function testIDAttribute(elementName) { + var doc = document.implementation.createHTMLDocument('Title'); + var shadowRoot = doc.body.attachShadow({mode: 'open'}); + var element = doc.createElement(elementName); + element.id = 'test-id'; + shadowRoot.appendChild(element); + assert_false('test-id' in window); +} + +var idAttributeTestParameter = HTML5_ELEMENTS.map(function (elementName) { + return [ + '"' + elementName + '" element with id attribute in a shadow tree ' + + 'should not be accessible from window object\'s named property.', + elementName + ]; +}); + +generate_tests(testIDAttribute, idAttributeTestParameter); +</script> +</body> +</html> |