| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <style>* { font-family: monospace; }</style> | 2 <style>* { font-family: monospace; }</style> |
| 3 <div id="host">[<span id="one">One</span> <span id="two">Two</span>]</div> | 3 <div id="host1">[<span id="one">One</span>]</div> |
| 4 <div id="host2">[<span id="two">Two</span>]</div> |
| 4 <script> | 5 <script> |
| 5 function doDrag(start, end) { | 6 function doDrag(start, end) { |
| 6 if (!window.eventSender) | 7 if (!window.eventSender) |
| 7 return; | 8 return; |
| 8 eventSender.mouseMoveTo(start.offsetLeft + (start.offsetWidth / 2), start.of
fsetTop + 3); | 9 eventSender.mouseMoveTo(start.offsetLeft + (start.offsetWidth / 2), start.of
fsetTop + 3); |
| 9 eventSender.mouseDown(); | 10 eventSender.mouseDown(); |
| 10 eventSender.mouseMoveTo(end.offsetLeft + (end.offsetWidth / 2), end.offsetTo
p + 3); | 11 eventSender.mouseMoveTo(end.offsetLeft + (end.offsetWidth / 2), end.offsetTo
p + 3); |
| 11 eventSender.mouseUp(); | 12 eventSender.mouseUp(); |
| 12 } | 13 } |
| 13 var host = document.querySelector('#host'); | 14 var host1 = document.querySelector('#host1'); |
| 14 var shadowRoot = host.createShadowRoot(); | 15 host1.createShadowRoot().innerHTML = '[<content select="#one"></content>]'; |
| 15 shadowRoot.innerHTML = '[<content select="#two"></content> <content select="#one
"></content>]'; | 16 var host2 = document.querySelector('#host2'); |
| 17 host2.createShadowRoot().innerHTML = '[<content select="#two"></content>]'; |
| 16 var one = document.querySelector('#one'); | 18 var one = document.querySelector('#one'); |
| 17 var two = document.querySelector('#two'); | 19 var two = document.querySelector('#two'); |
| 18 doDrag(two, one); | 20 doDrag(two, one); |
| 19 </script> | 21 </script> |
| OLD | NEW |