OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <script src="../../../resources/js-test.js"></script> | 4 <script src="../../../resources/js-test.js"></script> |
5 <script src="resources/shadow-dom.js"></script> | 5 <script src="resources/shadow-dom.js"></script> |
6 </head> | 6 </head> |
7 <body> | 7 <body> |
8 <p id="description"></p> | 8 <p id="description"></p> |
9 <div id="sandbox"></div> | 9 <div id="sandbox"></div> |
10 <pre id="console"></pre> | 10 <pre id="console"></pre> |
11 <script> | 11 <script> |
12 var sandbox = document.getElementById('sandbox'); | 12 var sandbox = document.getElementById('sandbox'); |
13 | 13 |
14 function click(path) { | 14 function click(path) { |
15 debug(''); | 15 debug(''); |
16 debug('click #' + path); | 16 debug('click #' + path); |
17 var clickEvent = document.createEvent("MouseEvents"); | 17 var clickEvent = document.createEvent("MouseEvents"); |
18 clickEvent.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false
, false, false, false, 0, null); | 18 clickEvent.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false
, false, false, false, 0, null); |
19 getNodeInTreeOfTrees(path).dispatchEvent(clickEvent); | 19 getNodeInComposedTree(path).dispatchEvent(clickEvent); |
20 } | 20 } |
21 | 21 |
22 sandbox.appendChild( | 22 sandbox.appendChild( |
23 createDOM('div', {'id': 'A'}, | 23 createDOM('div', {'id': 'A'}, |
24 createDOM('div', {'id': 'B'}, | 24 createDOM('div', {'id': 'B'}, |
25 createDOM('div', {'id': 'C'})), | 25 createDOM('div', {'id': 'C'})), |
26 createShadowRoot({'id': 'D'}, | 26 createShadowRoot({'id': 'D'}, |
27 createDOM('div', {'id': 'E'}, | 27 createDOM('div', {'id': 'E'}, |
28 createDOM('content', {'id': 'F'}))), | 28 createDOM('content', {'id': 'F'}))), |
29 createShadowRoot({'id': 'G'}, | 29 createShadowRoot({'id': 'G'}, |
30 createDOM('div', {'id': 'H'}, | 30 createDOM('div', {'id': 'H'}, |
31 createDOM('shadow', {'id': 'I'}))))); | 31 createDOM('shadow', {'id': 'I'}))))); |
32 | 32 |
33 ['A', 'B', 'C', 'A/', 'A/E', 'A/F', 'A//', 'A//H', 'A//I'].forEach(function(path
) { | 33 ['A', 'B', 'C', 'A/', 'A/E', 'A/F', 'A//', 'A//H', 'A//I'].forEach(function(path
) { |
34 getNodeInTreeOfTrees(path).addEventListener('click', function(event) { | 34 getNodeInComposedTree(path).addEventListener('click', function(event) { |
35 debug('\nevent.path on node ' + dumpNode(event.currentTarget) + ' (targe
t: ' + dumpNode(event.target) + ')'); | 35 debug('\nevent.path on node ' + dumpNode(event.currentTarget) + ' (targe
t: ' + dumpNode(event.target) + ')'); |
36 debug(dumpNodeList(event.path)); | 36 debug(dumpNodeList(event.path)); |
37 }); | 37 }); |
38 }); | 38 }); |
39 | 39 |
40 click('C'); | 40 click('C'); |
41 click('A/E'); | 41 click('A/E'); |
42 click('A//H'); | 42 click('A//H'); |
43 </script> | 43 </script> |
44 </body> | 44 </body> |
45 </html> | 45 </html> |
OLD | NEW |