tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

stroke-box-mutation-004.html (968B)

      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <title>transform-box: stroke-box, on group (&lt;g>), child shape mutated</title>
      4 <link rel="match" href="reference/svgbox-rect-ref.html">
      5 <link rel="help" href="https://drafts.csswg.org/css-transforms-1/#transform-box">
      6 <script src="/common/reftest-wait.js"></script>
      7 <script src="/common/rendering-utils.js"></script>
      8 <meta name="assert" content="This should display a rect whose center of rotation is at (20, 0) of its stroke-box."/>
      9 <style>
     10 #target {
     11  transform-box: stroke-box;
     12  transform-origin: 20px 0px;
     13  transform: rotate(90deg);
     14 }
     15 #target > rect {
     16  fill: green;
     17  stroke: black;
     18  stroke-width: 20;
     19 }
     20 </style>
     21 <svg width="400" height="300">
     22  <g id="target">
     23    <rect width="100" height="100" x="100" y="100"/>
     24  </g>
     25 </svg>
     26 <script>
     27  waitForAtLeastOneFrame().then(() => {
     28    const rect = document.querySelector('#target > rect');
     29    rect.setAttribute('height', '50');
     30    takeScreenshot();
     31  });
     32 </script>