Javascript Internet Explorer 11中的范围getBoundingClientRect（）顶部不正确

我正在使用Range对象和元素.getBoundingClientRect（）来计算某些文本的位置。我在Chrome和Firefox中得到了预期的结果，但在IE中，顶级属性值是错误的

更具体地说，包含在具有行高值的跨度元素中的文本。这把粗糙的小提琴说明了这个问题

示例HTML

<div style="display:inline-block; width:100px;height:500px; background-  color:red">
    <span id="span1" style="line-height:500px">
        text
    </span>
</div>

当计算范围的DOMRECT

时，IE不考虑线高度属性值。 如果我在Chrome中打开小提琴，我会得到249.09722900390625作为矩形的顶部，而在IE 11中，顶部是8

以前有人见过这个问题吗？有没有办法让IE返回该范围的正确边界客户机rect

var spanEl = document.getElementById("span1");
var textNode = spanEl.childNodes[0]; 
var offsetStart = 0;
var offsetEnd = textNode.nodeValue.length || 0;

var range = document.createRange();
range.setStart(textNode, offsetStart);
range.setEnd(textNode, offsetEnd);

var rect = range.getBoundingClientRect();
console.log(rect.top);