你在CSSWG#2514上感觉到了。
问题是浏览器无法计算出DOMRects组成的折叠Range锚定到Element（而不是Node）。
本文CKEditor issue列出了可能发生这种情况的几种情况，以及一些潜在的解决方法。

• • 1. Element中的折叠Range具有内容。（很可能是您的情况）**

在最近的TextNode上设置Range将允许浏览器正确地计算框：

const el = document.querySelector("div");
const range = new Range();
// to show the "bug"
range.selectNode(el);
range.collapse(true);
console.log("selecting the Element", range.getClientRects().length); // 0

// the workaround
range.setStart(el.firstChild, 0);
range.collapse(true);
console.log("selecting the Node", range.getClientRects().length); // 1

<div>target</div>

尽管元素的firstChild也可能不是TextNode，所以实际上需要一个方法来检索Element中的第一个TextNode：
一个二个一个一个

• • 2.空Element中的Range（因此没有TextNode可供选择）**

对于这个示例，您可以尝试在Element中附加一个零宽度空格（ZWSP）字符，在新创建的TextNode上进行测量，然后删除该字符。

function getFirstTextNode(target) {
  return document.createNodeIterator(target, NodeFilter.SHOW_TEXT).nextNode();  
}
const el = document.querySelector("div");
const range = new Range();
let firstTextNode = getFirstTextNode(el);
const wasEmpty = !firstTextNode;

if (wasEmpty) {
  console.log("inserting a ZWSP");
  firstTextNode = new Text("\u200B");
  el.append(firstTextNode);
}
range.setStart(firstTextNode, 0);
range.collapse(true);
const rect = range.getClientRects()[0];
if (wasEmpty) {
  firstTextNode.remove();
}
console.log(rect); // DOMRect

<div></div>

• • 3.位于两个元素之间的Range**

...</div>|<div>...

这里你可以再一次使用ZWSP技巧。检测这个可能会变得更简洁一些，并且OP显然想在Element的开头设置插入符号，这对他们来说似乎是不可能的。所以我将离开这个例子。