mirror of
https://github.com/servo/servo.git
synced 2025-09-15 09:28:20 +01:00
Update web-platform-tests to revision acd60f9e55532f03fc905e61591b7fd7db2f08d1
This commit is contained in:
Ms2ger
parent
a1cd27e6a3
commit
be4f0ad8de
44 changed files with 544 additions and 663 deletions
|
|
@ -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_10_04_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/#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>
|
||||
<link rel="stylesheet" href="/resources/testharness.css">
|
||||
</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" reset-style-inheritance=true></content></ul>';
|
||||
s.appendChild(div);
|
||||
|
||||
assert_equals(d.querySelector('#li1').offsetHeight, defHeight1, 'Point 21: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li3').offsetHeight, defHeight3, 'Point 22: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li5').offsetHeight, defHeight5, '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_04_T01');
|
||||
|
||||
|
||||
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" reset-style-inheritance></content></ul>';
|
||||
s.appendChild(div);
|
||||
|
||||
assert_equals(d.querySelector('#li1').offsetHeight, defHeight1, 'Point 21: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li3').offsetHeight, defHeight3, 'Point 22: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li5').offsetHeight, defHeight5, '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_04_T02');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,189 +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_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-element">
|
||||
<meta name="assert" content="The shadow HTML element: reset-style-inheritance attribute">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="../../testcommon.js"></script>
|
||||
<link rel="stylesheet" href="/resources/testharness.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
// test reset-style-inheritance=true
|
||||
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 reset-style-inheritance=true></shadow>';
|
||||
s2.appendChild(div2);
|
||||
|
||||
//styles should be reset
|
||||
assert_equals(d.querySelector('#li1').offsetHeight, defHeight1, 'Point 31: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li3').offsetHeight, defHeight3, 'Point 32: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li5').offsetHeight, defHeight5, 'Point 33: Inherited ' +
|
||||
'element style should be reset');
|
||||
|
||||
}), 'A_10_05_03_T01');
|
||||
|
||||
|
||||
//test 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 reset-style-inheritance></shadow>';
|
||||
s2.appendChild(div2);
|
||||
|
||||
//styles should be reset
|
||||
assert_equals(d.querySelector('#li1').offsetHeight, defHeight1, 'Point 31: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li3').offsetHeight, defHeight3, 'Point 32: Inherited ' +
|
||||
'element style should be reset');
|
||||
assert_equals(d.querySelector('#li5').offsetHeight, defHeight5, 'Point 33: Inherited ' +
|
||||
'element style should be reset');
|
||||
|
||||
}), 'A_10_05_03_T02');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -35,7 +35,7 @@ A_05_05_01_T01.step(unit(function (ctx) {
|
|||
//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 #volume-slider-thumb
|
||||
//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;
|
||||
|
|
@ -68,7 +68,7 @@ A_05_05_01_T02.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #volume-shadow-root relative target #volume-slider-thumb
|
||||
//For #volume-shadow-root relative target #volume-slider-thumb
|
||||
roots.volumeShadowRoot.addEventListener('click',
|
||||
A_05_05_01_T02.step_func(function(event) {
|
||||
invoked = true;
|
||||
|
|
@ -101,13 +101,13 @@ A_05_05_01_T03.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #volume-slider relative target #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong target');
|
||||
assert_true(event.currentTarget.getAttribute('id'), 'volume-slider',
|
||||
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider',
|
||||
'Wrong currentTarget');
|
||||
}), false);
|
||||
|
||||
|
|
@ -135,13 +135,13 @@ A_05_05_01_T04.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #volume-slider-container relative target #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong target');
|
||||
assert_true(event.currentTarget.getAttribute('id'), 'volume-slider',
|
||||
assert_equals(event.currentTarget.getAttribute('id'), 'volume-slider-container',
|
||||
'Wrong currentTarget');
|
||||
}), false);
|
||||
|
||||
|
|
@ -168,13 +168,13 @@ A_05_05_01_T05.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #controls relative target #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong target');
|
||||
assert_true(event.currentTarget.getAttribute('id'), 'volume-slider',
|
||||
assert_equals(event.currentTarget.getAttribute('id'), 'controls',
|
||||
'Wrong currentTarget');
|
||||
}), false);
|
||||
|
||||
|
|
@ -201,13 +201,13 @@ A_05_05_01_T06.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #player-shadow-root relative target #volume-slider
|
||||
roots.playerShadowRoot.addEventListener('click',
|
||||
//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'), 'volume-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
|
||||
'Wrong target');
|
||||
assert_true(event.currentTarget.getAttribute('id'), 'volume-slider',
|
||||
assert_equals(event.currentTarget.getAttribute('id'), 'player-shadow-host',
|
||||
'Wrong currentTarget');
|
||||
}), false);
|
||||
|
||||
|
|
@ -235,13 +235,13 @@ A_05_05_01_T07.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #player relative target #player
|
||||
//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',
|
||||
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
|
||||
'Wrong target');
|
||||
assert_true(event.currentTarget.getAttribute('id'), 'player',
|
||||
assert_equals(event.currentTarget.getAttribute('id'), 'player',
|
||||
'Wrong currentTarget');
|
||||
}), false);
|
||||
|
||||
|
|
|
|||
|
|
@ -60,11 +60,11 @@ A_05_01_04_T02.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #volume-shadow-root relative target is #volume-slider-thumb
|
||||
roots.volumeShadowRoot.addEventListener('click',
|
||||
//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-slider-thumb',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
@ -90,11 +90,11 @@ A_05_01_04_T03.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #volume-slider relative target is #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
@ -118,11 +118,11 @@ A_05_01_04_T04.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #volume-slider-container relative target is #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
@ -146,11 +146,11 @@ A_05_01_04_T05.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #controls relative target is #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
@ -174,11 +174,11 @@ A_05_01_04_T06.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #player-shadow-root relative target is #volume-slider
|
||||
//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-slider',
|
||||
assert_equals(event.target.getAttribute('id'), 'volume-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
@ -203,11 +203,11 @@ A_05_01_04_T07.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #player relative target is #player
|
||||
//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',
|
||||
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
@ -344,11 +344,11 @@ A_05_01_04_T12.step(unit(function (ctx) {
|
|||
//expected result of what relative target should be see
|
||||
//see at http://www.w3.org/TR/shadow-dom/#event-retargeting-example
|
||||
|
||||
//For #player relative target is #player
|
||||
//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',
|
||||
assert_equals(event.target.getAttribute('id'), 'player-shadow-host',
|
||||
'Wrong related target');
|
||||
}), false);
|
||||
|
||||
|
|
|
|||
|
|
@ -228,30 +228,30 @@ function createTestMediaPlayer(d) {
|
|||
d.body.innerHTML = '' +
|
||||
'<div id="player">' +
|
||||
'<input type="checkbox" id="outside-control">' +
|
||||
'<div id="player-shadow-root">' +
|
||||
'<div id="player-shadow-host">' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
|
||||
var playerShadowRoot = d.querySelector('#player-shadow-root').createShadowRoot();
|
||||
var playerShadowRoot = d.querySelector('#player-shadow-host').createShadowRoot();
|
||||
playerShadowRoot.innerHTML = '' +
|
||||
'<div id="controls">' +
|
||||
'<button class="play-button">PLAY</button>' +
|
||||
'<input type="range" id="timeline">' +
|
||||
'<div id="timeline-shadow-root">' +
|
||||
'<div tabindex="0" id="timeline">' +
|
||||
'<div id="timeline-shadow-host">' +
|
||||
'</div>' +
|
||||
'</input>' +
|
||||
'</div>' +
|
||||
'<div class="volume-slider-container" id="volume-slider-container">' +
|
||||
'<input type="range" class="volume-slider" id="volume-slider">' +
|
||||
'<div id="volume-shadow-root">' +
|
||||
'<div tabindex="0" class="volume-slider" id="volume-slider">' +
|
||||
'<div id="volume-shadow-host">' +
|
||||
'</div>' +
|
||||
'</input>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
|
||||
var timeLineShadowRoot = playerShadowRoot.querySelector('#timeline-shadow-root').createShadowRoot();
|
||||
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-root').createShadowRoot();
|
||||
var volumeShadowRoot = playerShadowRoot.querySelector('#volume-shadow-host').createShadowRoot();
|
||||
volumeShadowRoot.innerHTML = '<div class="slider-thumb" id="volume-slider-thumb"></div>';
|
||||
|
||||
return {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue