JSFiddle - React, Tailwind, and code Playground

HTML

<div id="svgContainer">
<svg>
  <g transform="translate(0,-50)">
    <path
       style="fill:#e3d436;stroke:#a80000;stroke-width:1px"
       d="m 40,140 60,-25 120,0 -10,120 -175,-5 z"
       id="mypath" />
  </g>
</svg>
</div>

CSS

#svgContainer {
  border: 1px solid black;
  margin-top: 70px;
}
#svgContainer, #svgContainer svg {
  height: 300px;
}

JavaScript

var path = document.getElementById('mypath');
var pathRect = path.getBoundingClientRect();
var pathBBox = path.getBBox();

alert('A: ' + pathRect.top);
alert('B: ' + pathBBox.y);