1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
|
<!DOCTYPE html>
<html>
<head>
<title>DOM mutations test</title>
<link rel="stylesheet" type="text/css"
href="chrome://mochikit/content/tests/SimpleTest/test.css" />
<script type="application/javascript"
src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
<script type="application/javascript"
src="../common.js"></script>
<script type="application/javascript"
src="../role.js"></script>
<script type="application/javascript"
src="../events.js"></script>
<script type="application/javascript">
function runTest()
{
// children change will recreate the table
this.eventSeq = [
new invokerChecker(EVENT_REORDER, getNode('c1'))
];
this.invoke = function runTest_invoke() {
var tree = {
SECTION: [ // c1
{ TEXT_LEAF: [] }, // Some text
{ TEXT_CONTAINER: [
{ TEXT_LEAF: [] } // something with ..
] },
{ TEXT_LEAF: [] } // More text
]
};
testAccessibleTree('c1', tree);
getNode('c1_t').querySelector('span').remove();
};
this.finalCheck = function runTest_finalCheck() {
var tree = {
SECTION: [ // c1
{ TEXT_LEAF: [] }, // Some text
{ TEXT_LEAF: [] } // More text
]
};
testAccessibleTree('c1', tree);
};
this.getID = function runTest_getID()
{
return 'child DOM node is removed before the layout notifies the a11y about parent removal/show';
};
}
function runShadowTest()
{
// children change will recreate the table
this.eventSeq = [
new invokerChecker(EVENT_REORDER, 'c2')
];
this.invoke = function runShadowTest_invoke() {
var tree = {
SECTION: [ // c2
{ TEXT_LEAF: [] }, // Some text
{ TEXT_CONTAINER: [
{ TEXT_LEAF: [] } // something with ..
] },
{ TEXT_LEAF: [] } // More text
]
};
testAccessibleTree('c2', tree);
gShadowRoot.firstElementChild.querySelector('span').remove();
};
this.finalCheck = function runShadowTest_finalCheck() {
var tree = {
SECTION: [ // c2
{ TEXT_LEAF: [] }, // Some text
{ TEXT_LEAF: [] } // More text
]
};
testAccessibleTree('c2', tree);
};
this.getID = function runShadowTest_getID() {
return 'child DOM node is removed before the layout notifies the a11y about parent removal/show in shadow DOM';
};
}
//enableLogging("tree");
//gA11yEventDumpToConsole = true;
var gQueue = null;
function doTest()
{
gQueue = new eventQueue();
gQueue.push(new runTest());
gQueue.push(new runShadowTest());
gQueue.invoke(); // will call SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
addA11yLoadEvent(doTest);
</script>
</head>
<body>
<p id="display"></p>
<div id="content" style="display: none"></div>
<pre id="test">
</pre>
<div id="c1">
<div id="c1_t" style="display: table" role="presentation">
Some text
<span style="display: table-cell">something with accessibles goes here</span>
More text
</div>
</div>
<template id="tmpl">
<div style="display: table" role="presentation">
Some text
<span style="display: table-cell">something with accessibles goes here</span>
More text
</div>
</template>
<div id="c2"><div id="c2_c" role="presentation"></div></div>
<script>
var gShadowRoot = document.getElementById('c2_c').createShadowRoot();
var tmpl = document.getElementById('tmpl');
gShadowRoot.appendChild(document.importNode(tmpl.content, true));
</script>
</body>
</html>
|
