从选择范围中删除节点后,ExecCommand在Chrome 60中无法正常工作

Question

我们在调试一个非常旧版本的Redactor编辑器时发现了一个非常棘手的案例.换句话说,span从选择范围中删除节点会导致execCommandChrome v60中的行为不正确,但在Firefox和Chrome v58中它正常运行.

以下是重现问题的小提琴:https://jsfiddle.net/47wqpv1f/4/.

选择一个单词,然后按按钮.你可能会在这里看到,在Firefox和Chrome 58中,文字将会被淘汰,而在Chrome 60中则保持不变.

在格式化操作(例如粗体)上,编辑器用两个不同的"标记"元素围绕选择范围.

  var range2 = range.cloneRange();
  var marker = document.createElement('span');
  marker.id="selection-marker-1";
  marker.className="redactor-selection-marker";
  marker.innerHTML = markerHTML;  

  range2.collapse(true);
  range2.insertNode(marker);

然后编辑器通过选择进行一些操作,然后重置选择以匹配标记边界.

  range.setStart(document.getElementById('selection-marker-1'), 0);
  range.setEnd(document.getElementById('selection-marker-2'), 0);

在该编辑器删除标记节点之后,其意图应该保留原始选择.

  marker.parentNode.removeChild(marker);
  marker2.parentNode.removeChild(marker2);

接下来,编辑器再次为格式化过程的下一步添加标记,然后执行execCommand删除操作.

Chrome 60只会strike在左侧标记处添加标记,而其他提到的浏览器将strike围绕整个选择(在这种情况下,这是我预期的行为).

我可以在这里想到不同的解决方法但是在新Chrome中改变行为的实际原因是什么？

Answer 1

这可能只是 Chrome 中的一个错误，但请注意，根据规范（https://w3c.github.io/editing/execCommand.html处于草稿状态，预计将保留在那里。它受支持，但在每个浏览器中可能不会以完全相同的方式支持。如果没有可靠的规范可供遵循，即使跨浏览器版本，尤其是从一种浏览器到另一种浏览器，实现也可能会有所不同。

从长远来看，使用定义更明确的标准的实现可能会取得更大的成功（当然，这是一个挑战！），因为它们不是一个移动目标！