FireFoxでsvgパスの実際のサイズを検出する方法は？

Question

私はすべてが順調であるGoogle Chromeで

を、本当の「パス」のサイズを取得しようとしているためgetBoundingClientRect機能を使用しますが、Firefoxでは、私は異なる結果を取得しています：

1. 100px x 100px 
2. 100px x 100px 

しかし、Firefoxで：

1. 104px x 104px 
2. 100px x 100px 

なぜstroke-width="1"に4pxが追加されましたか？どのようにFFで空のスペースなしで実際のサイズを取得するには？

<div>With stroke-width="1"</div> 
 
<svg width="110" height="110"> 
 
    <path stroke-width="1" d="M0 0 L 100 0 L100 100 L 0 100 Z" fill="black" stroke="black"></path> 
 
</svg> 
 
<br> 
 
<br> 
 
<div>With stroke-width="0"</div> 
 
<svg width="110" height="110"> 
 
    <path stroke-width="0" d="M0 0 L 100 0 L100 100 L 0 100 Z" fill="black" stroke="black"></path> 
 
</svg>

P.S. 私はこのパスに "テキスト付きの行"を追加するためにtriyngです。 getBoundingClientRect関数でパスの位置+サイズを取得し、それらの座標で新しいdivを作成します。

結果：

Answer 1

私はFFのためのソリューションを作りました。シンプルだが動作する。

last_current.attr('stroke-width',0); // FireFox fix! 
let c_pos = last_current[0].getBoundingClientRect(); 
last_current.attr('stroke-width', 1); // FireFox fix!