selection-range-in-shadow-after-the-shadow-removed.tentative.html (4740B)
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="variant" content="?mode=closed"> 6 <meta name="variant" content="?mode=open"> 7 <title>Selection range in shadow after removing the shadow</title> 8 <script src=/resources/testharness.js></script> 9 <script src=/resources/testharnessreport.js></script> 10 <script> 11 "use strict"; 12 13 addEventListener("load", () => { 14 const mode = (new URLSearchParams(document.location.search)).get("mode"); 15 const container = document.querySelector("div"); 16 test(() => { 17 const host = document.createElement("div"); 18 host.id = "host"; 19 const root = host.attachShadow({mode}); 20 root.innerHTML = '<div id="in-shadow">ABC</div>'; 21 container.appendChild(host); 22 getSelection().collapse(root.firstChild.firstChild, 2); 23 const range = getSelection().getRangeAt(0); 24 host.remove(); 25 // The range should be kept in the shadow because it's referred by JS as 26 // a range. 27 assert_equals(range.startContainer, root.firstChild.firstChild, "startContainer should not be changed"); 28 assert_equals(range.startOffset, 2, "startOffset should not be changed"); 29 // It may be reasonable to just remove the range in removed shadow. 30 // This matches with move-selection-range-into-different-root.tentative.html 31 assert_equals(getSelection().rangeCount, 0, "Selection should not have the range in removed shadow"); 32 }, "Selection range in shadow should not be as a selection range after the host is removed"); 33 34 test(() => { 35 const wrapper = document.createElement("div"); 36 wrapper.id = "wrapper"; 37 const host = document.createElement("div"); 38 host.id = "host"; 39 const root = host.attachShadow({mode}); 40 root.innerHTML = '<div id="in-shadow">ABC</div>'; 41 wrapper.appendChild(host); 42 container.appendChild(wrapper); 43 getSelection().collapse(root.firstChild.firstChild, 2); 44 const range = getSelection().getRangeAt(0); 45 wrapper.remove(); 46 // The range should be kept in the shadow because it's referred by JS as 47 // a range. 48 assert_equals(range.startContainer, root.firstChild.firstChild, "startContainer should not be changed"); 49 assert_equals(range.startOffset, 2, "startOffset should not be changed"); 50 // It may be reasonable to just remove the range in removed shadow. 51 // This matches with move-selection-range-into-different-root.tentative.html 52 assert_equals(getSelection().rangeCount, 0, "Selection should not have the range in removed shadow"); 53 }, "Selection range in shadow should not be as a selection range after the host parent is removed"); 54 55 test(() => { 56 const host = document.createElement("div"); 57 host.id = "host"; 58 const root = host.attachShadow({mode}); 59 root.innerHTML = '<div id="in-shadow">ABC</div>'; 60 container.appendChild(host); 61 getSelection().collapse(root.firstChild.firstChild, 2); 62 const range = getSelection().getRangeAt(0); 63 host.replaceWith(host); 64 // The range should be kept in the shadow because it's referred by JS as 65 // a range. 66 assert_equals(range.startContainer, root.firstChild.firstChild, "startContainer should not be changed"); 67 assert_equals(range.startOffset, 2, "startOffset should not be changed"); 68 // It may be reasonable to just remove the range in removed shadow. 69 // This matches with move-selection-range-into-different-root.tentative.html 70 assert_equals(getSelection().rangeCount, 0, "Selection should not have the range in removed shadow"); 71 host.remove(); 72 }, "Selection range in shadow should not be as a selection range after the host is replaced with itself (.replaceWith)"); 73 74 test(() => { 75 const host = document.createElement("div"); 76 host.id = "host"; 77 const root = host.attachShadow({mode}); 78 root.innerHTML = '<div id="in-shadow">ABC</div>'; 79 container.appendChild(host); 80 getSelection().collapse(root.firstChild.firstChild, 2); 81 const range = getSelection().getRangeAt(0); 82 container.replaceChild(host, host); 83 // The range should be kept in the shadow because it's referred by JS as 84 // a range. 85 assert_equals(range.startContainer, root.firstChild.firstChild, "startContainer should not be changed"); 86 assert_equals(range.startOffset, 2, "startOffset should not be changed"); 87 // It may be reasonable to just remove the range in removed shadow. 88 // This matches with move-selection-range-into-different-root.tentative.html 89 assert_equals(getSelection().rangeCount, 0, "Selection should not have the range in removed shadow"); 90 host.remove(); 91 }, "Selection range in shadow should not be as a selection range after the host is replaced with itself (.replaceChild"); 92 }, {once: true}); 93 </script> 94 </head> 95 <body><div id="container"></div></body> 96 </html>