Javascript Chrome为自定义HTML元素的offsetWidth返回0

在尝试创建一个Angular指令，使其内容的大小适应容器的大小时，我遇到了以下问题：

最小HTML代码段：

<my-tag id="testWidth">
  <div>some text</div>
</my-tag>

据我所知，

我的标签应该是一个。还有什么是我做错了，或者这只是Chrome中的一个bug

Chrome版本：49.0.2623.112 m

用于快速测试

我试图了解Chrome的行为是否正确，或者这是否是一个bug

报告说：

HtmleElement.offsetWidth只读属性返回布局
元素的宽度

据我所知，这并不是说这只适用于具有块显示的元素。我也支持我的理解，因为Firefox会返回我所期望的结果

对于
span
标记，也可以观察到相同的行为差异，请参见。
您需要使用
显示：块来设置我的标记元素的样式

这里是fiddle
您还可以获得自定义元素内容的宽度，如下所示：

document.querySelector('custom-element').shadowRoot.querySelector('#content').offsetWidth

默认情况下，块级元素填充其父元素的宽度，如果期望的结果是测量填充内容的元素的实际宽度，那么display:inline Block会起作用。通过指定
display:Block
，可以获得div元素的行为。但好的一点是，如果你想根据元素的内容来测量元素的宽度，
display:inline block
或
float:left
在block元素上就可以了。我已经为这个问题添加了一些背景知识。你能给我指一下说明
offsetWidth
仅适用于
block
元素的文档吗？我找不到任何关于自定义元素显示样式的规范。我想这方面没有具体规定。Chrome决定自定义元素的默认显示样式为
inline
，Firefox决定为
block
。默认样式的浏览器之间还有其他不一致的地方，这就是CSS重置的原因。在这里可以找到一个，您可以看到html5元素在这段代码中被重置为
display:block
。有趣的是，在Firefox88中，我的自定义元素的默认计算显示是内联的，但是它仍然有一个有效的offsetWidth。因此，FireFox似乎不需要块显示来提供offsetWidth。但在Chrome中，Element.getBoundingClientRect（）或Element.getClientRect（）是替代选项，无需切换显示模式。我在Chrome上也遇到了同样的问题。奇怪的是，getBoundingClientRect（）具有正确的宽度
document.querySelector('custom-element').shadowRoot.querySelector('#content').offsetWidth