2a9dc5f3e4
Currently, `ShadowRoot::Unbind` does not notify the observers of the notification. With this change, `nsRange` starts removing itself from all `Selection`s if its root becomes disconnected. This behavior is different from Chrome, Chrome allows the disconnected range in shadow as a selection range. However, it does not match with the behavior tested in `move-selection-range-into-different-root.tentative.html` [1][2]. Therefore, I think that removing the range from `Selection` is reasonable for now because it's not reasonable to add a check to all selection range getters/users to check whether the range is in the composed tree. 1. https://searchfox.org/mozilla-central/rev/b60cb73160843adb5a5a3ec8058e75a69b46acf7/testing/web-platform/tests/selection/move-selection-range-into-different-root.tentative.html 2. https://wpt.fyi/results/selection/move-selection-range-into-different-root.tentative.html?run_id=5070898326929408&run_id=5147803004698624&run_id=5098392828510208&run_id=5175063246012416 Differential Revision: https://phabricator.services.mozilla.com/D204218
70 lines
2.9 KiB
HTML
70 lines
2.9 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Selection range in an editing host after the host is removed</title>
|
|
<script src=/resources/testharness.js></script>
|
|
<script src=/resources/testharnessreport.js></script>
|
|
<script>
|
|
"use strict";
|
|
|
|
addEventListener("load", () => {
|
|
const container = document.querySelector("div");
|
|
test(() => {
|
|
const editingHost = document.createElement("div");
|
|
editingHost.contentEditable = true;
|
|
editingHost.innerHTML = "ABC<br>";
|
|
container.appendChild(editingHost);
|
|
editingHost.focus();
|
|
getSelection().collapse(editingHost, 0);
|
|
editingHost.remove();
|
|
assert_equals(getSelection().focusNode, container, "focusNode should be the container");
|
|
assert_equals(getSelection().focusOffset, 0, "focusOffset should be 0");
|
|
}, "Selection range in an editing host should be collapsed where the host was after it's removed");
|
|
|
|
test(() => {
|
|
const wrapper = document.createElement("div");
|
|
wrapper.id = "wrapper";
|
|
const editingHost = document.createElement("div");
|
|
editingHost.contentEditable = true;
|
|
editingHost.innerHTML = "ABC<br>";
|
|
wrapper.appendChild(editingHost);
|
|
container.appendChild(wrapper);
|
|
editingHost.focus();
|
|
getSelection().collapse(editingHost, 0);
|
|
wrapper.remove();
|
|
assert_equals(getSelection().focusNode, container, "focusNode should be the container");
|
|
assert_equals(getSelection().focusOffset, 0, "focusOffset should be 0");
|
|
}, "Selection range in an editing host should be collapsed where the host was after its parent is removed");
|
|
|
|
test(() => {
|
|
const editingHost = document.createElement("div");
|
|
editingHost.contentEditable = true;
|
|
editingHost.innerHTML = "ABC<br>";
|
|
container.appendChild(editingHost);
|
|
editingHost.focus();
|
|
getSelection().collapse(editingHost, 0);
|
|
editingHost.replaceWith(editingHost);
|
|
assert_equals(getSelection().focusNode, container, "focusNode should be the container");
|
|
assert_equals(getSelection().focusOffset, 0, "focusOffset should be 0");
|
|
editingHost.remove();
|
|
}, "Selection range in an editing host should be collapsed where the host was after it's replaced with itself (.replaceWith)");
|
|
|
|
test(() => {
|
|
const editingHost = document.createElement("div");
|
|
editingHost.contentEditable = true;
|
|
editingHost.innerHTML = "ABC<br>";
|
|
container.appendChild(editingHost);
|
|
editingHost.focus();
|
|
getSelection().collapse(editingHost, 0);
|
|
container.replaceChild(editingHost, editingHost);
|
|
assert_equals(getSelection().focusNode, container, "focusNode should be the container");
|
|
assert_equals(getSelection().focusOffset, 0, "focusOffset should be 0");
|
|
editingHost.remove();
|
|
}, "Selection range in an editing host should be collapsed where the host was after it's replaced with itself (.replaceChild)");
|
|
}, {once: true});
|
|
</script>
|
|
</head>
|
|
<body><div id="container"></div></body>
|
|
</html>
|