如何检索<content>容器的clientWidth

Question

假设我们有模板：

var shadow = document.querySelector('#insider').createShadowRoot();
var template = document.querySelector('#templ');
shadow.appendChild(template.content);
template.remove();

console.debug(document.body.clientWidth)
console.debug(document.querySelector('#insider').clientWidth)
alert(document.body.clientWidth + " == " + document.querySelector('#insider').clientWidth + "?")

<template id="templ">
    <content style="width: 50%"></content>
</template>

<div id="insider">
  test
</div>

https://jsfiddle.net/nogye8yc/

如何在js中以最简单明显的方式获取内容区域的clientWidth？ 样式也可以应用于<content>标签的包装，它不会发生太大变化。

现在它的宽度为100％。

感谢。