title: Firefox getBoundingClientRect() does not account for transforms
body: <p>I'm adding some SVG Paths to my web page, but am having difficulty with Firefox 43.0. It appears that when I apply <code>transform: scale(0.1)</code> to my path, Firefox does not update the bounding client rectangle (via <code>getBoundingClientRect()</code>)</p>
  
  <p>Here's a screenshot of my Path before the transform, and the correct bounding rectangle:</p>
  
  <p><a href="https://i.stack.imgur.com/K5ZsB.png" rel="noreferrer"><img src="https://i.stack.imgur.com/K5ZsB.png" alt="Path without transform"></a></p>
  
  <p>And here it is with the transform applied, with the visual clearly outside the bounding box:</p>
  
  <p><a href="https://i.stack.imgur.com/1dqde.png" rel="noreferrer"><img src="https://i.stack.imgur.com/1dqde.png" alt="Path with transform"></a></p>
  
  <p>By contrast, here is Chrome updating its bounding box as expected. (Note the constrained proportions.)</p>
  
  <p><a href="https://i.stack.imgur.com/rnpMM.png" rel="noreferrer"><img src="https://i.stack.imgur.com/rnpMM.png" alt="Path with transform in Chrome"></a></p>
  
  <p>This problem isn't present on either Chrome or Edge. I did find <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=591718" rel="noreferrer">this old bug from 2012</a> which says the problem was fixed in version 12.0, and the documentation states:</p>
  
  <blockquote>
    <p>Starting from Gecko 12.0 (Firefox 12.0 / Thunderbird 12.0 / SeaMonkey 2.9), the effect of CSS transforms is considered when computing the element's bounding rectangle.</p>
  </blockquote>
  
  <p>...which doesn't seem to be true. For the other browsers, I was scaling down my circle to 10% of its original size, then computing the coordinate offset from the client rectangle to center it on its original 100% scale position. However, since the client rectangle isn't updated after the transform in Firefox, it's messing up the calculations.</p>
  
  <p>How do I work around this for Firefox?</p>