Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-28 16:48:22 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision d011702f368b88b3bae86e7a8fd2ddd22e18b33c

Browse source
This commit is contained in:
Ms2ger 2016-04-12 09:07:41 +02:00
parent f9608022ca
commit 299ad0f9d0
573 changed files with 38776 additions and 14942 deletions
Download patch file Download diff file Expand all files Collapse all files

154
tests/wpt/web-platform-tests/shadow-dom/resources/shadow-dom-utils.js Normal file
View file

@ -0,0 +1,154 @@
// Copyright 2012 Google Inc. All Rights Reserved.
/*
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
*/
"use strict";
// custom element is also allowed.
var ATTACHSHADOW_SAFELISTED_ELEMENTS = [
'article',
'aside',
'blockquote',
'body',
'div',
'footer',
'h1',
'h2',
'h3',
'h4',
'h5',
'h6',
'header',
'nav',
'p',
'section',
'span'
];
var HTML5_ELEMENT_NAMES = [
'a', 'abbr', 'address', 'area', 'article', 'aside', 'audio',
'b', 'base', 'bdi', 'bdo', 'blockquote', 'body', 'br', 'button',
'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'command',
'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt',
'em', 'embed',
'fieldset', 'figcaption', 'figure', 'footer', 'form',
'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr',
'html',
'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen',
'label', 'legend', 'li', 'link',
'map', 'mark', 'menu', 'meta', 'meter',
'nav', 'noscript',
'object', 'ol', 'optgroup', 'option', 'output',
'p', 'param', 'pre', 'progress',
'q',
'rp', 'rt', 'ruby',
's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span',
'strong', 'style', 'sub',
'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time',
'title', 'tr', 'track',
'u', 'ul',
'var', 'video',
'wbr'
];
function unit(f) {
return function () {
var ctx = newContext();
try {
f(ctx);
} finally {
cleanContext(ctx);
}
}
}
function step_unit(f, ctx, t) {
return function () {
var done = false;
try {
f();
done = true;
} finally {
if (done) {
t.done();
}
cleanContext(ctx);
}
}
}
function assert_nodelist_contents_equal_noorder(actual, expected, message) {
assert_equals(actual.length, expected.length, message);
var used = [];
for (var i = 0; i < expected.length; i++) {
used.push(false);
}
for (i = 0; i < expected.length; i++) {
var found = false;
for (var j = 0; j < actual.length; j++) {
if (used[j] == false && expected[i] == actual[j]) {
used[j] = true;
found = true;
break;
}
}
if (!found) {
assert_unreached(message + ". Fail reason: element not found: " + expected[i]);
}
}
}
//Example taken from http://www.w3.org/TR/shadow-dom/#event-retargeting-example
function createTestMediaPlayer(d) {
d.body.innerHTML = '' +
'<div id="player">' +
'<input type="checkbox" id="outside-control">' +
'<div id="player-shadow-host">' +
'</div>' +
'</div>';
var playerShadowRoot = d.querySelector('#player-shadow-host').createShadowRoot();
playerShadowRoot.innerHTML = '' +
'<div id="controls">' +
'<button class="play-button">PLAY</button>' +
'<div tabindex="0" id="timeline">' +
'<div id="timeline-shadow-host">' +
'</div>' +
'</div>' +
'<div class="volume-slider-container" id="volume-slider-container">' +
'<div tabindex="0" class="volume-slider" id="volume-slider">' +
'<div id="volume-shadow-host">' +
'</div>' +
'</div>' +
'</div>' +
'</div>';
var timeLineShadowRoot = playerShadowRoot.querySelector('#timeline-shadow-host').createShadowRoot();
timeLineShadowRoot.innerHTML = '<div class="slider-thumb" id="timeline-slider-thumb"></div>';
var volumeShadowRoot = playerShadowRoot.querySelector('#volume-shadow-host').createShadowRoot();
volumeShadowRoot.innerHTML = '<div class="slider-thumb" id="volume-slider-thumb"></div>';
return {
'playerShadowRoot': playerShadowRoot,
'timeLineShadowRoot': timeLineShadowRoot,
'volumeShadowRoot': volumeShadowRoot
};
}
//FIXME This call of initKeyboardEvent works for WebKit-only.
//See https://bugs.webkit.org/show_bug.cgi?id=16735
// and https://bugs.webkit.org/show_bug.cgi?id=13368. Add check for browser here
function fireKeyboardEvent(doc, element, key) {
var event = doc.createEvent('KeyboardEvent');
event.initKeyboardEvent("keydown", true, true, doc.defaultView, key, 0, false, false, false, false);
element.dispatchEvent(event);
}

53
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/attributes/test-001.html
View file

@ -1,53 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_02_01_01</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/#shadow-aware-attributes">
<meta name="assert" content="Extensions to Element Interface: pseudo of type DOMString attribute. Test getter when there is a custom pseudo-element associated with this element">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(function () {
var d = newHTMLDocument();
var widget = d.createElement('div');
d.body.appendChild(widget);
var s = widget.createShadowRoot();
var thumb = d.createElement('span');
thumb.innerHTML = 'This is a pseudo-element';
thumb.pseudo = 'x-thumb';
s.appendChild(thumb);
var style = d.createElement('style');
style.innerHTML = '' +
'div::x-thumb {' +
'font-size: 30px;' +
'}';
d.body.appendChild(style);
assert_true(thumb.pseudo != null, 'attribute \'pseudo\' must not be null');
assert_equals(thumb.pseudo, 'x-thumb', 'attribute \'pseudo\' must return ' +
'the current custom pseudo-element value')
}, 'A_10_02_01_01_T01');
</script>
</body>
</html>

43
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/attributes/test-005.html
View file

@ -1,43 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_02_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/#shadow-aware-attributes">
<meta name="assert" content="Extensions to Element Interface: shadowRoot of type ShadowRoot">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(function () {
var d = newHTMLDocument();
var host = d.createElement('div');
d.body.appendChild(host);
//old tree
var s1 = host.createShadowRoot();
//young tree
var s2 = host.createShadowRoot();
assert_equals(host.shadowRoot, s2, 'attribute shadowRoot must return the youngest tree that has ' +
'the context object as its shadow host');
}, 'A_10_02_01_05_T01');
</script>
</body>
</html>

4
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/attributes/test-006.html
View file

@ -16,14 +16,14 @@ policies and contribution forms [3].
<meta name="assert" content="Extensions to Element Interface: shadowRoot of type ShadowRoot">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var host = d.createElement('div');
d.body.appendChild(host);

61
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/methods/elements-001.html
View file

@ -1,61 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: HTML elements can host shadow trees</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/#partial-element-methods">
<meta name="assert" content="All HTML elements must be able to host shadow trees.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
// These elements does not support creating shadow root.
// instead, NotSupportedError should be thrown.
// http://w3c.github.io/webcomponents/spec/shadow/#widl-Element-createShadowRoot-ShadowRoot-ShadowRootInit-shadowRootInitDict
var BLACK_LISTED_ELEMENTS = [
"button",
"details",
"input",
"marquee",
"meter",
"progress",
"select",
"textarea",
"keygen"
];
function testElement(elementName) {
var doc = document.implementation.createHTMLDocument('Test');
var element = doc.createElement(elementName);
doc.body.appendChild(element);
var shadowRoot = element.createShadowRoot();
assert_equals(shadowRoot.ownerDocument, doc);
}
var testParameters = HTML5_ELEMENT_NAMES.filter(function(name) {
return BLACK_LISTED_ELEMENTS.indexOf(name) == -1;
}).map(function (name) {
return [
'Checks whether an element "' + name + '" can create a shadow root.',
name
];
});
generate_tests(testElement, testParameters);
</script>
</body>
</html>

104
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/methods/non-element-nodes-001.html
View file

@ -1,104 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: Non-element node cannot be a shadow host</title>
<link rel="author" title="Aleksei Yu. Semenov" 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/#partial-element-methods">
<meta name="assert" content="Nodes, that are not elements, are not allowed to become shadow hosts.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var XHTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
function createTextNode() {
var doc = document.implementation.createHTMLDocument('Test Document');
var node = doc.createTextNode('Text Node');
doc.body.appendChild(node);
return node;
}
function createCommentNode() {
var doc = document.implementation.createHTMLDocument('Test Document');
var node = doc.createComment('Comment Node');
doc.body.appendChild(node);
return node;
}
function createCDATASectionNode() {
var doc = document.implementation.createDocument(XHTML_NAMESPACE, 'html');
var node = doc.createCDATASection('CDATA Section Node');
doc.documentElement.appendChild(node);
return node;
}
function createAttributeNode() {
var doc = document.implementation.createDocument(XHTML_NAMESPACE, 'html');
var node = doc.createAttribute('attribute-node');
doc.documentElement.setAttributeNode(node);
return node;
}
function createDocumentFragmentNode() {
var doc = document.implementation.createDocument(XHTML_NAMESPACE, 'html');
var node = doc.createDocumentFragment();
doc.documentElement.appendChild(node);
return node;
}
function createProcessingInstructionNode() {
var doc = document.implementation.createDocument(XHTML_NAMESPACE, 'html');
var node = doc.createProcessingInstruction('processing-instruction-node', '');
doc.documentElement.appendChild(node);
return node;
}
function createDocumentNode() {
return document.implementation.createDocument(XHTML_NAMESPACE, 'html');
}
var factories = [
['a text node', createTextNode],
['a comment node', createCommentNode],
['a CDATA section node', createCDATASectionNode],
['an attribute node', createAttributeNode],
['a document fragment node', createDocumentFragmentNode],
['a processing instruction node', createProcessingInstructionNode],
['a document node', createDocumentNode]
];
// Non-element nodes should not have createShadowRoot() method.
var noCreateShadowRootTestParameters = factories.map(
function (nameAndFactory) {
var name = nameAndFactory[0];
var factory = nameAndFactory[1];
return [
'Checks whether ' + name + ' does not have createShadowRoot() ' +
'method.',
factory
];
});
function testNoCreateShadowRoot(factory) {
var node = factory();
assert_equals(node.createShadowRoot, undefined);
}
generate_tests(testNoCreateShadowRoot, noCreateShadowRootTestParameters);
</script>
</body>
</html>

6
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/methods/test-001.html
View file

@ -16,14 +16,14 @@ policies and contribution forms [3].
<meta name="assert" content="Extensions to Element Interface: createShadowRoot method creates new instance of Shadow root object">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var host = d.createElement('div');
d.body.appendChild(host);
@ -31,7 +31,7 @@ test(function () {
var s = host.createShadowRoot();
assert_true(s instanceof ShadowRoot, 'createShadowRoot() method should create new instance ' +
'of ShadowRoot object');
'of ShadowRoot object');
}, 'A_10_02_02_01_T01');
</script>

7
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/methods/test-002.html
View file

@ -16,14 +16,15 @@ policies and contribution forms [3].
<meta name="assert" content="Extensions to Element Interface: createShadowRoot method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
@ -36,7 +37,7 @@ test(unit(function (ctx) {
// span should become invisible as shadow root content
assert_equals(span.offsetTop, 0, 'createShadowRoot() method should establish ' +
'the context object as the shadow host of the ShadowRoot object');
'the context object as the shadow host of the ShadowRoot object');
}), 'A_10_02_02_02_T01');
</script>

55
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-element-interface/methods/test-003.html
View file

@ -1,55 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_02_02_03</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/#shadow-aware-methods">
<meta name="assert" content="Extensions to Element Interface: createShadowRoot method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var span = d.createElement('span');
span.setAttribute('id', 'sp0');
span.innerHTML = 'Some text';
host.appendChild(span);
//old tree
var s1 = host.createShadowRoot();
s1.innerHTML = '<span id="sp1">Span 1</span>';
//young tree
var s2 = host.createShadowRoot();
s2.innerHTML = '<span id="sp2">Span 2</span>';
// span should become invisible as shadow root content
assert_equals(span.offsetTop, 0, 'Point 1:createShadowRoot() method should add ' +
'the ShadowRoot object at the top of the tree stack of its host');
assert_equals(s1.querySelector('#sp1').offsetTop, 0, 'Point 2:createShadowRoot() method should add ' +
'the ShadowRoot object at the top of the tree stack of its host');
assert_true(s2.querySelector('#sp2').offsetTop > 0, 'Point 3:createShadowRoot() method should add ' +
'the ShadowRoot object at the top of the tree stack of its host');
}), 'A_10_02_02_03_T01');
</script>
</body>
</html>

23
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-event-interface/event-path-001.html
View file

@ -13,15 +13,16 @@ policies and contribution forms [3].
<title>Shadow DOM Test - event path</title>
<link rel="author" title="Kazuhito Hokamura" href="mailto:k.hokamura@gmail.com">
<link rel="help" href="https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#extensions-to-event">
<meta name="assert" content="Extensions to Event Interface: event.path cross the shadow boundary">
<meta name="assert" content="Extensions to Event Interface: event.deepPath() cross the shadow boundary">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var t = async_test('event.path cross the shadow boundary');
var t = async_test('event.deepPath() cross the shadow boundary');
t.step(unit(function(ctx) {
var doc = newRenderedHTMLDocument(ctx);
@ -34,14 +35,14 @@ t.step(unit(function(ctx) {
shadowRoot.appendChild(child);
child.addEventListener('click', t.step_func(function(e) {
assert_equals(e.path.length, 7, 'path.length');
assert_equals(e.path[0], child, 'path[0] should be child');
assert_equals(e.path[1], shadowRoot, 'path[1] should be shadowRoot');
assert_equals(e.path[2], host, 'path[2] should be host');
assert_equals(e.path[3], doc.body, 'path[3] should be body');
assert_equals(e.path[4], doc.documentElement, 'path[4] should be html');
assert_equals(e.path[5], doc, 'path[5] should be document');
assert_equals(e.path[6], ctx.iframes[0].contentWindow, 'path[6] should be window');
assert_equals(e.deepPath().length, 7, 'deepPath().length');
assert_equals(e.deepPath()[0], child, 'deepPath()[0] should be child');
assert_equals(e.deepPath()[1], shadowRoot, 'deepPath()[1] should be shadowRoot');
assert_equals(e.deepPath()[2], host, 'deepPath()[2] should be host');
assert_equals(e.deepPath()[3], doc.body, 'deepPath()[3] should be body');
assert_equals(e.deepPath()[4], doc.documentElement, 'deepPath()[4] should be html');
assert_equals(e.deepPath()[5], doc, 'deepPath()[5] should be document');
assert_equals(e.deepPath()[6], ctx.iframes[0].contentWindow, 'deepPath()[6] should be window');
t.done();
}));

46
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/extensions-to-event-interface/event-path-002.html
View file

@ -1,46 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test - event path</title>
<link rel="author" title="Kazuhito Hokamura" href="mailto:k.hokamura@gmail.com">
<link rel="help" href="https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#extensions-to-event">
<meta name="assert" content="Extensions to Event Interface: event.path is readonly">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var t = async_test('event.path is readonly');
t.step(unit(function(ctx) {
var doc = newRenderedHTMLDocument(ctx);
var div = doc.createElement('div');
doc.body.appendChild(div);
div.addEventListener('click', t.step_func(function(e) {
var obj = {};
e.path = obj;
assert_not_equals(e.path, obj);
t.done();
}));
var event = doc.createEvent('HTMLEvents');
event.initEvent('click', true, false);
div.dispatchEvent(event);
}));
</script>
</body>
</html>

43
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/activeElement-confirm-return-null.html
View file

@ -17,18 +17,19 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: confirm activeElement return null">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
assert_equals(s.activeElement, null, 'activeElement attribute of the ShadowRoot must return null if there\'s no focused element');
@ -37,16 +38,16 @@ test(unit(function (ctx) {
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var inp = d.createElement('input');
d.body.appendChild(inp);
var inp = d.createElement('input');
d.body.appendChild(inp);
inp.focus();
inp.focus();
assert_equals(s.activeElement, null, 'activeElement attribute of the ShadowRoot must return null if there\'s no focused element in the shadow tree');
@ -55,19 +56,19 @@ test(unit(function (ctx) {
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var inp = d.createElement('input');
d.body.appendChild(inp);
var inp = d.createElement('input');
d.body.appendChild(inp);
var inp2 = d.createElement('input');
s.appendChild(inp2);
var inp2 = d.createElement('input');
s.appendChild(inp2);
inp.focus();
inp.focus();
assert_equals(s.activeElement, null, 'activeElement attribute of the ShadowRoot must return null if there\'s no focused element in the shadow tree');

29
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-007.html
View file

@ -16,32 +16,33 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: readonly attribute Element? activeElement; actual value">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
host.setAttribute('id', 'shRoot');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
host.setAttribute('id', 'shRoot');
d.body.appendChild(host);
var s = host.createShadowRoot();
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpId');
inp.setAttribute('value', 'Some text');
s.appendChild(inp);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpId');
inp.setAttribute('value', 'Some text');
s.appendChild(inp);
inp.focus();
inp.focus();
assert_true(s.activeElement != null, 'Point 1: activeElement attribute of the ShadowRoot ' +
'must return the currently focused element in the shadow tree');
'must return the currently focused element in the shadow tree');
assert_equals(s.activeElement.tagName, 'INPUT', 'Point 2: activeElement attribute of the ShadowRoot ' +
'must return the currently focused element in the shadow tree');
'must return the currently focused element in the shadow tree');
}), 'A_10_01_01_03_01_T01');
</script>

19
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-009.html
View file

@ -16,25 +16,26 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: innerHTML of type DOMString; Test getter">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var span = d.createElement('span');
span.innerHTML = 'Some text';
s.appendChild(span);
var span = d.createElement('span');
span.innerHTML = 'Some text';
s.appendChild(span);
assert_equals(s.innerHTML.toLowerCase(), '<span>some text</span>',
'Wrong value of ShadowRoot innerHTML attribute');
'Wrong value of ShadowRoot innerHTML attribute');
}), 'A_10_01_01_04_01_T01');
</script>

51
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-010.html
View file

@ -16,58 +16,59 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: innerHTML of type DOMString; Test setter">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var span = d.createElement('span');
span.innerHTML = 'Some text';
s.appendChild(span);
var span = d.createElement('span');
span.innerHTML = 'Some text';
s.appendChild(span);
s.innerHTML = '<input type="text"><div>new text</div>';
s.innerHTML = '<input type="text"><div>new text</div>';
assert_equals(s.innerHTML.toLowerCase(), '<input type="text"><div>new text</div>',
'Wrong value of ShadowRoot innerHTML attribute');
'Wrong value of ShadowRoot innerHTML attribute');
}), 'A_10_01_01_04_02_T01_01');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var span = d.createElement('span');
span.setAttribute('id', 'spanId');
span.innerHTML = 'Some text';
s.appendChild(span);
var span = d.createElement('span');
span.setAttribute('id', 'spanId');
span.innerHTML = 'Some text';
s.appendChild(span);
s.innerHTML = '<input type="text" id="inputId"><div id="divId">new text</div>';
s.innerHTML = '<input type="text" id="inputId"><div id="divId">new text</div>';
assert_equals(s.querySelector('#spanId'), null, 'Point 1:innerHTML attribute must replace all content of ' +
'the ShadowRoot object');
'the ShadowRoot object');
assert_true(s.querySelector('#inputId') != null, 'Point 2:innerHTML attribute must replace all content of ' +
'the ShadowRoot object');
'the ShadowRoot object');
assert_equals(s.querySelector('#inputId').getAttribute('id'), 'inputId',
'Point 3:innerHTML attribute must replace all content of the ShadowRoot object');
'Point 3:innerHTML attribute must replace all content of the ShadowRoot object');
assert_true(s.querySelector('#divId') != null, 'Point 3:innerHTML attribute must replace all content of ' +
'the ShadowRoot object');
assert_equals(s.querySelector('#divId').getAttribute('id'), 'divId',
'Point 4:innerHTML attribute must replace all content of the ShadowRoot object');
'the ShadowRoot object');
assert_equals(s.querySelector('#divId').getAttribute('id'), 'divId',
'Point 4:innerHTML attribute must replace all content of the ShadowRoot object');
}), 'A_10_01_01_04_02_T01_02');
</script>
</body>

27
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-011.html
View file

@ -16,20 +16,21 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: styleSheets of type StyleSheetList, readonly">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
assert_true(s.styleSheets != null, 'ShadowRoot styleSheets attribute shouldn\'t be null');
assert_true(s.styleSheets != null, 'ShadowRoot styleSheets attribute shouldn\'t be null');
assert_equals(s.styleSheets.length, 0, 'attribute must return the shadow root style sheets only');
}), 'A_10_01_01_05_01_T01');
@ -37,16 +38,16 @@ test(unit(function (ctx) {
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var style = d.createElement('style');
s.appendChild(style);
var style = d.createElement('style');
s.appendChild(style);
assert_true(s.styleSheets != null, 'ShadowRoot styleSheets attribute shouldn\'t be null');
assert_true(s.styleSheets != null, 'ShadowRoot styleSheets attribute shouldn\'t be null');
assert_equals(s.styleSheets.length, 1, 'attribute must return the shadow root style sheets');
}), 'A_10_01_01_05_01_T02');

13
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-012.html
View file

@ -16,21 +16,22 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: The nodeType attribute of a ShadowRoot instance must return DOCUMENT_FRAGMENT_NODE">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
assert_equals(s.nodeType, 11, 'The nodeType attribute of a ShadowRoot ' +
'instance must return DOCUMENT_FRAGMENT_NODE');
'instance must return DOCUMENT_FRAGMENT_NODE');
}), 'A_10_01_01_06_T01');
</script>

13
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-013.html
View file

@ -16,21 +16,22 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: The nodeName attribute of a ShadowRoot instance must return "#document-fragment".">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
assert_equals(s.nodeName, '#document-fragment', 'The nodeName attribute of a ShadowRoot instance ' +
'must return "#document-fragment".');
'must return "#document-fragment".');
}), 'A_10_01_01_07_T01');
</script>

48
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-attributes/test-014.html
View file

@ -1,48 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: ShadowRoot olderShadowRoot</title>
<link rel="author" title="Kenji Baheux" href="mailto:kenjibaheux@google.com">
<link rel="author" title="Kyohei Tsukuda" href="tsukuda.kyouhei@gmail.com">
<link rel="help" href="http://w3c.github.io/webcomponents/spec/shadow/#widl-ShadowRoot-olderShadowRoot">
<meta name="assert" content="The ShadowRoot element: olderShadowRoot attribute">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
// Shadow root and older Shadow root to play with
var oldRoot = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<span id="spandex">This is a shadow root content</span>' +
'<content><span id="contentId">This is the content fallback</span></content>';
oldRoot.appendChild(div);
var youngRoot = host.createShadowRoot();
assert_equals(oldRoot.olderShadowRoot, null, 'If the context object is the oldest shadow root, return null');
assert_equals(youngRoot.olderShadowRoot, oldRoot, 'Return the older shadow root relative to the context object');
}), 'ShadowRoot.olderShadowRoot_T01');
</script>
</body>
</html>

12
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-methods/test-001.html
View file

@ -16,14 +16,14 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: HTMLElement getElementById(DOMString elementId) method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var el = d.createElement('div');
d.body.appendChild(el);
@ -35,9 +35,9 @@ test(function () {
s.appendChild(child);
assert_true(s.getElementById('span_id') != null, 'Point 1: ShadowRoot getElementById() ' +
'method should return child element');
'method should return child element');
assert_equals(s.getElementById('span_id').getAttribute('id'), 'span_id', 'Point 2: ' +
'ShadowRoot getElementById() method should return child element');
'ShadowRoot getElementById() method should return child element');
}, 'A_10_01_02_01_T01');
@ -45,7 +45,7 @@ test(function () {
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var el = d.createElement('div');
d.body.appendChild(el);
@ -53,7 +53,7 @@ test(function () {
var s = el.createShadowRoot();
assert_true(s.getElementById('span_id') == null, ' ShadowRoot getElementById() ' +
'method should return null if matching element not found');
'method should return null if matching element not found');
}, 'A_10_01_02_01_T02');
</script>

27
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-methods/test-004.html
View file

@ -16,33 +16,34 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: Selection? getSelection() method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var span = d.createElement('span');
span.innerHTML = 'Some text';
s.appendChild(span);
var span = d.createElement('span');
span.innerHTML = 'Some text';
s.appendChild(span);
var range = d.createRange();
range.setStart(span.firstChild, 0);
range.setEnd(span.firstChild, 3);
var range = d.createRange();
range.setStart(span.firstChild, 0);
range.setEnd(span.firstChild, 3);
var selection = s.getSelection();
var selection = s.getSelection();
selection.removeAllRanges();
selection.addRange(range);
var sl = s.getSelection();
assert_equals(sl.toString(), 'Som', 'The getSelection() method of the shadow root object must return ' +
'the current selection in this shadow tree');
'the current selection in this shadow tree');
}), 'A_10_01_02_04_T01');
</script>

8
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-methods/test-006.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: Element? elementFromPoint(float x, float y) method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -29,10 +29,10 @@ test(function () {
d.body.appendChild(el);
try {
el.elementFromPoint(1, 1);
assert_true(false, 'TypeMismatchError should be thrown');
el.elementFromPoint(1, 1);
assert_true(false, 'TypeMismatchError should be thrown');
} catch(e) {
assert_true(e instanceof TypeError, 'Wrong error type');
assert_true(e instanceof TypeError, 'Wrong error type');
}
}, 'A_10_01_02_06_01_T01');

10
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-methods/test-007.html
View file

@ -16,14 +16,14 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: Element? elementFromPoint(float x, float y) method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var el = d.createElement('div');
d.body.appendChild(el);
@ -35,14 +35,14 @@ test(function () {
s.appendChild(span);
assert_equals(s.elementFromPoint(-1, 1), null, 'If x argument of elementFromPoint(x, y) is less ' +
'than zero then method shold return null');
'than zero then method shold return null');
}, 'A_10_01_02_06_02_T01');
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var el = d.createElement('div');
d.body.appendChild(el);
@ -54,7 +54,7 @@ test(function () {
s.appendChild(span);
assert_equals(s.elementFromPoint(1, -1), null, 'If y argument of elementFromPoint(x, y) is less ' +
'than zero then method shold return null');
'than zero then method shold return null');
}, 'A_10_01_02_06_02_T02');
</script>

25
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/shadowroot-object/shadowroot-methods/test-010.html
View file

@ -16,25 +16,26 @@ policies and contribution forms [3].
<meta name="assert" content="ShadowRoot Object: Invoking the cloneNode() method on a ShadowRoot instance must always throw a DATA_CLONE_ERR exception.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../../testcommon.js"></script>
<script src="../../../../../html/resources/common.js"></script>
<script src="../../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
var host = d.createElement('div');
d.body.appendChild(host);
var s = host.createShadowRoot();
try {
s.cloneNode();
assert_true(false, 'Invoking the cloneNode() method on a ShadowRoot instance must always ' +
'throw a DATA_CLONE_ERR exception.');
} catch (e) {
assert_equals(e.code, 25, 'Wrong exceprion type');
}
try {
s.cloneNode();
assert_true(false, 'Invoking the cloneNode() method on a ShadowRoot instance must always ' +
'throw a DATA_CLONE_ERR exception.');
} catch (e) {
assert_equals(e.code, 25, 'Wrong exceprion type');
}
}), 'A_10_01_02_09_T01');
</script>
</body>

81
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-content-html-element/test-001.html
View file

@ -1,81 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_04_01</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/#content-element">
<meta name="assert" content="The content HTML element: fallback content">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select=".clazz"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content should be rendered');
}), 'A_10_04_01_T01');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select=".shadow"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_equals(s.querySelector('#spandex').offsetTop, 0, 'Fallback content should not be rendered');
}), 'A_10_04_01_T02');
</script>
</body>
</html>

97
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-content-html-element/test-002.html
View file

@ -1,97 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_04_02</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/#content-element">
<meta name="assert" content="The content HTML element: select attribute">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select=".shadow"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_equals(s.querySelector('#spandex').offsetTop, 0, 'Fallback content should not be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 1: Element should not be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 2: Element should not be rendered');
assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 3: Element should not be rendered');
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 11: Element should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 12: Element should be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 13: Element should be rendered');
}), 'A_10_04_02_T01_01');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select=".shadow, #li4"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_equals(s.querySelector('#spandex').offsetTop, 0, 'Fallback content should not be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 1: Element should not be rendered');
assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 2: Element should not be rendered');
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 11: Element should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 12: Element should be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 13: Element should be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 14: Element should be rendered');
}), 'A_10_04_02_T01_02');
</script>
</body>
</html>

129
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-content-html-element/test-003.html
View file

@ -1,129 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_04_03</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/#content-element">
<meta name="assert" content="The content HTML element: invalid select attribute">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select="&@()"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content should be rendered');
assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Element should not be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Element should not be rendered');
assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Element should not be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Element should not be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Element should not be rendered');
assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 6: Element should not be rendered');
}), 'A_10_04_03_T01');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select=".shadow, &@()"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content should be rendered');
assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Element should not be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Element should not be rendered');
assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Element should not be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Element should not be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Element should not be rendered');
assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 6: Element should not be rendered');
}), 'A_10_04_03_T02');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content select=".shadow, &@(), #li4"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_true(s.querySelector('#spandex').offsetTop > 0, 'Fallback content should be rendered');
assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Element should not be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Element should not be rendered');
assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Element should not be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Element should not be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Element should not be rendered');
assert_equals(d.querySelector('#li6').offsetTop, 0, 'Point 6: Element should not be rendered');
}), 'A_10_04_03_T03');
</script>
</body>
</html>

93
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-content-html-element/test-005.html
View file

@ -1,93 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_04_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/#content-element">
<meta name="assert" content="The content HTML element: reset-style-inheritance attribute">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul id="shHost">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var defHeight1 = d.querySelector('#li1').offsetHeight;
var defHeight2 = d.querySelector('#li2').offsetHeight;
var defHeight3 = d.querySelector('#li3').offsetHeight;
var defHeight4 = d.querySelector('#li4').offsetHeight;
var defHeight5 = d.querySelector('#li5').offsetHeight;
var defHeight6 = d.querySelector('#li6').offsetHeight;
assert_true(defHeight1 > 0, 'Point 1: Element height should be greater than zero');
assert_true(defHeight2 > 0, 'Point 2: Element height should be greater than zero');
assert_true(defHeight3 > 0, 'Point 3: Element height should be greater than zero');
assert_true(defHeight4 > 0, 'Point 4: Element height should be greater than zero');
assert_true(defHeight5 > 0, 'Point 5: Element height should be greater than zero');
assert_true(defHeight6 > 0, 'Point 6: Element height should be greater than zero');
var host = d.querySelector('#shHost');
d.body.setAttribute('style', 'font-size: 30px');
var height1 = d.querySelector('#li1').offsetHeight;
var height2 = d.querySelector('#li2').offsetHeight;
var height3 = d.querySelector('#li3').offsetHeight;
var height4 = d.querySelector('#li4').offsetHeight;
var height5 = d.querySelector('#li5').offsetHeight;
var height6 = d.querySelector('#li6').offsetHeight;
assert_true(height1 > defHeight1, 'Point 11: Element height should be changed');
assert_true(height2 > defHeight2, 'Point 12: Element height should be changed');
assert_true(height3 > defHeight3, 'Point 13: Element height should be changed');
assert_true(height4 > defHeight4, 'Point 14: Element height should be changed');
assert_true(height5 > defHeight5, 'Point 15: Element height should be changed');
assert_true(height6 > defHeight6, 'Point 16: Element height should be changed');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML ='<ul><content select=".shadow"></content></ul>';
s.appendChild(div);
assert_equals(d.querySelector('#li1').offsetHeight, height1, 'Point 21: Inherited ' +
'element style should be reset');
assert_equals(d.querySelector('#li3').offsetHeight, height3, 'Point 22: Inherited ' +
'element style should be reset');
assert_equals(d.querySelector('#li5').offsetHeight, height5, 'Point 23: Inherited ' +
'element style should be reset');
assert_equals(d.querySelector('#li2').offsetHeight, 0, 'Point 24: Element shouldn\'t be rendered');
assert_equals(d.querySelector('#li4').offsetHeight, 0, 'Point 25: Element shouldn\'t be rendered');
assert_equals(d.querySelector('#li6').offsetHeight, 0, 'Point 26: Element shouldn\'t be rendered');
}), 'A_10_04_05_T01');
</script>
</body>
</html>

93
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-content-html-element/test-006.html
View file

@ -1,93 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_04_06</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/#content-element">
<meta name="assert" content="The content HTML element: getDistributedNodes method">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content id="contentId" select=".clazz"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_equals(s.querySelector('#contentId').getDistributedNodes().length, 1,
'Fallback content should show up as distributed nodes');
assert_equals(s.querySelector('#contentId').getDistributedNodes()[0].id, 'spandex',
'Fallback content should show up as distributed nodes');
}), 'A_10_04_06_T01');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul class="cls">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('.cls');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<ul><content id="contentId" select=".shadow"><span id="spandex">This is fallback content</span></content></ul>';
s.appendChild(div);
assert_equals(s.querySelector('#contentId').getDistributedNodes().length, 3,
'Wrond distributed nodes collection size');
assert_equals(s.querySelector('#contentId').getDistributedNodes()[0].getAttribute('id'), 'li1',
'Point 1: wrong element in distributed nodes collection');
assert_equals(s.querySelector('#contentId').getDistributedNodes()[1].getAttribute('id'), 'li3',
'Point 2: wrong element in distributed nodes collection');
assert_equals(s.querySelector('#contentId').getDistributedNodes()[2].getAttribute('id'), 'li5',
'Point 3: wrong element in distributed nodes collection');
}), 'A_10_04_06_T02');
</script>
</body>
</html>

65
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-shadow-html-element/test-001.html
View file

@ -1,65 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_05_01</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/#shadow-element">
<meta name="assert" content="The shadow HTML element: fallback content">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<span id="spandex">This is a shadow root content</span>' +
'<shadow><span id="shadowId">This is a shadow fallback content</span></shadow>';
s.appendChild(div);
assert_true(s.querySelector('#shadowId').offsetTop == 0, 'Shadow fallback content should not be rendered in this case');
}), 'A_10_05_01_T01');
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<span id="spandex">This is a shadow root content</span>' +
'<content><span id="contentId">This is a content fallback</span></content>';
s.appendChild(div);
assert_true(s.querySelector('#contentId').offsetTop > 0, 'Fallback content should be rendered');
}), 'A_10_05_01_T02');
</script>
</body>
</html>

50
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-shadow-html-element/test-002.html
View file

@ -1,50 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_05_02</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/#shadow-element">
<meta name="assert" content="The shadow HTML element: shadow insertion point">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
d.body.appendChild(host);
//old tree
var s1 = host.createShadowRoot();
s1.innerHTML = '<span id="sp1">This is an old tree</span>';
//young tree
var s2 = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML = '' +
'<span id="spandex">This is a shadow root content</span>' +
'<shadow><span id="shadowId">This is a shadow fallback content</span></shadow>';
s2.appendChild(div);
assert_equals(s2.querySelector('#shadowId').offsetTop, 0, 'Fallback content should not be rendered');
assert_true(s1.querySelector('#sp1').offsetTop > 0, 'Old tree should be rendered');
assert_true(s2.querySelector('#spandex').offsetTop > 0, 'Element should be rendered');
}), 'A_10_05_02_T01');
</script>
</body>
</html>

106
tests/wpt/web-platform-tests/shadow-dom/untriaged/elements-and-dom-objects/the-shadow-html-element/test-004.html
View file

@ -1,106 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_10_05_04</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/#shadow-element">
<meta name="assert" content="The shadow HTML element: no reset-style-inheritance attribute">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
// test no reset-style-inheritance
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML =
'<ul id="shHost">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var defHeight1 = d.querySelector('#li1').offsetHeight;
var defHeight2 = d.querySelector('#li2').offsetHeight;
var defHeight3 = d.querySelector('#li3').offsetHeight;
var defHeight4 = d.querySelector('#li4').offsetHeight;
var defHeight5 = d.querySelector('#li5').offsetHeight;
var defHeight6 = d.querySelector('#li6').offsetHeight;
assert_true(defHeight1 > 0, 'Point 1: Element height should be greater than zero');
assert_true(defHeight2 > 0, 'Point 2: Element height should be greater than zero');
assert_true(defHeight3 > 0, 'Point 3: Element height should be greater than zero');
assert_true(defHeight4 > 0, 'Point 4: Element height should be greater than zero');
assert_true(defHeight5 > 0, 'Point 5: Element height should be greater than zero');
assert_true(defHeight6 > 0, 'Point 6: Element height should be greater than zero');
var host = d.querySelector('#shHost');
d.body.setAttribute('style', 'font-size: 30px');
var height1 = d.querySelector('#li1').offsetHeight;
var height2 = d.querySelector('#li2').offsetHeight;
var height3 = d.querySelector('#li3').offsetHeight;
var height4 = d.querySelector('#li4').offsetHeight;
var height5 = d.querySelector('#li5').offsetHeight;
var height6 = d.querySelector('#li6').offsetHeight;
assert_true(height1 > defHeight1, 'Point 11: Element height should be changed');
assert_true(height2 > defHeight2, 'Point 12: Element height should be changed');
assert_true(height3 > defHeight3, 'Point 13: Element height should be changed');
assert_true(height4 > defHeight4, 'Point 14: Element height should be changed');
assert_true(height5 > defHeight5, 'Point 15: Element height should be changed');
assert_true(height6 > defHeight6, 'Point 16: Element height should be changed');
//Shadow root to play with
var s = host.createShadowRoot();
var div = d.createElement('div');
div.innerHTML ='<ul><content select=".shadow"></content></ul>';
s.appendChild(div);
assert_equals(d.querySelector('#li1').offsetHeight, height1, 'Point 21: Element height should not be changed');
assert_equals(d.querySelector('#li3').offsetHeight, height3, 'Point 22: Element height should not be changed');
assert_equals(d.querySelector('#li5').offsetHeight, height5, 'Point 23: Element height should not be changed');
assert_equals(d.querySelector('#li2').offsetHeight, 0, 'Point 24: Element shouldn\'t be rendered');
assert_equals(d.querySelector('#li4').offsetHeight, 0, 'Point 25: Element shouldn\'t be rendered');
assert_equals(d.querySelector('#li6').offsetHeight, 0, 'Point 26: Element shouldn\'t be rendered');
//Young tree
var s2 = host.createShadowRoot();
var div2 = d.createElement('div');
div2.innerHTML = '<shadow></shadow>';
s2.appendChild(div2);
//styles should be reset
assert_equals(d.querySelector('#li1').offsetHeight, height1, 'Point 31: Inherited ' +
'element style should not be reset');
assert_equals(d.querySelector('#li3').offsetHeight, height3, 'Point 32: Inherited ' +
'element style should not be reset');
assert_equals(d.querySelector('#li5').offsetHeight, height5, 'Point 33: Inherited ' +
'element style should not be reset');
}), 'A_10_05_04_T01');
</script>
</body>
</html>

119
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-dispatch/test-001.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Event Dispatch: At the time of event dispatch:The Event target and currentTarget attributes must return the relative target for the node on which event listeners are invoked">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -36,13 +37,13 @@ A_05_05_01_T01.step(unit(function (ctx) {
//For #volume-slider-thumb relative target #volume-slider-thumb
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').addEventListener('click',
A_05_05_01_T01.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider-thumb',
'Point 1: Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider-thumb',
'Point 1: Wrong currentTarget');
}), false);
A_05_05_01_T01.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider-thumb',
'Point 1: Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider-thumb',
'Point 1: Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
@ -69,13 +70,13 @@ A_05_05_01_T02.step(unit(function (ctx) {
//For #volume-shadow-root relative target #volume-slider-thumb
roots.volumeShadowRoot.addEventListener('click',
A_05_05_01_T02.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider-thumb',
'Wrong target');
assert_true(event.currentTarget == roots.volumeShadowRoot,
'Wrong currentTarget');
}), false);
A_05_05_01_T02.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider-thumb',
'Wrong target');
assert_true(event.currentTarget == roots.volumeShadowRoot,
'Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
@ -102,19 +103,19 @@ A_05_05_01_T03.step(unit(function (ctx) {
//For #volume-slider relative target #volume-shadow-host
roots.playerShadowRoot.querySelector('#volume-slider').addEventListener('click',
A_05_05_01_T03.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider',
'Wrong currentTarget');
}), false);
A_05_05_01_T03.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider',
'Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').dispatchEvent(event);
assert_true(invoked, 'Event listener was not invoked');
assert_true(invoked, 'Event listener was not invoked');
A_05_05_01_T03.done();
}));
@ -136,21 +137,21 @@ A_05_05_01_T04.step(unit(function (ctx) {
//For #volume-slider-container relative target #volume-shadow-host
roots.playerShadowRoot.querySelector('#volume-slider-container').addEventListener('click',
A_05_05_01_T04.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider-container',
'Wrong currentTarget');
}), false);
A_05_05_01_T04.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider-container',
'Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').dispatchEvent(event);
assert_true(invoked, 'Event listener was not invoked');
assert_true(invoked, 'Event listener was not invoked');
A_05_05_01_T04.done();
A_05_05_01_T04.done();
}));
@ -169,21 +170,21 @@ A_05_05_01_T05.step(unit(function (ctx) {
//For #controls relative target #volume-shadow-host
roots.playerShadowRoot.querySelector('#controls').addEventListener('click',
A_05_05_01_T05.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'controls',
'Wrong currentTarget');
}), false);
A_05_05_01_T05.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'controls',
'Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').dispatchEvent(event);
assert_true(invoked, 'Event listener was not invoked');
assert_true(invoked, 'Event listener was not invoked');
A_05_05_01_T05.done();
A_05_05_01_T05.done();
}));
@ -202,21 +203,21 @@ A_05_05_01_T06.step(unit(function (ctx) {
//For #player-shadow-host relative target #player-shadow-host
d.querySelector('#player-shadow-host').addEventListener('click',
A_05_05_01_T06.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'player-shadow-host',
'Wrong currentTarget');
}), false);
A_05_05_01_T06.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'player-shadow-host',
'Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').dispatchEvent(event);
assert_true(invoked, 'Event listener was not invoked');
assert_true(invoked, 'Event listener was not invoked');
A_05_05_01_T06.done();
A_05_05_01_T06.done();
}));
@ -236,21 +237,21 @@ A_05_05_01_T07.step(unit(function (ctx) {
//For #player relative target #player-shadow-host
d.querySelector('#player').addEventListener('click',
A_05_05_01_T07.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'player',
'Wrong currentTarget');
}), false);
A_05_05_01_T07.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong target');
assert_equals(event.currentTarget.getAttribute('id'), 'player',
'Wrong currentTarget');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ('click', true, false);
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').dispatchEvent(event);
assert_true(invoked, 'Event listener was not invoked');
assert_true(invoked, 'Event listener was not invoked');
A_05_05_01_T07.done();
A_05_05_01_T07.done();
}));
</script>
</body>

13
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-dispatch/test-002.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Event Dispatch: The MouseEvent relatedTarget attribute must return the adjusted related target">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -36,11 +37,11 @@ A_05_05_02_T01.step(unit(function (ctx) {
//For #volume-shadow-root adjusted related target #volume-shadow-root
roots.volumeShadowRoot.addEventListener('mouseover',
A_05_05_02_T01.step_func(function(event) {
invoked = true;
assert_true(event.relatedTarget === roots.volumeShadowRoot,
'Wrong relatedTarget');
}), false);
A_05_05_02_T01.step_func(function(event) {
invoked = true;
assert_true(event.relatedTarget === roots.volumeShadowRoot,
'Wrong relatedTarget');
}), false);

27
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-dispatch/test-003.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Event Path Trimming: In cases where both relatedTarget and target of a trusted event are part of the same shadow tree, the conforming UAs must stop events at the shadow root to avoid the appearance of spurious mouseover and mouseout events firing from the same node.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -44,20 +45,20 @@ A_05_05_03_T01.step(unit(function (ctx) {
s.appendChild(input2);
input1.addEventListener('focusin', A_05_05_03_T01.step_func(function(event) {
assert_equals(event.deepPath.length, 7);
assert_equals(event.deepPath[0].id, 'input1');
assert_equals(event.deepPath[1].id, 'shadow');
assert_equals(event.deepPath[2].id, 'host');
assert_equals(event.deepPath[3].tagName, 'BODY');
assert_equals(event.deepPath[4].tagName, 'HTML');
assert_equals(event.deepPath[5], d);
assert_equals(event.deepPath[6], ctx.iframes[0].contentWindow);
assert_equals(event.deepPath().length, 7);
assert_equals(event.deepPath()[0].id, 'input1');
assert_equals(event.deepPath()[1].id, 'shadow');
assert_equals(event.deepPath()[2].id, 'host');
assert_equals(event.deepPath()[3].tagName, 'BODY');
assert_equals(event.deepPath()[4].tagName, 'HTML');
assert_equals(event.deepPath()[5], d);
assert_equals(event.deepPath()[6], ctx.iframes[0].contentWindow);
}), false);
input2.addEventListener('focusin', A_05_05_03_T01.step_func(function(event) {
assert_equals(event.deepPath.length, 2);
assert_equals(event.deepPath[0].id, 'input2');
assert_equals(event.deepPath[1].id, 'shadow');
assert_equals(event.deepPath().length, 2);
assert_equals(event.deepPath()[0].id, 'input2');
assert_equals(event.deepPath()[1].id, 'shadow');
A_05_05_03_T01.done();
}), false);
@ -69,7 +70,7 @@ A_05_05_03_T01.step(unit(function (ctx) {
// In this case, original relatedTarget is #input1, and original target
// is #input2.
// It should be viewed outside the shadow as "target == relatedTarget"
// after event retargeting, therefore, event.deepPath above the shadow
// after event retargeting, therefore, event.deepPath() above the shadow
// host will be trimmed.
// Expected event path for #input2:
// <input>, #shadow-root

50
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-retargeting/test-001.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<meta name="assert" content="Event Retargeting:test that event.target is retargeted when event crosses shadow boundary and vice versa">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -31,23 +31,23 @@ A_05_01_01_T1.step(function () {
iframe.onload = A_05_01_01_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var div = d.createElement('div');
d.body.appendChild(div);
var d = iframe.contentDocument;
var div = d.createElement('div');
d.body.appendChild(div);
var s = div.createShadowRoot();
var s = div.createShadowRoot();
var div2 = d.createElement('div');
s.appendChild(div2);
var div2 = d.createElement('div');
s.appendChild(div2);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpid');
div2.appendChild(inp);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpid');
div2.appendChild(inp);
div2.addEventListener('click', A_05_01_01_T1.step_func(function (event) {
div2.addEventListener('click', A_05_01_01_T1.step_func(function (event) {
assert_equals(event.target.tagName, 'INPUT', 'Information about target of the event that ' +
'doesn\'t cross the shadow boundaries should not be adjusted');
'doesn\'t cross the shadow boundaries should not be adjusted');
}), false);
var event = d.createEvent('HTMLEvents');
@ -72,24 +72,24 @@ A_05_01_01_T2.step(function () {
iframe.onload = A_05_01_01_T2.step_func(function () {
try {
var d = iframe.contentDocument;
var d = iframe.contentDocument;
var div = d.createElement('div');
d.body.appendChild(div);
var div = d.createElement('div');
d.body.appendChild(div);
var s = div.createShadowRoot();
var s = div.createShadowRoot();
var div2 = d.createElement('div');
s.appendChild(div2);
var div2 = d.createElement('div');
s.appendChild(div2);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpid');
div2.appendChild(inp);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpid');
div2.appendChild(inp);
div.addEventListener('click', A_05_01_01_T2.step_func(function (event) {
div.addEventListener('click', A_05_01_01_T2.step_func(function (event) {
assert_equals(event.target.tagName, 'DIV', 'Information about event target crossing ' +
'the shadow boundaries should be adjusted');
'the shadow boundaries should be adjusted');
}), false);
var event = d.createEvent('HTMLEvents');

59
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-retargeting/test-002.html
View file

@ -1,59 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_05_01_02</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/#event-retargeting">
<meta name="assert" content="Event Retargeting:Event retargeting for document nodes distributed among insertion points">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_05_01_02_T1 = async_test('A_05_01_02_T1');
A_05_01_02_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_05_01_02_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
//make shadow subtree
var div = document.createElement('div');
div.innerHTML = '<ul id="ip_wrapper"><content select=".shadow"></content></ul>';
s.appendChild(div);
d.body.addEventListener('click', A_05_01_02_T1.step_func(function (event) {
assert_equals(event.target.tagName, 'LI', 'Incorrect target');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ("click", true, false);
d.querySelector('#li3').dispatchEvent(event);
} finally {
iframe.parentNode.removeChild(iframe);
}
A_05_01_02_T1.done();
});
});
</script>
</body>
</html>

27
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-retargeting/test-003.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Event Retargeting:Event retargeting for fallback content">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,16 +25,16 @@ policies and contribution forms [3].
var A_05_01_03_T01 = async_test('A_05_01_03_T01');
A_05_01_03_T01.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
d.body.innerHTML = '' +
'<div id="main">' +
'<div id="shadow-root">' +
'<span>1</span>' +
'<span>2</span>' +
'<span>3</span>' +
'</div>' +
'</div>';
'<div id="main">' +
'<div id="shadow-root">' +
'<span>1</span>' +
'<span>2</span>' +
'<span>3</span>' +
'</div>' +
'</div>';
var ul = d.querySelector('#shadow-root');
var s = ul.createShadowRoot();
@ -43,17 +44,17 @@ A_05_01_03_T01.step(unit(function (ctx) {
div.innerHTML = '<content select=".shadow"><span id="flbk">Fallback item</span></content>';
s.appendChild(div);
d.body.addEventListener('click', A_05_01_03_T01.step_func(function (event) {
d.body.addEventListener('click', A_05_01_03_T01.step_func(function (event) {
assert_equals(event.target.getAttribute('id'), 'shadow-root', 'Information about ' +
'event target crossing the shadow boundaries should be adjusted for the fallback ' +
'content');
'event target crossing the shadow boundaries should be adjusted for the fallback ' +
'content');
}), false);
var event = d.createEvent('HTMLEvents');
event.initEvent ("click", true, false);
s.querySelector('#flbk').dispatchEvent(event);
A_05_01_03_T01.done();
A_05_01_03_T01.done();
}));
</script>
</body>

149
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/event-retargeting/test-004.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Event Retargeting:Retargeting algorithm">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,18 +25,18 @@ policies and contribution forms [3].
var A_05_01_04_T01 = async_test('A_05_01_04_T01');
A_05_01_04_T01.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
//For #volume-slider-thumb relative target is #volume-slider-thumb
roots.volumeShadowRoot.querySelector('#volume-slider-thumb').addEventListener('click',
A_05_01_04_T01.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider-thumb',
'Wrong related target');
A_05_01_04_T01.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider-thumb',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -44,7 +45,7 @@ A_05_01_04_T01.step(unit(function (ctx) {
assert_true(invoked, 'Event listener was not invoked');
A_05_01_04_T01.done();
A_05_01_04_T01.done();
}));
@ -52,8 +53,8 @@ A_05_01_04_T01.step(unit(function (ctx) {
var A_05_01_04_T02 = async_test('A_05_01_04_T02');
A_05_01_04_T02.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -61,10 +62,10 @@ A_05_01_04_T02.step(unit(function (ctx) {
//For #volume-shadow-host relative target is #volume-shadow-host
roots.playerShadowRoot.querySelector('#volume-shadow-host').addEventListener('click',
A_05_01_04_T02.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
A_05_01_04_T02.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -82,8 +83,8 @@ A_05_01_04_T02.step(unit(function (ctx) {
var A_05_01_04_T03 = async_test('A_05_01_04_T03');
A_05_01_04_T03.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -91,10 +92,10 @@ A_05_01_04_T03.step(unit(function (ctx) {
//For #volume-slider relative target is #volume-shadow-host
roots.playerShadowRoot.querySelector('#volume-slider').addEventListener('click',
A_05_01_04_T03.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
A_05_01_04_T03.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -110,8 +111,8 @@ A_05_01_04_T03.step(unit(function (ctx) {
var A_05_01_04_T04 = async_test('A_05_01_04_T04');
A_05_01_04_T04.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -119,10 +120,10 @@ A_05_01_04_T04.step(unit(function (ctx) {
//For #volume-slider-container relative target is #volume-shadow-host
roots.playerShadowRoot.querySelector('#volume-slider-container').addEventListener('click',
A_05_01_04_T04.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
A_05_01_04_T04.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -138,8 +139,8 @@ A_05_01_04_T04.step(unit(function (ctx) {
var A_05_01_04_T05 = async_test('A_05_01_04_T05');
A_05_01_04_T05.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -147,10 +148,10 @@ A_05_01_04_T05.step(unit(function (ctx) {
//For #controls relative target is #volume-shadow-host
roots.playerShadowRoot.querySelector('#controls').addEventListener('click',
A_05_01_04_T05.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
A_05_01_04_T05.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -166,8 +167,8 @@ A_05_01_04_T05.step(unit(function (ctx) {
var A_05_01_04_T06 = async_test('A_05_01_04_T06');
A_05_01_04_T06.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -175,10 +176,10 @@ A_05_01_04_T06.step(unit(function (ctx) {
//For #player-shadow-host relative target is #player-shadow-host
roots.playerShadowRoot.addEventListener('click',
A_05_01_04_T06.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
A_05_01_04_T06.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -195,8 +196,8 @@ A_05_01_04_T06.step(unit(function (ctx) {
var A_05_01_04_T07 = async_test('A_05_01_04_T07');
A_05_01_04_T07.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -204,10 +205,10 @@ A_05_01_04_T07.step(unit(function (ctx) {
//For #player relative target is #player-shadow-host
d.querySelector('#player').addEventListener('click',
A_05_01_04_T07.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong related target');
A_05_01_04_T07.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -223,8 +224,8 @@ A_05_01_04_T07.step(unit(function (ctx) {
var A_05_01_04_T08 = async_test('A_05_01_04_T08');
A_05_01_04_T08.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -232,10 +233,10 @@ A_05_01_04_T08.step(unit(function (ctx) {
//For #volume-slider relative target is #volume-slider
roots.playerShadowRoot.querySelector('#volume-slider').addEventListener('click',
A_05_01_04_T08.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
A_05_01_04_T08.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -251,8 +252,8 @@ A_05_01_04_T08.step(unit(function (ctx) {
var A_05_01_04_T09 = async_test('A_05_01_04_T09');
A_05_01_04_T09.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -260,10 +261,10 @@ A_05_01_04_T09.step(unit(function (ctx) {
//For #volume-slider-container relative target is #volume-slider
roots.playerShadowRoot.querySelector('#volume-slider-container').addEventListener('click',
A_05_01_04_T09.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
A_05_01_04_T09.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -279,8 +280,8 @@ A_05_01_04_T09.step(unit(function (ctx) {
var A_05_01_04_T10 = async_test('A_05_01_04_T10');
A_05_01_04_T10.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -288,10 +289,10 @@ A_05_01_04_T10.step(unit(function (ctx) {
//For #controls relative target is #volume-slider
roots.playerShadowRoot.querySelector('#controls').addEventListener('click',
A_05_01_04_T10.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
A_05_01_04_T10.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -307,8 +308,8 @@ A_05_01_04_T10.step(unit(function (ctx) {
var A_05_01_04_T11 = async_test('A_05_01_04_T11');
A_05_01_04_T11.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -316,10 +317,10 @@ A_05_01_04_T11.step(unit(function (ctx) {
//For #player-shadow-root relative target is #volume-slider
roots.playerShadowRoot.addEventListener('click',
A_05_01_04_T11.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
A_05_01_04_T11.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');
@ -336,8 +337,8 @@ A_05_01_04_T11.step(unit(function (ctx) {
var A_05_01_04_T12 = async_test('A_05_01_04_T12');
A_05_01_04_T12.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
var d = newRenderedHTMLDocument(ctx);
var invoked = false;
roots = createTestMediaPlayer(d);
//expected result of what relative target should be see
@ -345,10 +346,10 @@ A_05_01_04_T12.step(unit(function (ctx) {
//For #player relative target is #player-shadow-host
d.querySelector('#player').addEventListener('click',
A_05_01_04_T12.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong related target');
A_05_01_04_T12.step_func(function (event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
'Wrong related target');
}), false);
var event = d.createEvent('HTMLEvents');

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-001.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-002.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-003.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-004.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-005.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-006.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-007.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-008.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

3
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/events-created-by-users-do-not-stop/test-009.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="The following events must not be stopped at the nearest shadow boundary if created by users: abort, error, select, change, load, reset, resize, scroll, selectstart">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>

227
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/retargeting-focus-events/test-001.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Retargeting focus events:The focus, DOMFocusIn, blur, and DOMFocusOut events must be treated in the same way as events with a relatedTarget, where the corresponding node that is losing focus as a result of target gaining focus or the node that is gaining focus, and thus causing the blurring of target acts as the related target">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -50,11 +51,11 @@ A_05_03_01_T01.step(unit(function (ctx) {
d.body.appendChild(inp2);
s.addEventListener('DOMFocusOut', A_05_03_01_T01.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadow tree: Wrong target');
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadow tree: Wrong target');
}), false);
d.body.addEventListener('DOMFocusOut', A_05_03_01_T01.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'host', 'Inside shadow tree: Wrong target');
assert_equals(event.target.getAttribute('id'), 'host', 'Inside shadow tree: Wrong target');
}), false);
inp1.focus();
@ -92,11 +93,11 @@ A_05_03_01_T02.step(unit(function (ctx) {
inp2.focus();
s.addEventListener('DOMFocusIn', A_05_03_01_T02.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadoe tree: Wrong target');
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadoe tree: Wrong target');
}), false);
d.body.addEventListener('DOMFocusIn', A_05_03_01_T02.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'host', 'Outside shadow tree: Wrong target');
assert_equals(event.target.getAttribute('id'), 'host', 'Outside shadow tree: Wrong target');
}), false);
inp1.focus();
@ -135,7 +136,7 @@ A_05_03_01_T03.step(unit(function (ctx) {
inp1.focus();
d.body.addEventListener('DOMFocusIn', A_05_03_01_T03.step_func(function(event) {
assert_true(false, 'Event should be stopped at Shadow boundary');
assert_true(false, 'Event should be stopped at Shadow boundary');
}), false);
inp2.focus();
@ -152,35 +153,35 @@ var A_05_03_01_T04 = async_test('A_05_03_01_T04');
A_05_03_01_T04.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
host.setAttribute('style', 'height:50%; width:100%');
host.setAttribute('id', 'host');
d.body.appendChild(host);
var host = d.createElement('div');
host.setAttribute('style', 'height:50%; width:100%');
host.setAttribute('id', 'host');
d.body.appendChild(host);
//Shadow root to play with
var s = host.createShadowRoot();
//Shadow root to play with
var s = host.createShadowRoot();
var inp1 = d.createElement('input');
inp1.setAttribute('id', 'inp1');
inp1.setAttribute('type', 'checkbox');
s.appendChild(inp1);
var inp1 = d.createElement('input');
inp1.setAttribute('id', 'inp1');
inp1.setAttribute('type', 'checkbox');
s.appendChild(inp1);
var inp2 = d.createElement('input');
inp2.setAttribute('id', 'inp2');
inp2.setAttribute('type', 'checkbox');
s.appendChild(inp2);
var inp2 = d.createElement('input');
inp2.setAttribute('id', 'inp2');
inp2.setAttribute('type', 'checkbox');
s.appendChild(inp2);
inp1.focus();
inp1.focus();
d.body.addEventListener('DOMFocusOut', A_05_03_01_T04.step_func(function(event) {
assert_true(false, 'Event should be stopped at Shadow boundary');
}), false);
d.body.addEventListener('DOMFocusOut', A_05_03_01_T04.step_func(function(event) {
assert_true(false, 'Event should be stopped at Shadow boundary');
}), false);
inp2.focus();
inp2.focus();
A_05_03_01_T04.done();
A_05_03_01_T04.done();
}));
@ -192,63 +193,63 @@ var A_05_03_01_T05 = async_test('A_05_03_01_T05');
A_05_03_01_T05.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
host.setAttribute('id', 'host');
d.body.appendChild(host);
var host = d.createElement('div');
host.setAttribute('id', 'host');
d.body.appendChild(host);
var inp1 = d.createElement('input');
inp1.setAttribute('id', 'inp1');
inp1.setAttribute('type', 'checkbox');
inp1.setAttribute('class', 'clazz1');
host.appendChild(inp1);
var inp1 = d.createElement('input');
inp1.setAttribute('id', 'inp1');
inp1.setAttribute('type', 'checkbox');
inp1.setAttribute('class', 'clazz1');
host.appendChild(inp1);
var inp2 = d.createElement('input');
inp2.setAttribute('id', 'inp2');
inp2.setAttribute('type', 'checkbox');
inp2.setAttribute('class', 'clazz2');
host.appendChild(inp2);
var inp2 = d.createElement('input');
inp2.setAttribute('id', 'inp2');
inp2.setAttribute('type', 'checkbox');
inp2.setAttribute('class', 'clazz2');
host.appendChild(inp2);
var inp3 = d.createElement('input');
inp3.setAttribute('id', 'inp3');
inp3.setAttribute('type', 'checkbox');
inp3.setAttribute('class', 'clazz1');
host.appendChild(inp3);
var inp3 = d.createElement('input');
inp3.setAttribute('id', 'inp3');
inp3.setAttribute('type', 'checkbox');
inp3.setAttribute('class', 'clazz1');
host.appendChild(inp3);
//Shadow root to play with
var s = host.createShadowRoot();
//Shadow root to play with
var s = host.createShadowRoot();
var shadowDiv = document.createElement('div');
shadowDiv.innerHTML = '<content select=".clazz1"></content>';
s.appendChild(shadowDiv);
var shadowDiv = document.createElement('div');
shadowDiv.innerHTML = '<content select=".clazz1"></content>';
s.appendChild(shadowDiv);
//element outside the shadow tree
var inp4 = d.createElement('input');
inp4.setAttribute('id', 'inp4');
inp4.setAttribute('type', 'checkbox');
inp4.setAttribute('class', 'clazz1');
d.body.appendChild(inp4);
//element outside the shadow tree
var inp4 = d.createElement('input');
inp4.setAttribute('id', 'inp4');
inp4.setAttribute('type', 'checkbox');
inp4.setAttribute('class', 'clazz1');
d.body.appendChild(inp4);
inp1.focus();
inp1.focus();
s.addEventListener('DOMFocusOut', A_05_03_01_T05.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
s.addEventListener('DOMFocusOut', A_05_03_01_T05.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
d.body.addEventListener('DOMFocusOut', A_05_03_01_T05.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Outside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
d.body.addEventListener('DOMFocusOut', A_05_03_01_T05.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Outside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
inp4.focus();
inp4.focus();
A_05_03_01_T05.done();
A_05_03_01_T05.done();
}));
@ -258,63 +259,63 @@ var A_05_03_01_T06 = async_test('A_05_03_01_T06');
A_05_03_01_T06.step(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var host = d.createElement('div');
host.setAttribute('id', 'host');
d.body.appendChild(host);
var host = d.createElement('div');
host.setAttribute('id', 'host');
d.body.appendChild(host);
var inp1 = d.createElement('input');
inp1.setAttribute('id', 'inp1');
inp1.setAttribute('type', 'checkbox');
inp1.setAttribute('class', 'clazz1');
host.appendChild(inp1);
var inp1 = d.createElement('input');
inp1.setAttribute('id', 'inp1');
inp1.setAttribute('type', 'checkbox');
inp1.setAttribute('class', 'clazz1');
host.appendChild(inp1);
var inp2 = d.createElement('input');
inp2.setAttribute('id', 'inp2');
inp2.setAttribute('type', 'checkbox');
inp2.setAttribute('class', 'clazz2');
host.appendChild(inp2);
var inp2 = d.createElement('input');
inp2.setAttribute('id', 'inp2');
inp2.setAttribute('type', 'checkbox');
inp2.setAttribute('class', 'clazz2');
host.appendChild(inp2);
var inp3 = d.createElement('input');
inp3.setAttribute('id', 'inp3');
inp3.setAttribute('type', 'checkbox');
inp3.setAttribute('class', 'clazz1');
host.appendChild(inp3);
var inp3 = d.createElement('input');
inp3.setAttribute('id', 'inp3');
inp3.setAttribute('type', 'checkbox');
inp3.setAttribute('class', 'clazz1');
host.appendChild(inp3);
//Shadow root to play with
var s = host.createShadowRoot();
//Shadow root to play with
var s = host.createShadowRoot();
var shadowDiv = document.createElement('div');
shadowDiv.innerHTML = '<content select=".clazz1"></content>';
s.appendChild(shadowDiv);
var shadowDiv = document.createElement('div');
shadowDiv.innerHTML = '<content select=".clazz1"></content>';
s.appendChild(shadowDiv);
//element outside the shadow tree
var inp4 = d.createElement('input');
inp4.setAttribute('id', 'inp4');
inp4.setAttribute('type', 'checkbox');
inp4.setAttribute('class', 'clazz1');
d.body.appendChild(inp4);
//element outside the shadow tree
var inp4 = d.createElement('input');
inp4.setAttribute('id', 'inp4');
inp4.setAttribute('type', 'checkbox');
inp4.setAttribute('class', 'clazz1');
d.body.appendChild(inp4);
inp4.focus();
inp4.focus();
s.addEventListener('DOMFocusIn', A_05_03_01_T06.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
s.addEventListener('DOMFocusIn', A_05_03_01_T06.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Inside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
d.body.addEventListener('DOMFocusIn', A_05_03_01_T05.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Outside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
d.body.addEventListener('DOMFocusIn', A_05_03_01_T05.step_func(function(event) {
assert_equals(event.target.getAttribute('id'), 'inp1', 'Outside shadow tree: ' +
'Event for nodes, distributed ' +
'agains insertion points shouldn\'t be retargeted');
}), false);
inp1.focus();
inp1.focus();
A_05_03_01_T06.done();
A_05_03_01_T06.done();
}));
</script>
</body>

13
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/retargeting-focus-events/test-002.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Retargeting focus events:The blur event must be treated in the same way as events with a relatedTarget, where the node that is gaining focus causing the blurring of target acts as the related target">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -40,11 +41,11 @@ A_05_03_02_T01.step(unit(function (ctx) {
//For #volume-slider relative target is #volume-slider
roots.playerShadowRoot.querySelector('.volume-slider').addEventListener('blur',
A_05_03_02_T01.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong target');
}), false);
A_05_03_02_T01.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong target');
}), false);
// move focus out of shadow tree. blur should be fired
d.querySelector('#outside-control').focus();

13
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/retargeting-focus-events/test-003.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Retargeting focus events:The focus event must be treated in the same way as events with a relatedTarget, where the corresponding node that is losing focus as a result of target gaining focus or the node that is gaining focus">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -40,11 +41,11 @@ A_05_03_03_T01.step(unit(function (ctx) {
//For #volume-slider relative target is #volume-slider
roots.playerShadowRoot.querySelector('.volume-slider').addEventListener('focus',
A_05_03_03_T01.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong target');
}), false);
A_05_03_03_T01.step_func(function(event) {
invoked = true;
assert_equals(event.target.getAttribute('id'), 'volume-slider',
'Wrong target');
}), false);
roots.playerShadowRoot.querySelector('.volume-slider').focus();

7
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/retargeting-relatedtarget/test-001.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Retargeting relatedTarget:Event retargeting is a process of computing relative targets for each ancestor of the node at which the event is dispatched. A relative target is a DOM node that most accurately represents the target of a dispatched event at a given ancestor while maintaining the upper boundary encapsulation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -46,11 +47,11 @@ A_05_02_01_T01.step(unit(function (ctx) {
s.appendChild(div2);
s.addEventListener('mouseover', A_05_02_01_T01.step_func(function(event) {
assert_equals(event.relatedTarget.getAttribute('id'), 'div1', 'Wrong relatedTarget');
assert_equals(event.relatedTarget.getAttribute('id'), 'div1', 'Wrong relatedTarget');
}), false);
d.body.addEventListener('mouseover', A_05_02_01_T01.step_func(function(event) {
assert_true(false, 'Event must be stopped at Shadow boundary');
assert_true(false, 'Event must be stopped at Shadow boundary');
}), false);

5
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/retargeting-relatedtarget/test-002.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Retargeting relatedTarget:For a given node, the relatedTarget must be changed to its ancestor (or self) that is in the same shadow tree as the node">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -46,7 +47,7 @@ A_05_02_02_T01.step(unit(function (ctx) {
d.body.appendChild(div2);
d.body.addEventListener('mouseover', A_05_02_02_T01.step_func(function(event) {
assert_equals(event.relatedTarget.getAttribute('id'), 'host', 'Wrong related target');
assert_equals(event.relatedTarget.getAttribute('id'), 'host', 'Wrong related target');
}), false);

5
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/retargeting-relatedtarget/test-003.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="Retargeting relatedTarget:Event listeners must not be invoked on a node for which the target and relatedTarget are the same.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -46,7 +47,7 @@ A_05_02_03_T01.step(unit(function (ctx) {
s.appendChild(div2);
s.addEventListener('mouseover', A_05_02_03_T01.step_func(function(event) {
assert_true(false, 'Event listeners shouldn\'t be invoked if target and relatedTarget are the same');
assert_true(false, 'Event listeners shouldn\'t be invoked if target and relatedTarget are the same');
}), false);

38
tests/wpt/web-platform-tests/shadow-dom/untriaged/events/test-001.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<meta name="assert" content="Events:The mutation event types must never be dispatched in a shadow DOM subtree.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -31,34 +31,34 @@ A_05_00_01_T1.step(function () {
iframe.onload = A_05_00_01_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var d = iframe.contentDocument;
var div = d.createElement('div');
d.body.appendChild(div);
var div = d.createElement('div');
d.body.appendChild(div);
var s = div.createShadowRoot();
var s = div.createShadowRoot();
var div2 = d.createElement('div');
s.appendChild(div2);
var div2 = d.createElement('div');
s.appendChild(div2);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpid');
div2.appendChild(inp);
var inp = d.createElement('input');
inp.setAttribute('type', 'text');
inp.setAttribute('id', 'inpid');
div2.appendChild(inp);
div2.addEventListener('DOMAttrModified', A_05_00_01_T1.step_func(function (event) {
div2.addEventListener('DOMAttrModified', A_05_00_01_T1.step_func(function (event) {
assert_true(false, 'The mutation event types must never be dispatched in a shadow DOM subtree');
}), false);
/*
var attr = inp.getAttributeNode ("value");
/*
var attr = inp.getAttributeNode ("value");
var event = d.createEvent('MutationEvent');
event.initMutationEvent ("DOMAttrModified", true, true, attr, null, 'new value', "value", MutationEvent.MODIFICATION);
inp.dispatchEvent(event);
*/
inp.value = 'new value';
inp.setAttribute ("newAttr" , "firstValue");
inp.setAttribute ("newAttr" , "secondValue");
inp.removeAttribute ("newAttr");
*/
inp.value = 'new value';
inp.setAttribute ("newAttr" , "firstValue");
inp.setAttribute ("newAttr" , "secondValue");
inp.removeAttribute ("newAttr");
} finally {
iframe.parentNode.removeChild(iframe);
}

75
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-and-their-shadow-trees/test-001.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements and Their Shadow Trees: If the element can have fallback content, UA should allow the shadow tree to contain at least one insertion point.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
<script src="../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,15 +25,15 @@ policies and contribution forms [3].
//test iframe
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('iframe');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -46,15 +47,15 @@ test(unit(function (ctx) {
//test object
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('object');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -68,15 +69,15 @@ test(unit(function (ctx) {
//test video
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('video');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -90,15 +91,15 @@ test(unit(function (ctx) {
//test audio
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('audio');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -112,15 +113,15 @@ test(unit(function (ctx) {
//test canvas
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('canvas');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -134,7 +135,7 @@ test(unit(function (ctx) {
//test map
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var img = d.createElement('img');
img.setAttribute('usemap', '#theMap');
@ -143,14 +144,14 @@ test(unit(function (ctx) {
d.body.appendChild(img);
// create element
// create element
var el = d.createElement('map');
el.setAttribute('name', 'theMap');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
@ -165,15 +166,15 @@ test(unit(function (ctx) {
//test textarea
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('textarea');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -187,15 +188,15 @@ test(unit(function (ctx) {
//test progress
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('progress');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -209,15 +210,15 @@ test(unit(function (ctx) {
//test meter
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('meter');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';

21
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-and-their-shadow-trees/test-002.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements and Their Shadow Trees: Elements that have no fallback content should allow the shadow tree to contain no insertion points or an insertion point that matches nothing">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
<script src="../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,9 +25,9 @@ policies and contribution forms [3].
//test img
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('img');
d.body.appendChild(el);
@ -35,7 +36,7 @@ test(unit(function (ctx) {
s.innerHTML = '<content id="cont" select="#shadow"></content>';
assert_true(s.querySelector('#cont') != null, 'img should allow one insertion point ' +
'that matches nothing');
'that matches nothing');
}), 'A_09_00_02_T01');
@ -43,9 +44,9 @@ test(unit(function (ctx) {
//test embed
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('embed');
d.body.appendChild(el);
@ -54,7 +55,7 @@ test(unit(function (ctx) {
s.innerHTML = '<content id="cont" select="#shadow"></content>';
assert_true(s.querySelector('#cont') != null, 'embed should allow one insertion point ' +
'that matches nothing');
'that matches nothing');
}), 'A_09_00_02_T02');
@ -62,9 +63,9 @@ test(unit(function (ctx) {
//test embed
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('input');
d.body.appendChild(el);
@ -73,7 +74,7 @@ test(unit(function (ctx) {
s.innerHTML = '<content id="cont" select="#shadow"></content>';
assert_true(s.querySelector('#cont') != null, 'input should allow one insertion point ' +
'that matches nothing');
'that matches nothing');
}), 'A_09_00_02_T03');
</script>

25
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-and-their-shadow-trees/test-003.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements and Their Shadow Trees: Check that fieldset can contain at least two insertion points with matching criteria 'legend:first-of-type' and 'universal selector'">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
<script src="../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,15 +25,15 @@ policies and contribution forms [3].
//test universal selector
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('fieldset');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';
@ -47,23 +48,23 @@ test(unit(function (ctx) {
//test legend:first-of-type
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('fieldset');
d.body.appendChild(el);
el.innerHTML = '' +
'<legend>'
'<span id="shadow">This is a node that should be distributed</span>' +
'</legend>' +
'<span id="flbk">Unlucky content</span>';
'<legend>'
'<span id="shadow">This is a node that should be distributed</span>' +
'</legend>' +
'<span id="flbk">Unlucky content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="legend:first-of-type"></content>';
assert_true(d.querySelector('#shadow').offsetTop > 0, 'fieldset should allow insertion point ' +
'with legend:first-of-type matching criteria');
'with legend:first-of-type matching criteria');
assert_equals(d.querySelector('#flbk').offsetTop, 0, 'Fallback content shouldn\'t be rendered');
}), 'A_09_00_03_T02');

11
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-and-their-shadow-trees/test-004.html
View file

@ -16,7 +16,8 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements and Their Shadow Trees: Check that details can contain at least two insertion points with matching criteria 'summary:first-of-type' and 'universal selector'">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
<script src="../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,16 +25,16 @@ policies and contribution forms [3].
//test universal selector
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
// create element
// create element
var el = d.createElement('details');
el.setAttribute('open', 'open');
d.body.appendChild(el);
el.innerHTML = '' +
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
'<span id="shadow">This is a node that should be distributed</span>' +
'<span id="flbk">This is a fallback content</span>';
var s = el.createShadowRoot();
s.innerHTML = '<content select="#shadow"></content>';

10
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-in-shadow-trees/html-forms/test-001.html
View file

@ -16,14 +16,14 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements in shadow trees: Form elements and form-associated elements in shadow tree are not accessible using document DOM object's tree accessors">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
<script>
//test form-associated elements
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var form = d.createElement('form');
form.setAttribute('id', 'form_id');
@ -42,14 +42,14 @@ test(function () {
s.appendChild(el);
assert_equals(d.querySelector('#' + tagName + '_id'), null, 'Form-associated element ' + tagName +
' in shadow tree must not be accessible using owner\'s document tree accessors');
' in shadow tree must not be accessible using owner\'s document tree accessors');
});
}, 'A_08_02_01_T01');
//test form elements
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var form = d.createElement('form');
d.body.appendChild(form);
@ -65,7 +65,7 @@ test(function () {
s.appendChild(el);
assert_equals(d.querySelector('#' + tagName + '_id'), null, 'Form element ' + tagName +
' in shadow tree must not be accessible using owner\'s document tree accessors');
' in shadow tree must not be accessible using owner\'s document tree accessors');
});
}, 'A_08_02_01_T02');
</script>

20
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-in-shadow-trees/html-forms/test-002.html
View file

@ -16,14 +16,14 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements in shadow trees: Form elements and form-associated elements in shadow tree must be accessible using shadow tree accessors">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
<script>
//test form-associated elements
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var form = d.createElement('form');
form.setAttribute('id', 'form_id');
@ -42,16 +42,16 @@ test(function () {
s.appendChild(el);
assert_true(s.querySelector('#' + tagName + '_id') != null, 'Form-associated element ' + tagName +
' in shadow tree must be accessible shadow tree accessors');
' in shadow tree must be accessible shadow tree accessors');
assert_equals(s.querySelector('#' + tagName + '_id').getAttribute('id'), tagName + '_id',
'Form-associated element ' + tagName + ' in shadow tree must be accessible shadow tree accessors');
'Form-associated element ' + tagName + ' in shadow tree must be accessible shadow tree accessors');
});
}, 'A_08_02_02_T01');
//test form elements
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
var form = d.createElement('form');
d.body.appendChild(form);
@ -67,16 +67,16 @@ test(function () {
s.appendChild(el);
assert_true(s.querySelector('#' + tagName + '_id') != null, 'Form-associated element ' + tagName +
' in shadow tree must be accessible shadow tree accessors');
' in shadow tree must be accessible shadow tree accessors');
assert_equals(s.querySelector('#' + tagName + '_id').getAttribute('id'), tagName + '_id',
'Form element ' + tagName + ' in shadow tree must be accessible shadow tree accessors');
'Form element ' + tagName + ' in shadow tree must be accessible shadow tree accessors');
});
}, 'A_08_02_02_T02');
//test distributed form elements
test(function () {
var d = newHTMLDocument();
var d = newHTMLDocument();
HTML5_FORM_ASSOCIATED_ELEMENTS.forEach(function (tagName) {
@ -91,10 +91,10 @@ test(function () {
div.appendChild(el);
var s = div.createShadowRoot();
s.innerHTML = '<content select="' + tagName + '"></content>';
s.innerHTML = '<content select="' + tagName + '"></content>';
assert_true(s.querySelector('#' + tagName + '_id') == null, 'Distributed form-associated element ' + tagName +
' in shadow tree must not be accessible shadow tree accessors');
' in shadow tree must not be accessible shadow tree accessors');
});
}, 'A_08_02_02_T03');
</script>

22
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-in-shadow-trees/html-forms/test-003.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements in shadow trees: form should submit elements in shadow tree">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,24 +24,24 @@ policies and contribution forms [3].
var A_08_02_03_T01 = async_test('A_08_02_03_T01', { timeout: 5000 });
A_08_02_03_T01.checkIframeContent = A_08_02_03_T01.step_func(function () {
//remember value to check before cleaning the context (it'll destroy the iframe)
var valueToCheck = A_08_02_03_T01.iframe.contentWindow.document.URL;
cleanContext(A_08_02_03_T01.ctx);
//remember value to check before cleaning the context (it'll destroy the iframe)
var valueToCheck = A_08_02_03_T01.iframe.contentWindow.document.URL;
cleanContext(A_08_02_03_T01.ctx);
assert_true(valueToCheck.indexOf('inp1=value1') > 0,
'html form should submit all of its fields');
assert_true(valueToCheck.indexOf('inp1=value1') > 0,
'html form should submit all of its fields');
// Expected behavior is not quite clear. See https://www.w3.org/Bugs/Public/show_bug.cgi?id=20320
assert_true(valueToCheck.indexOf('inp2=value2') > 0,
'html form should submit all of its fields including the shadow ones');
// Expected behavior is not quite clear. See https://www.w3.org/Bugs/Public/show_bug.cgi?id=20320
assert_true(valueToCheck.indexOf('inp2=value2') > 0,
'html form should submit all of its fields including the shadow ones');
A_08_02_03_T01.done();
A_08_02_03_T01.done();
});
A_08_02_03_T01.step(function () {
A_08_02_03_T01.ctx = newContext();
A_08_02_03_T01.ctx = newContext();
var d = newRenderedHTMLDocument(A_08_02_03_T01.ctx);
//create iframe

16
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-in-shadow-trees/inert-html-elements/test-001.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements in shadow trees: base element must behave as inert, or not part of the document tree">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -24,20 +24,20 @@ policies and contribution forms [3].
var A_08_01_01_T01 = async_test('A_08_01_01_T01', { timeout: 5000 });
A_08_01_01_T01.checkIframeContent = A_08_01_01_T01.step_func(function () {
//remember value to check before cleaning the context (it'll destroy the iframe)
var valueToCheck = A_08_01_01_T01.iframe.contentWindow;
cleanContext(A_08_01_01_T01.ctx);
//remember value to check before cleaning the context (it'll destroy the iframe)
var valueToCheck = A_08_01_01_T01.iframe.contentWindow;
cleanContext(A_08_01_01_T01.ctx);
assert_equals(valueToCheck, null,
'base html element ih a shadow tree must beahve like inert one');
assert_equals(valueToCheck, null,
'base html element ih a shadow tree must beahve like inert one');
A_08_01_01_T01.done();
A_08_01_01_T01.done();
});
A_08_01_01_T01.step(function () {
A_08_01_01_T01.ctx = newContext();
A_08_01_01_T01.ctx = newContext();
var d = newRenderedHTMLDocument(A_08_01_01_T01.ctx);
//create iframe

21
tests/wpt/web-platform-tests/shadow-dom/untriaged/html-elements-in-shadow-trees/inert-html-elements/test-002.html
View file

@ -16,26 +16,27 @@ policies and contribution forms [3].
<meta name="assert" content="HTML Elements in shadow trees: link element must behave as inert not as part of the document tree">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var d = newRenderedHTMLDocument(ctx);
var link = d.createElement('link');
link.setAttribute('rel', 'stylesheet');
var link = d.createElement('link');
link.setAttribute('rel', 'stylesheet');
//create Shadow root
var root = d.createElement('div');
d.body.appendChild(root);
var s = root.createShadowRoot();
//create Shadow root
var root = d.createElement('div');
d.body.appendChild(root);
var s = root.createShadowRoot();
s.appendChild(link);
s.appendChild(link);
assert_equals(d.styleSheets.length, 0, 'link element must behave as inert not as part of the document tree');
assert_equals(d.styleSheets.length, 0, 'link element must behave as inert not as part of the document tree');
}), 'A_08_01_02_T01');

58
tests/wpt/web-platform-tests/shadow-dom/untriaged/resources/bobs_page.html
View file

@ -2,34 +2,34 @@
<head>
</head>
<body>
<ul class='stories'>
<li id='li1'><a href='#1'>Link1</a></li>
<li id='li2' title="li2"><a href='#2'>Link 2</a></li>
<li id='li3' class='shadow'><a href='#3'>Link 3 Shadow</a></li>
<li id='li4' class='shadow2'><a href='#4'>Link 4 Shadow 2</a></li>
<li id='li5'><a id="a5" class="shadow" href='#5'>Link 5</a></li>
<li id='li6' class='shadow'><a href='#5'>Link 6 Shadow</a></li>
</ul>
<div id="divid" class='breaking'>
<span id='spandex'>Some text</span>
<ul id="ul2">
<li id='li11'>Item 11</li>
<li id='li12'>Item 12</li>
<li id='li13' class='shadow'>Item 13 Shadow</li>
<li id='li14' class='shadow2'>Item 14 Shadow 2</li>
<li id='li15'>Item 15</li>
<li id='li16' class='shadow'>Item 16 Shadow</li>
</ul>
</div>
<div id="links-wrapper">
<a href='#10' id='link10'>Link 10</a>
<a href='#11' id='link11'>Link 11</a>
</div>
<div id="inputs-wrapper">
<input type='text' id='inp1' disabled/>
<input type='text' id='inp2'/>
<input type='checkbox' id='chb1' checked>
<input type='checkbox' id='chb2'>
</div>
<ul class='stories'>
<li id='li1'><a href='#1'>Link1</a></li>
<li id='li2' title="li2"><a href='#2'>Link 2</a></li>
<li id='li3' class='shadow'><a href='#3'>Link 3 Shadow</a></li>
<li id='li4' class='shadow2'><a href='#4'>Link 4 Shadow 2</a></li>
<li id='li5'><a id="a5" class="shadow" href='#5'>Link 5</a></li>
<li id='li6' class='shadow'><a href='#5'>Link 6 Shadow</a></li>
</ul>
<div id="divid" class='breaking'>
<span id='spandex'>Some text</span>
<ul id="ul2">
<li id='li11'>Item 11</li>
<li id='li12'>Item 12</li>
<li id='li13' class='shadow'>Item 13 Shadow</li>
<li id='li14' class='shadow2'>Item 14 Shadow 2</li>
<li id='li15'>Item 15</li>
<li id='li16' class='shadow'>Item 16 Shadow</li>
</ul>
</div>
<div id="links-wrapper">
<a href='#10' id='link10'>Link 10</a>
<a href='#11' id='link11'>Link 11</a>
</div>
<div id="inputs-wrapper">
<input type='text' id='inp1' disabled/>
<input type='text' id='inp2'/>
<input type='checkbox' id='chb1' checked>
<input type='checkbox' id='chb2'>
</div>
</body>
</html>

163
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/composition/test-001.html
View file

@ -1,163 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_07_01</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/#multiple-shadow-subtrees">
<meta name="assert" content="Composition:Composition algorithm">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var div = d.createElement('div');
div.innerHTML = '' +
'<ul id="host">' +
'<li id="li1" class="shadow">' +
'<a id="a11" class="cl1" href="#">Link11 Shadow</a>' +
'<a id="a12" class="cl2" href="#">Link12 Shadow</a>' +
'<a id="a13" class="cl1" href="#">Link13 Shadow</a>' +
'</li>' +
'<li id="li2">' +
'<a id="a21" href="#">Link21</a><a id="a22" href="#">Link22</a>' +
'</li>' +
'<li id="li3" class="shadow">' +
'<a id="a31" href="#">Link31 Shadow</a><a id="a32" href="#">Link32 Shadow</a>' +
'</li>' +
'<li id="li4" class="shadow2">' +
'<a id="a41" href="#">Link41 Shadow 2</a><a id="a42" href="#">Link22 Shadow 2</a>' +
'</li>' +
'<li id="li5" class="shadow2">' +
'<a id="a51" href="#">Link51 Shadow</a><a id="a52" href="#">Link52 Shadow 2</a>' +
'</li>' +
'</ul>';
d.body.appendChild(div);
//make nested shadow tree to check the reprojection
var li1 = d.querySelector('#li1');
var s = li1.createShadowRoot();
var shadowLI1 = document.createElement('li');
shadowLI1.innerHTML = '<content select=".cl1"></content>';
s.appendChild(shadowLI1);
//Shadow root to play with
var ul = d.querySelector('#host');
//make an old shadow tree
var s2 = ul.createShadowRoot();
var div2 = d.createElement('div');
div2.innerHTML = '<ul><content select=".shadow2"></content></ul>';
s2.appendChild(div2);
// At this point visible: li4 and li5
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 1: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 2: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 3: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 4: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 5: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the nested tree
assert_equals(d.querySelector('#a11').offsetTop, 0,
'Point 6: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a13').offsetTop, 0,
'Point 7: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 8: Aleady distributed nodes should behave like a shadow host child nodes');
//make a young shadow tree
var s3 = ul.createShadowRoot();
var div3 = d.createElement('div');
div3.innerHTML = '<ul><content select=".shadow"></content></ul>';
s3.appendChild(div3);
//At this point: li1 and li3 visible, others not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 21: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 22: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 23: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 24: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 25: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a11 and a13 visible, a12 not)
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 26: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 27: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 28: Aleady distributed nodes should behave like a shadow host child nodes');
var shadow = d.createElement('shadow');
s3.appendChild(shadow);
//At this point: li1, li3, li4 and li5 visible li2 not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 31: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 32: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 33: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 34: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 35: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a11 and a13 visible, a12 not)
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 36: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 37: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 38: Aleady distributed nodes should behave like a shadow host child nodes');
var shadow2 = d.createElement('shadow');
s3.appendChild(shadow2);
// Nothing should be changed
//At this point: li1, li3, li4 and li5 visible li2 not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 41: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 42: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 43: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 44: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 45: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a11 and a13 visible, a12 not)
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 46: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 47: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 48: Aleady distributed nodes should behave like a shadow host child nodes');
}), 'A_04_07_01');
</script>
</body>
</html>

76
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/content-pseudo-element/test-001.html
View file

@ -1,76 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_04_01</title>
<link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru">
<link rel="author" title="Tetsuharu OHZEKI" href="mailto:saneyuki.snyk@gmail.com">
<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#distributed-pseudo-element">
<meta name="assert" content="Matching Children, Distributed To Insertion Points">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_04_01_T1 = async_test('A_04_04_01_T01');
A_04_04_01_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_04_01_T1.step_func(function () {
try {
var d = iframe.contentDocument;
//make shadow tree
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
var subdiv1 = d.createElement('div');
subdiv1.innerHTML = '<ul><content select="li"></content></ul>';
s.appendChild(subdiv1);
var shadowStyle = d.createElement('style');
shadowStyle.innerHTML = '*::content .shadow { display:none; }';
s.appendChild(shadowStyle);
//The order of DOM elements should be the following:
//li3, li6 - invisible. Other elements visible
var li3 = d.querySelector('#li3');
var li6 = d.querySelector('#li6');
assert_equals(window.getComputedStyle(li3).display, "none",
'Point 1: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(window.getComputedStyle(li6).display, "none",
'Point 2: Elements that don\'t mach insertion point criteria participate in distribution');
var li1 = d.querySelector('#li1');
var li2 = d.querySelector('#li2');
var li4 = d.querySelector('#li4');
var li5 = d.querySelector('#li5');
assert_not_equals(window.getComputedStyle(li1).display, "none",
'Point 3: ::content pseudo-element should be a valid insertion point matching criteria, element should be visible');
assert_not_equals(window.getComputedStyle(li2).display, "none",
'Point 4: ::content pseudo-element should be a valid insertion point matching criteria, element should be visible');
assert_not_equals(window.getComputedStyle(li4).display, "none",
'Point 5: ::content pseudo-element should be a valid insertion point matching criteria, element should be visible');
assert_not_equals(window.getComputedStyle(li5).display, "none",
'Point 6: ::content pseudo-element should be a valid insertion point matching criteria, element should be visible');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_04_01_T1.done();
});
});
</script>
</body>
</html>

66
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/content-pseudo-element/test-002.html
View file

@ -1,66 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_04_01</title>
<link rel="author" title="Tetsuharu OHZEKI" href="mailto:saneyuki.snyk@gmail.com">
<link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#distributed-pseudo-element">
<meta name="assert" content="::content pseudo-element, Relative Selector">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_04_01_T2 = async_test('A_04_04_01_T02');
A_04_04_01_T2.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_04_01_T2.step_func(function () {
try {
var d = iframe.contentDocument;
//make shadow tree
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
var subdiv1 = d.createElement('div');
subdiv1.innerHTML = '<ul><content select="li"></content></ul>';
s.appendChild(subdiv1);
var shadowStyle = d.createElement('style');
shadowStyle.innerHTML = '*::content > .shadow { display:none; }';
s.appendChild(shadowStyle);
//The order of DOM elements should be the following:
//li3, li6 - invisible. Other elements visible
var li3 = d.querySelector('#li3');
var li6 = d.querySelector('#li6');
assert_equals(window.getComputedStyle(li3).display, "none",
'Point 1: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(window.getComputedStyle(li6).display, "none",
'Point 2: Elements that don\'t mach insertion point criteria participate in distribution');
var a5 = d.querySelector('#a5');
assert_not_equals(window.getComputedStyle(a5).display, "none",
'Point 3: ::content pseudo-element with relative selector should be a valid insertion point matching criteria, element should be visible');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_04_01_T2.done();
});
});
</script>
</body>
</html>

63
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/custom-pseudo-elements/test-001.html
View file

@ -1,63 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_10_01</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/#custom-pseudo-elements">
<meta name="assert" content="Custom Pseudo-Elements: test valid pseudo-element">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
// Test fails. See https://bugs.webkit.org/show_bug.cgi?id=103973
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var style = d.createElement('style');
style.innerHTML = 'span {' +
'font-size: 10px;' +
'}';
d.head.appendChild(style);
var widget = d.createElement('div');
d.body.appendChild(widget);
var s = widget.createShadowRoot();
var thumb = d.createElement('span');
thumb.innerHTML = 'This is a pseudo-element';
//FIXME test works if prefixed version of API used.
//In other words works if webkitPseudo property is used
//thumb.webkitPseudo = 'x-thumb';
thumb.pseudo = 'x-thumb';
s.appendChild(thumb);
var height = thumb.offsetHeight;
assert_true(height > 0, 'Element should be rendered');
style = d.createElement('style');
style.innerHTML = 'div::x-thumb {' +
'font-size: 30px;' +
'}';
d.body.appendChild(style);
assert_true(thumb.offsetHeight > height, 'Pseudo-element style should be applied');
}), 'A_04_10_01_T01');
</script>
</body>
</html>

35
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/distribution-001-ref.html
View file

@ -1,35 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: Distribution: Unordered list (Reference)</title>
<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com">
</head>
<body>
<p>
You should see an unordered list below, consisting of ten elements
each of which contains a capital letter ranging from "A" to "J",
in alphabetical order.
</p>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
<li>E</li>
<li>F</li>
<li>G</li>
<li>H</li>
<li>I</li>
<li>J</li>
</ul>
</body>
</html>

47
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/distribution-001.html
View file

@ -1,47 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: Distribution: Unordered list</title>
<link rel="match" href="distribution-001-ref.html">
<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="Lower-boundary Encapsulation: Each insertion point participates in distribution by providing a matching criteria for the child nodes. The matching criteria determines whether a given node could be distributed to a given insertion point.">
<script src="../../testcommon.js"></script>
</head>
<body>
<p>
You should see an unordered list below, consisting of ten elements
each of which contains a capital letter ranging from "A" to "J",
in alphabetical order.
</p>
<ul id="list">
<li>H</li>
<li class="first">B</li>
<li class="second">E</li>
<li>I</li>
<li class="first">C</li>
</ul>
<script>
var shadowRoot = document.getElementById('list').createShadowRoot();
shadowRoot.innerHTML =
'<li>A</li>' +
'<content select=".first"></content>' +
'<li>D</li>' +
'<content select=".second"></content>' +
'<li>F</li>' +
'<content select="img"></content>' +
'<li>G</li>' +
'<content></content>' +
'<li>J</li>';
</script>
</body>
</html>

40
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/distribution-002-ref.html
View file

@ -1,40 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: Distribution: Ordered list (Reference)</title>
<link rel="author" title="Yuta Kitamura" href="mailto:yutak@google.com">
<style>
ol {
list-style-type: decimal;
}
</style>
</head>
<body>
<p>
You should see an ordered list below, consisting of ten elements numbered
from 1 through 10, and each line should contain a capital letter ranging from
"A" to "J", in alphabetical order.
</p>
<ol>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
<li>E</li>
<li>F</li>
<li>G</li>
<li>H</li>
<li>I</li>
<li>J</li>
</ol>
</body>
</html>

53
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/distribution-002.html
View file

@ -1,53 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: Distribution: Ordered list</title>
<link rel="match" href="distribution-002-ref.html">
<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/#shadow-trees">
<meta name="assert" content="Lower-boundary Encapsulation: Each insertion point participates in distribution by providing a matching criteria for the child nodes. The matching criteria determines whether a given node could be distributed to a given insertion point.">
<script src="../../testcommon.js"></script>
<style>
ol {
list-style-type: decimal;
}
</style>
</head>
<body>
<p>
You should see an ordered list below, consisting of ten elements numbered
from 1 through 10, and each line should contain a capital letter ranging from
"A" to "J", in alphabetical order.
</p>
<ol id="list">
<li>H</li>
<li class="first">B</li>
<li class="second">E</li>
<li>I</li>
<li class="first">C</li>
</ol>
<script>
var shadowRoot = document.getElementById('list').createShadowRoot();
shadowRoot.innerHTML =
'<li>A</li>' +
'<content select=".first"></content>' +
'<li>D</li>' +
'<content select=".second"></content>' +
'<li>F</li>' +
'<content select="img"></content>' +
'<li>G</li>' +
'<content></content>' +
'<li>J</li>';
</script>
</body>
</html>

74
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/distribution-003.html
View file

@ -1,74 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: Invariants after distribution</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/#lower-boundary-encapsulation">
<meta name="assert" content="Lower-boundary encapsulation: The distribution does not affect the state of the document tree or shadow trees">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var distributionTest = async_test(
'Distribution should not affect the state of the document trees and ' +
'the shadow trees.');
distributionTest.step(function () {
var shadowHost = document.createElement('ul');
shadowHost.innerHTML =
'<li class="first">host 1</li>' +
'<li class="second">host 2</li>';
shadowHost.style.visibility = 'hidden';
document.body.appendChild(shadowHost);
var host1 = shadowHost.querySelector('.first');
var host2 = shadowHost.querySelector('.second');
var shadowRoot = shadowHost.createShadowRoot();
shadowRoot.innerHTML =
'<li class="first">shadow 1</li>' +
'<content select=".second"></content>' +
'<li class="second">shadow 2</li>';
var shadow1 = shadowRoot.querySelector('.first');
var shadow2 = shadowRoot.querySelector('.second');
var content = shadowRoot.querySelector('content');
// Let the rendering happen.
window.setTimeout(distributionTest.step_func(function () {
assert_equals(host1.textContent, 'host 1');
assert_equals(host2.textContent, 'host 2');
assert_equals(shadow1.textContent, 'shadow 1');
assert_equals(shadow2.textContent, 'shadow 2');
assert_equals(content.textContent, '');
assert_equals(shadowHost.children.length, 2);
assert_equals(shadowHost.children[0], host1);
assert_equals(shadowHost.children[1], host2);
assert_equals(shadowRoot.children.length, 3);
assert_equals(shadowRoot.children[0], shadow1);
assert_equals(shadowRoot.children[1], content);
assert_equals(shadowRoot.children[2], shadow2);
assert_equals(host1.tagName, 'LI');
assert_equals(shadow1.tagName, 'LI');
assert_equals(content.tagName, 'CONTENT');
document.body.removeChild(shadowHost);
distributionTest.done();
}), 0);
});
</script>
</body>
</html>

130
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/test-003.html
View file

@ -1,130 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_02_03</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/#lower-boundary-encapsulation">
<meta name="assert" content="Lower-boundary encapsulation: The distribution is a result of executing a stable algorithm">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_02_03_T1 = async_test('A_04_02_03_T01');
A_04_02_03_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_02_03_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
subdiv1.innerHTML = '<ul><content select=".shadow"></content></ul>';
s.appendChild(subdiv1);
//The order of <li> elements at this point should be the following:
//li3, li6, li11, li12, 1i13, li14, li15. Other elements (li1, li2, li4, li5) invisible
assert_true(d.querySelector('#li3').offsetTop < d.querySelector('#li6').offsetTop,
'Point 1: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li6').offsetTop < d.querySelector('#li11').offsetTop,
'Point 2: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li11').offsetTop < d.querySelector('#li12').offsetTop,
'Point 3: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li12').offsetTop < d.querySelector('#li13').offsetTop,
'Point 4: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li13').offsetTop < d.querySelector('#li14').offsetTop,
'Point 5: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li14').offsetTop < d.querySelector('#li15').offsetTop,
'Point 6: Elements that mach insertion point criteria don\'t participate in distribution');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 7: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 8: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li4').offsetTop, 0,
'Point 9: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 10: Elements that don\'t mach insertion point criteria participate in distribution');
var subdiv2 = document.createElement('div');
subdiv2.innerHTML = '<ul><content select=".shadow2"></content></ul>';
s.appendChild(subdiv2);
// When class name changed distribution must reoccur
//The order of <li> elements should now be the following:
//li3, li6, li4, li11, li12, 1i13, li14, li15. Invisible: li1, li2, li5
assert_true(d.querySelector('#li3').offsetTop < d.querySelector('#li6').offsetTop,
'Point 11: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li6').offsetTop < d.querySelector('#li4').offsetTop,
'Point 12: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li4').offsetTop < d.querySelector('#li11').offsetTop,
'Point 13: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li11').offsetTop < d.querySelector('#li12').offsetTop,
'Point 14: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li12').offsetTop < d.querySelector('#li13').offsetTop,
'Point 15: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li13').offsetTop < d.querySelector('#li14').offsetTop,
'Point 16: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li14').offsetTop < d.querySelector('#li15').offsetTop,
'Point 17: Elements that mach insertion point criteria don\'t participate in distribution');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 18: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 19: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 20: Elements that don\'t mach insertion point criteria participate in distribution');
var subdiv3 = document.createElement('div');
subdiv3.innerHTML = '<ul><content select=".shadow"></content></ul>';
s.appendChild(subdiv3);
//There should be no change. Order:
//li3, li6, li4, li11, li12, 1i13, li14, li15. Invisible: li1, li2, li5
assert_true(d.querySelector('#li3').offsetTop < d.querySelector('#li6').offsetTop,
'Point 21: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li6').offsetTop < d.querySelector('#li4').offsetTop,
'Point 22: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li4').offsetTop < d.querySelector('#li11').offsetTop,
'Point 23: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li11').offsetTop < d.querySelector('#li12').offsetTop,
'Point 24: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li12').offsetTop < d.querySelector('#li13').offsetTop,
'Point 25: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li13').offsetTop < d.querySelector('#li14').offsetTop,
'Point 26: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li14').offsetTop < d.querySelector('#li15').offsetTop,
'Point 27: Elements that mach insertion point criteria don\'t participate in distribution');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 28: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 29: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 30: Elements that don\'t mach insertion point criteria participate in distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_02_03_T1.done();
});
});
</script>
</body>
</html>

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/test-004.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<meta name="assert" content="Lower-boundary encapsulation: The distribution reoccurs whenever any variable affecting it is changed">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>

66
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/lower-boundary-encapsulation/test-005.html
View file

@ -1,66 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_02_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/#lower-boundary-encapsulation">
<meta name="assert" content="Lower-boundary encapsulation: An insertion point may be active or inactive. An active insertion point participates in the distribution process, whereas the inactive insertion does not">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_02_05_T1 = async_test('A_04_02_05_T01');
A_04_02_05_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_02_05_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector("ul.stories");
var s = ul.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
subdiv1.innerHTML = "<ul><content select='.nobody'><span id='shadowspan'>Inactive insertion point</span></content></ul>";
s.appendChild(subdiv1);
assert_true(s.querySelector('#shadowspan').offsetTop > 0,
'Inactive insertion point should be in a fallback content');
// All li1-li6 should be invisible, shadowspan visible
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 1: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 2: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li3').offsetTop, 0,
'Point 3: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li4').offsetTop, 0,
'Point 4: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 5: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li6').offsetTop, 0,
'Point 6: Elements that don\'t mach insertion point criteria participate in distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_02_05_T1.done();
});
});
</script>
</body>
</html>

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest-ref.html
View file

@ -4,7 +4,7 @@
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<meta name="assert" content="nested shadow tree style is valid." >
<style>
#host {

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/nested_tree_reftest.html
View file

@ -6,7 +6,7 @@
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<meta name="assert" content="nested shadow tree style is valid." >
<style>
#host {

98
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/nested-shadow-trees/test-001.html
View file

@ -1,98 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_08_01</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/#nested-shadow-subtrees">
<meta name="assert" content="Nested Shadow Subtrees:Any element in a shadow tree can be a shadow host, thus producing nested shadow trees">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_08_01_T1 = async_test('A_04_08_01_T01');
A_04_08_01_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_08_01_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
//make a shadow subtree
var s1 = ul.createShadowRoot();
var subdiv1 = d.createElement('div');
subdiv1.innerHTML = '<ul><content select=".shadow"></content></ul>' +
'<div id="host_div">' +
'<span id="sh_span">This span should be visible</span>' +
'<ul id="host">' +
'<li id="sh_li1">Shadow li 1</li>' +
'<li id="sh_li2">Shadow li 2</li>' +
'<li id="sh_li3" class="shadow2">Shadow li 3</li>' +
'<li id="sh_li4">Shadow li 4</li>' +
'<li id="sh_li5">Shadow li 5</li>' +
'</ul>' +
'</div>';
s1.appendChild(subdiv1);
//make nested shadow subtree
var sh_ul = s1.querySelector('#host');
var s2 = sh_ul.createShadowRoot();
var subdiv2 = d.createElement('div');
subdiv2.innerHTML = '<ul><content select=".shadow2"></content></ul>';
s2.appendChild(subdiv2);
//The order of DOM elements should be the following:
//li4, li3 and sh_li3 visible. Other elements invisible
assert_true(d.querySelector('#li3').offsetTop > 0,
'Point 1: Shadow tree should take part in the distribution');
assert_true(d.querySelector('#li6').offsetTop > d.querySelector('#li3').offsetTop,
'Point 2: Shadow tree should take part in the distribution');
assert_true(s1.querySelector('#sh_li3').offsetTop > 0,
'Nested shadow subtree should take part in the distribution');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 3: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 4: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li4').offsetTop, 0,
'Point 5: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 6: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(s1.querySelector('#sh_li1').offsetTop, 0,
'Point 7: Elements of the nested shadow subtree that don\'t mach insertion point criteria participate in distribution');
assert_equals(s1.querySelector('#sh_li2').offsetTop, 0,
'Point 8: Elements of the nested shadow subtree that don\'t mach insertion point criteria participate in distribution');
assert_equals(s1.querySelector('#sh_li4').offsetTop, 0,
'Point 9: Elements of the nested shadow subtree that don\'t mach insertion point criteria participate in distribution');
assert_equals(s1.querySelector('#sh_li5').offsetTop, 0,
'Point 10: Elements of the nested shadow subtree that don\'t mach insertion point criteria participate in distribution');
assert_true(s1.querySelector('#sh_span').offsetTop > 0,
'Shadow subtree elements that are not shadow host should take part in the distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_08_01_T1.done();
});
});
</script>
</body>
</html>

255
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/rendering-shadow-trees/test-001.html
View file

@ -1,255 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_09_01</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/#multiple-shadow-subtrees">
<meta name="assert" content="Rendering Shadow DOM Subtrees:rendering algorithm">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
test(unit(function (ctx) {
var d = newRenderedHTMLDocument(ctx);
var div = d.createElement('div');
div.innerHTML = '' +
'<ul id="host">' +
'<li id="li1" class="shadow">' +
'<a id="a11" class="cl1" href="#">Link11 Shadow</a>' +
'<a id="a12" class="cl2" href="#">Link12 Shadow</a>' +
'<a id="a13" class="cl1" href="#">Link13 Shadow</a>' +
'<a id="a14" class="cl3" href="#">Link14 Shadow</a>' +
'</li>' +
'<li id="li2">' +
'<a id="a21" href="#">Link21</a><a id="a22" href="#">Link22</a>' +
'</li>' +
'<li id="li3" class="shadow">' +
'<a id="a31" href="#">Link31 Shadow</a><a id="a32" href="#">Link32 Shadow</a>' +
'</li>' +
'<li id="li4" class="shadow2">' +
'<a id="a41" href="#">Link41 Shadow 2</a><a id="a42" href="#">Link22 Shadow 2</a>' +
'</li>' +
'<li id="li5" class="shadow2">' +
'<a id="a51" href="#">Link51 Shadow</a><a id="a52" href="#">Link52 Shadow 2</a>' +
'</li>' +
'</ul>';
d.body.appendChild(div);
//make nested shadow tree to check the reprojection
var li1 = d.querySelector('#li1');
var s = li1.createShadowRoot();
var shadowLI1 = document.createElement('li');
shadowLI1.innerHTML = '<content select=".cl1"></content>';
s.appendChild(shadowLI1);
//check the tree. a11 and a13 should be visible
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 1: Node that matches insertion point criteria should be rendered');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 2: Node that matches insertion point criteria should be rendered');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 3: Node that doesn\'t match insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#a14').offsetTop, 0,
'Point 4: Node that doesn\'t match insertion point criteria shouldn\'t be rendered');
var shadowLI2 = document.createElement('li');
shadowLI2.innerHTML = '<content select=".cl3"></content>';
s.appendChild(shadowLI2);
//At this point a11, a13 and a14 should be visible
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 11: Node that matches insertion point criteria should be rendered');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 12: Node that matches insertion point criteria should be rendered');
assert_true(d.querySelector('#a14').offsetTop > d.querySelector('#a13').offsetTop,
'Point 13: Node that matches insertion point criteria should be rendered');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 14: Node that doesn\'t match insertion point criteria shouldn\'t be rendered');
//Shadow root to play with
var ul = d.querySelector('#host');
//make an old shadow tree
var s2 = ul.createShadowRoot();
var div2 = d.createElement('div');
div2.innerHTML = '<ul><content select=".shadow"></content></ul>';
s2.appendChild(div2);
// At this point visible: li1 and li3
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 21: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 22: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 23: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 24: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 25: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 26: Node that matches insertion point criteria should be rendered');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 27: Node that matches insertion point criteria should be rendered');
assert_true(d.querySelector('#a14').offsetTop > d.querySelector('#a13').offsetTop,
'Point 28: Node that matches insertion point criteria should be rendered');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 29: Node that doesn\'t match insertion point criteria shouldn\'t be rendered');
//make a young shadow tree
var s3 = ul.createShadowRoot();
var div3 = d.createElement('div');
div3.innerHTML = '<ul><content select=".shadow2"></content></ul>';
s3.appendChild(div3);
//At this point: li4 and li5 visible, others not
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 31: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 32: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 33: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 34: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 35: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (all invisible)
assert_equals(d.querySelector('#a11').offsetTop, 0,
'Point 36: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 37: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a13').offsetTop, 0,
'Point 38: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a14').offsetTop, 0,
'Point 39: Aleady distributed nodes should behave like a shadow host child nodes');
var shadow = d.createElement('shadow');
s3.appendChild(shadow);
//At this point: li1, li3, li4 and li5 visible li2 not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 41: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 42: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 43: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 44: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 45: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a11, a13, a14 visible, a12 not)
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 46: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 47: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 48: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a14').offsetTop > 0,
'Point 49: Aleady distributed nodes should behave like a shadow host child nodes');
var shadow2 = d.createElement('shadow');
s3.appendChild(shadow2);
// Nothing should be changed
//At this point: li1, li3, li4 and li5 visible li2 not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 51: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 52: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 53: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 54: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 55: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a11 and a13 visible, a12 not)
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 56: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 57: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 58: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a14').offsetTop > 0,
'Point 59: Aleady distributed nodes should behave like a shadow host child nodes');
//replace the nested tree by younger one
var s4 = li1.createShadowRoot();
var shadowLI4 = document.createElement('li');
shadowLI4.innerHTML = '<content select=".cl2"></content>';
s4.appendChild(shadowLI4);
//At this point: li1, li3, li4 and li5 visible li2 not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 61: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 62: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 63: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 64: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 65: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a12 visible, others not)
assert_equals(d.querySelector('#a11').offsetTop, 0,
'Point 66: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a12').offsetTop > 0,
'Point 67: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a13').offsetTop, 0,
'Point 68: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a14').offsetTop, 0,
'Point 69: Aleady distributed nodes should behave like a shadow host child nodes');
//Let's check that if we add a shadow insertion point to the tree nothing is
//changed in the nested three (old tree is still invisible)
var shadow3 = d.createElement('shadow');
s3.appendChild(shadow3);
//At this point: li1, li3, li4 and li5 visible li2 not
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 61: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 62: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 63: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li4').offsetTop > 0, 'Point 64: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_true(d.querySelector('#li5').offsetTop > 0, 'Point 65: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the reprojected nodes (a12 visible, others not)
assert_equals(d.querySelector('#a11').offsetTop, 0,
'Point 66: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a12').offsetTop > 0,
'Point 67: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a13').offsetTop, 0,
'Point 68: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a14').offsetTop, 0,
'Point 69: Aleady distributed nodes should behave like a shadow host child nodes');
}), 'A_04_09_01_T01');
</script>
</body>
</html>

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-001.html
View file

@ -17,7 +17,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<style>
.pass { color: green; }
</style>

30
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-002-ref.html
View file

@ -1,30 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<meta charset="utf-8">
<title>Shadow DOM Test: Basic reprojection with a select attribute (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" below.</p>
<div id="host">
<div>Hello a Shadow Root2.</div>
<div>
<div class="pass">Apple.</div>
</div>
</div>
</body>
</html>

40
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/reprojection/reprojection-002.html
View file

@ -1,40 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Shadow DOM Test - Tests a reprojection with a select attribute.</title>
<link rel="match" href="reprojection-002-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 with a select attribute.">
<script src="../../testcommon.js"></script>
<style>
.pass { color: green; }
.fail { color: red; }
</style>
</head>
<body>
<p>You should see green text saying "Apple" below.</p>
<div id="host">
<div class="A pass">Apple.</div>
<div class="B fail">Orange.</div>
</div>
<script>
var shadowRoot = host.createShadowRoot();
shadowRoot.innerHTML = '<div id="host2">Hello a Shadow Root.<content></content><div class="fail">Banana.</div></div>';
var host2 = shadowRoot.getElementById("host2");
var shadowRoot2 = host2.createShadowRoot();
shadowRoot2.innerHTML = '<div>Hello a Shadow Root2.</div><div><content select=".A"></content></div>';
</script>
</body>
</html>

175
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/reprojection/test-001.html
View file

@ -1,175 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_06_01</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/#reprojection">
<meta name="assert" content="Reprojection: The nodes distributed into that insertion point must appear as if they were child nodes of the shadow host in the context of distribution within the shadow DOM subtree, hosted by said shadow host">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_06_01_T01 = async_test('A_04_06_01_T01');
A_04_06_01_T01.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/blank.html';
document.body.appendChild(iframe);
iframe.onload = A_04_06_01_T01.step_func(function () {
try {
var d = iframe.contentDocument;
var div = d.createElement('div');
div.innerHTML = '' +
'<ul id="host">' +
'<li id="li1" class="shadow">' +
'<a id="a11" class="cl1" href="#">Link11 Shadow</a>' +
'<a id="a12" class="cl2" href="#">Link12 Shadow</a>' +
'<a id="a13" class="cl1" href="#">Link13 Shadow</a>' +
'</li>' +
'<li id="li2">' +
'<a id="a21" href="#">Link21</a><a id="a22" href="#">Link22</a>' +
'</li>' +
'<li id="li3" class="shadow">' +
'<a id="a31" href="#">Link31 Shadow</a><a id="a32" href="#">Link32 Shadow</a>' +
'</li>' +
'<li id="li4" class="shadow2">' +
'<a id="a41" href="#">Link41 Shadow 2</a><a id="a42" href="#">Link22 Shadow 2</a>' +
'</li>' +
'<li id="li5" class="shadow2">' +
'<a id="a51" href="#">Link51 Shadow</a><a id="a52" href="#">Link52 Shadow 2</a>' +
'</li>' +
'</ul>';
d.body.appendChild(div);
var li1 = d.querySelector('#li1');
var s = li1.createShadowRoot();
//make shadow subtree
var shadowLI1 = document.createElement('li');
shadowLI1.innerHTML = '<li><content select=".cl1"></content></li>';
s.appendChild(shadowLI1);
var ul = d.querySelector('#host');
var s2 = ul.createShadowRoot();
var div2 = document.createElement('div');
div2.innerHTML = '<ul><content select=".shadow"></content></ul>';
s2.appendChild(div2);
assert_true(d.querySelector('#li1').offsetTop > 0, 'Point 1: Node that match insertion ' +
'point criteria should be rendered');
assert_true(d.querySelector('#li3').offsetTop > 0, 'Point 2: Node that match insertion ' +
'point criteria should be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 3: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the nested tree
assert_true(d.querySelector('#a11').offsetTop > 0,
'Point 6: Aleady distributed nodes should behave like a shadow host child nodes');
assert_true(d.querySelector('#a13').offsetTop > 0,
'Point 7: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 8: Aleady distributed nodes should behave like a shadow host child nodes');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_06_01_T01.done();
});
});
var A_04_06_01_T02 = async_test('A_04_06_01_T02');
A_04_06_01_T02.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/blank.html';
document.body.appendChild(iframe);
iframe.onload = A_04_06_01_T02.step_func(function () {
try {
var d = iframe.contentDocument;
var div = d.createElement('div');
div.innerHTML = '' +
'<ul id="host">' +
'<li id="li1" class="shadow">' +
'<a id="a11" class="cl1" href="#">Link11 Shadow</a>' +
'<a id="a12" class="cl2" href="#">Link12 Shadow</a>' +
'<a id="a13" class="cl1" href="#">Link13 Shadow</a>' +
'</li>' +
'<li id="li2">' +
'<a id="a21" href="#">Link21</a><a id="a22" href="#">Link22</a>' +
'</li>' +
'<li id="li3" class="shadow">' +
'<a id="a31" href="#">Link31 Shadow</a><a id="a32" href="#">Link32 Shadow</a>' +
'</li>' +
'<li id="li4" class="shadow2">' +
'<a id="a41" href="#">Link41 Shadow 2</a><a id="a42" href="#">Link22 Shadow 2</a>' +
'</li>' +
'<li id="li5" class="shadow2">' +
'<a class="cl1" id="a51" href="#">Link51 Shadow</a><a id="a52" href="#">Link52 Shadow 2</a>' +
'</li>' +
'</ul>';
d.body.appendChild(div);
var li1 = d.querySelector('#li1');
var s = li1.createShadowRoot();
//make shadow subtree
var shadowLI1 = document.createElement('li');
shadowLI1.innerHTML = '<li><content select=".cl1"></content></li>';
s.appendChild(shadowLI1);
var ul = d.querySelector('#host');
var s2 = ul.createShadowRoot();
var div2 = document.createElement('div');
div2.innerHTML = '<li><content select=".cl1"></content></li>';
s2.appendChild(div2);
// The second distribution shouldn't render anything
assert_equals(d.querySelector('#li1').offsetTop, 0, 'Point 1: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li2').offsetTop, 0, 'Point 2: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li3').offsetTop, 0, 'Point 3: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li4').offsetTop, 0, 'Point 4: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
assert_equals(d.querySelector('#li5').offsetTop, 0, 'Point 5: Node that doen\'t match ' +
'insertion point criteria shouldn\'t be rendered');
//check the nested tree
assert_equals(d.querySelector('#a11').offsetTop, 0,
'Point 6: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a13').offsetTop, 0,
'Point 7: Aleady distributed nodes should behave like a shadow host child nodes');
assert_equals(d.querySelector('#a12').offsetTop, 0,
'Point 8: Aleady distributed nodes should behave like a shadow host child nodes');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_06_01_T02.done();
});
});
</script>
</body>
</html>

59
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/satisfying-matching-criteria/test-001.html
View file

@ -1,59 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_03_01</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/#matching-insertion-points">
<meta name="assert" content="Matching Insertion Points: A valid selector fragment may contain a type selector">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_03_01_T1 = async_test('A_04_03_01_T01');
A_04_03_01_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_03_01_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var div = d.querySelector('#divid');
var s = div.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
subdiv1.innerHTML = '<content select="span"></content>';
s.appendChild(subdiv1);
//The order of DOM elements should be the following:
// <ul class='stories'>, <span>. Invisible: <ul id="ul2">
assert_true(d.querySelector('ul.stories').offsetTop < d.querySelector('#spandex').offsetTop,
'A valid selector fragment may contain \'span\' type selector');
assert_equals(d.querySelector('#ul2').offsetTop, 0,
'<ul> element shouldn\'t match "span" type selector');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_03_01_T1.done();
});
});
</script>
</body>
</html>

65
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/satisfying-matching-criteria/test-002.html
View file

@ -1,65 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_03_02</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/#matching-insertion-points">
<meta name="assert" content="Matching Insertion Points: A valid selector fragment may contain an universal selector">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_03_02_T1 = async_test('A_04_03_02_T01');
A_04_03_02_T1.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_03_02_T1.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
// TODO add tests for namespace universal selector ns|*
subdiv1.innerHTML = '<ul><content select="*"></content></ul>';
s.appendChild(subdiv1);
//The order of DOM elements should be the following:
// li1-li6 should be visible and located on-order
assert_true(d.querySelector('#li1').offsetTop < d.querySelector('#li2').offsetTop,
'Point 1: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li2').offsetTop < d.querySelector('#li3').offsetTop,
'Point 2: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li3').offsetTop < d.querySelector('#li4').offsetTop,
'Point 3: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li4').offsetTop < d.querySelector('#li5').offsetTop,
'Point 4: Elements that mach insertion point criteria don\'t participate in distribution');
assert_true(d.querySelector('#li5').offsetTop < d.querySelector('#li6').offsetTop,
'Point 5: Elements that mach insertion point criteria don\'t participate in distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_03_02_T1.done();
});
});
</script>
</body>
</html>

66
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/satisfying-matching-criteria/test-003.html
View file

@ -1,66 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_03_03</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/#matching-insertion-points">
<meta name="assert" content="Matching Insertion Points: A valid selector fragment may contain a class selector">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_03_03_T01 = async_test('A_04_03_03_T01');
A_04_03_03_T01.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_03_03_T01.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
subdiv1.innerHTML = '<ul><content select=".shadow"></content></ul>';
s.appendChild(subdiv1);
//The order of DOM elements should be the following:
//li3, li6. Other elements invisible
assert_true(d.querySelector('#li3').offsetTop < d.querySelector('#li6').offsetTop,
'Class name should be a valid insertion point matching criteria');
assert_true(d.querySelector('#li3').offsetTop > 0,
'Class name should be a valid insertion point matching criteria, element should be visible');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 1: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 2: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li4').offsetTop, 0,
'Point 3: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 4: Elements that don\'t mach insertion point criteria participate in distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_03_03_T01.done();
});
});
</script>
</body>
</html>

65
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/satisfying-matching-criteria/test-004.html
View file

@ -1,65 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_03_04</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/#matching-insertion-points">
<meta name="assert" content="Matching Insertion Points: A valid selector fragment may contain an ID selector">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_03_04_T01 = async_test('A_04_03_04_T01');
A_04_03_04_T01.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_03_04_T01.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
subdiv1.innerHTML = '<ul><content select="#li4"></content></ul>';
s.appendChild(subdiv1);
//The order of DOM elements should be the following:
//li4. Other elements invisible
assert_true(d.querySelector('#li4').offsetTop > 0,
'Class name should be a valid insertion point matching criteria, element should be visible');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 1: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li2').offsetTop, 0,
'Point 2: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li3').offsetTop, 0,
'Point 3: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 4: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li6').offsetTop, 0,
'Point 5: Elements that don\'t mach insertion point criteria participate in distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_03_04_T01.done();
});
});
</script>
</body>
</html>

65
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/satisfying-matching-criteria/test-005.html
View file

@ -1,65 +0,0 @@
<!DOCTYPE html>
<!--
Distributed under both the W3C Test Suite License [1] and the W3C
3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
policies and contribution forms [3].
[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
[3] http://www.w3.org/2004/10/27-testcases
-->
<html>
<head>
<title>Shadow DOM Test: A_04_03_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/#matching-insertion-points">
<meta name="assert" content="Matching Insertion Points: A valid selector fragment may contain an attribute selector">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../testcommon.js"></script>
</head>
<body>
<div id="log"></div>
<script>
var A_04_03_05_T01 = async_test('A_04_03_05_T01');
A_04_03_05_T01.step(function () {
var iframe = document.createElement('iframe');
iframe.src = '../../resources/bobs_page.html';
document.body.appendChild(iframe);
iframe.onload = A_04_03_05_T01.step_func(function () {
try {
var d = iframe.contentDocument;
var ul = d.querySelector('ul.stories');
var s = ul.createShadowRoot();
//make shadow subtree
var subdiv1 = document.createElement('div');
subdiv1.innerHTML = '<ul><content select="li[title]"></content></ul>';
s.appendChild(subdiv1);
//The order of DOM elements should be the following:
//li2. Other elements invisible
assert_true(d.querySelector('#li2').offsetTop > 0,
'Attribute should be a valid insertion point matching criteria, element should be visible');
assert_equals(d.querySelector('#li1').offsetTop, 0,
'Point 1: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li3').offsetTop, 0,
'Point 2: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li4').offsetTop, 0,
'Point 3: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li5').offsetTop, 0,
'Point 4: Elements that don\'t mach insertion point criteria participate in distribution');
assert_equals(d.querySelector('#li6').offsetTop, 0,
'Point 5: Elements that don\'t mach insertion point criteria participate in distribution');
} finally {
iframe.parentNode.removeChild(iframe);
}
A_04_03_05_T01.done();
});
});
</script>
</body>
</html>

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/shadow-root-001.html
View file

@ -16,7 +16,7 @@ policies and contribution forms [3].
<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="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
<style>
p { color: black; }
* { color: red; }

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/shadow-root-002.html
View file

@ -17,7 +17,7 @@ policies and contribution forms [3].
<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="../testcommon.js"></script>
<script src="../../../html/resources/common.js"></script>
<style>
p { color: black; }
.pass { color: green; }

20
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/text-decoration-001-ref.html
View file

@ -1,13 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Shadow DOM Test</title>
<link rel="author" title="Masaya Iseki" href="mailto:iseki.m.aa@gmail.com">
</head>
<body>
<span>
if NOT underlined, it is success.
</span>
</body>
<head>
<meta charset="utf-8">
<title>Shadow DOM Test</title>
<link rel="author" title="Masaya Iseki" href="mailto:iseki.m.aa@gmail.com">
</head>
<body>
<span>
if NOT underlined, it is success.
</span>
</body>
</html>

17
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-001.html
View file

@ -19,7 +19,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -66,7 +66,6 @@ var HTML_CONTENT = [
'<embed></embed>',
'<form></form>',
'<script><' + '/script>',
'<applet></applet>',
'</body>'
].join('\n');
@ -91,7 +90,7 @@ function populateTestContentToShadowRoot(shadowRoot) {
function createDocumentForTesting() {
var doc = document.implementation.createHTMLDocument('');
populateTestContentToHostDocument(doc);
var shadowRoot = doc.documentElement.createShadowRoot();
var shadowRoot = doc.body.attachShadow({mode: 'open'});
populateTestContentToShadowRoot(shadowRoot);
return doc;
}
@ -121,13 +120,17 @@ test(function () {
test(function () {
var doc = document.implementation.createHTMLDocument('');
populateTestContentToHostDocument(doc);
var shadowRoot = doc.documentElement.createShadowRoot();
// 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.getElementsByTagName('title')[0].textContent =
shadowRoot.querySelector('title').textContent =
'Title of shadow tree';
assert_equals(doc.title, 'Title of host document');
@ -165,7 +168,7 @@ test(function () {
generate_tests(
testHTMLCollection,
['anchors', 'applets', 'all'].map(
['anchors', 'all'].map(
function (accessor) {
return [
'Elements in a shadow tree should not be accessible from ' +
@ -213,7 +216,7 @@ test(function () {
var shadowRoot = doc.documentElement.createShadowRoot();
populateTestContentToShadowRoot(shadowRoot);
shadowRoot.getElementsByTagName('p')[0].id = 'test-id';
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 ' +

38
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/dom-tree-accessors-002.html
View file

@ -18,7 +18,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>
@ -30,53 +30,33 @@ function assert_singleton_node_list(nodeList, expectedNode) {
test(function () {
var doc = document.implementation.createHTMLDocument('Test');
var shadowRoot = doc.body.createShadowRoot();
var shadowRoot = doc.body.attachShadow({mode: 'open'});
var image = doc.createElement('img');
shadowRoot.appendChild(image);
assert_singleton_node_list(shadowRoot.getElementsByTagName('img'), image);
assert_singleton_node_list(shadowRoot.querySelectorAll('img'), image);
},
'Elements in a shadow tree should be accessible via shadow root\'s ' +
'getElementsByTagName() DOM tree accessor.'
);
test(function () {
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 imageHost = doc.createElementNS(namespace, 'img');
body.appendChild(imageHost);
doc.documentElement.appendChild(body);
var shadowRoot = body.createShadowRoot();
var imageShadow = doc.createElementNS(namespace, 'img');
shadowRoot.appendChild(imageShadow);
assert_singleton_node_list(
shadowRoot.getElementsByTagNameNS(namespace, 'img'), imageShadow);
},
'Elements in a shadow tree should be accessible via shadow root\'s ' +
'getElementsByTagNameNS() DOM tree accessor.'
'querySelectorAll() DOM tree accessor.'
);
test(function () {
var doc = document.implementation.createHTMLDocument('Test');
var shadowRoot = doc.body.createShadowRoot();
var shadowRoot = doc.body.attachShadow({mode: 'open'});
var div = doc.createElement('div');
div.className = 'div-class';
shadowRoot.appendChild(div);
assert_singleton_node_list(
shadowRoot.getElementsByClassName('div-class'), div);
shadowRoot.querySelectorAll('.div-class'), div);
},
'Elements in a shadow tree should be accessible via shadow root\'s ' +
'getElementsByClassName() DOM tree accessor.'
'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.createShadowRoot();
var shadowRoot = doc.body.attachShadow({mode: 'open'});
var div = doc.createElement('div');
div.id = 'div-id';
shadowRoot.appendChild(div);

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-001.html
View file

@ -19,7 +19,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>

9
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/ownerdocument-002.html
View file

@ -19,7 +19,8 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
<script src="../../../resources/shadow-dom-utils.js"></script>
</head>
<body>
<div id="log"></div>
@ -28,8 +29,8 @@ function testElement(elementName) {
var doc = document.implementation.createHTMLDocument('Test');
var element = doc.createElement(elementName);
doc.body.appendChild(element);
var shadowRoot = element.createShadowRoot();
HTML5_ELEMENT_NAMES.forEach(function (name) {
var shadowRoot = element.attachShadow({mode: 'open'});
ATTACHSHADOW_SAFELISTED_ELEMENTS.forEach(function (name) {
shadowRoot.appendChild(doc.createElement(name));
});
@ -40,7 +41,7 @@ function testElement(elementName) {
}
}
var testParameters = HTML5_ELEMENT_NAMES.map(function (name) {
var testParameters = ATTACHSHADOW_SAFELISTED_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 "' +

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-001.html
View file

@ -17,7 +17,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/selectors-api-002.html
View file

@ -18,7 +18,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>

2
tests/wpt/web-platform-tests/shadow-dom/untriaged/shadow-trees/upper-boundary-encapsulation/shadow-root-001.html
View file

@ -18,7 +18,7 @@ policies and contribution forms [3].
<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="../../testcommon.js"></script>
<script src="../../../../html/resources/common.js"></script>
</head>
<body>
<div id="log"></div>

Some files were not shown because too many files have changed in this diff Show more