cross-tree-selection-1.html 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738
  1. <!DOCTYPE HTML>
  2. <html class="reftest-wait">
  3. <head>
  4. <script>
  5. function tweak() {
  6. if (!document.body.createShadowRoot) {
  7. document.documentElement.className = "";
  8. return;
  9. }
  10. var host = document.getElementById("host");
  11. var shadow = host.createShadowRoot();
  12. var textNode = document.createTextNode(" World");
  13. shadow.appendChild(textNode);
  14. // Create a selection with focus preceeding anchor
  15. var selection = window.getSelection();
  16. var range = document.createRange();
  17. range.setStart(shadow, 1);
  18. range.setEnd(shadow, 1);
  19. selection.addRange(range);
  20. selection.extend(shadow, 0);
  21. // Extend selection into a different node tree
  22. // (from ShadowRoot into the previous node in the parent node tree).
  23. setTimeout(function() {
  24. selection.extend(document.getElementById("previous"), 0);
  25. document.documentElement.className = '';
  26. }, 100);
  27. }
  28. </script>
  29. </head>
  30. <body onload="tweak()">
  31. <span id="previous">Hello</span><span id="host"></span>
  32. </body>
  33. </html>