How to find out the actual size of a text tag using Javascript?

Question

JavaScript

Hello friends!
Thank you for noticing my post.
There is such a design:

<div style="width:530px; height:630px;">
<svg width="530" height="630" viewBox="0 0 530 630">
<g id="obj"><text font-family="'Open Sans'" font-size="25px" fill="rgb(0, 0, 0)">123123123</text></g>
</svg>
<div id="bRect"></div>
</div>

Here you can see that in the 530x630 block there is an svg with the same size, there is also a nested #bRect block in the block.
My task: #bRect should describe the contour of #obj, and manipulations will be performed on #obj (movement, rotation, scale). This requires knowing the size of the object and its offset, and getBBox() and getBoundingClientRect() do not return the correct size for a text object. For manipulation over objects I use GSAP.
Questions :
1. How to find out the size of the text or g#bRect group if Google Fonts is used.
2. Who and what does with the offset [x;y], which is returned by getBBox(), in order to put exactly the objects #bRect and #obj.
Thanks for the help.

Answer 1

If I didn’t make a mistake in the syntax, then the first question can be done like this

let g = document.querySelector('#obj');
let tagText = g.firstElementChild;
let tagTextWidth = tagText.offsetWidth; // Размеры
let tagTextHeight = tagText.offsetHeight; // блока