getBoundingClientRect 在 Safari 中返回 0 表示上、左、右、下

Question

所以，我有一个由 Facebook 提供支持的 contenteditable div draft-js。我需要获得该 div 内插入符号的视觉位置，并且我实现了这个（适用于 Firefox 和 Chrome）：

const selection = window.getSelection && window.getSelection();
if (selection.rangeCount > 0) {
    const coordinates = selection.getRangeAt(0).getBoundingClientRect();
}

在 Chrome 和 Firefox 中我得到了正确的坐标。然而，在 Firefox 中，我的所有位置属性都为 0。有什么解决方法/跨浏览器解决方案吗？

Answer 1

似乎我已经使用下一个代码解决了问题：

let range = window.getSelection().getRangeAt(0);
range = range.cloneRange();
range.setStart(range.startContainer, 0);
range.getBoundingClientRect();

这是小提琴。

2020 年 2 月 13 日更新：

当输入是多行时，这里更新了第一行的固定插入符位置的小提琴。