JSFiddle - React, Tailwind, and code Playground

HTML

<svg>
    <clipPath id="clip">
        <rect width="50" height="100"/>
    </clipPath>
    <rect id="r" x="20" y="20" width="100" height="100" stroke-width="20" clip-path="url(#clip)"/>
</svg>

JavaScript

function rectToString(rect) {
  return rect.left + "," + rect.top + "," + rect.width + "," + rect.height;
};

var p = document.createElement("p");
p.textContent = "bbox: " + rectToString(document.getElementById("r").getBoundingClientRect());

document.body.appendChild(p);