File: view-box-mutation-003.html

package info (click to toggle)

firefox-esr 115.15.0esr-1~deb12u1

links: PTS, VCS
area: main
in suites: bookworm
size: 3,659,216 kB
sloc: cpp: 6,676,686; javascript: 5,690,965; ansic: 3,328,546; python: 1,120,594; asm: 397,163; xml: 180,531; java: 178,838; sh: 68,930; makefile: 20,999; perl: 12,595; objc: 12,561; yacc: 4,583; cs: 3,846; pascal: 2,840; lex: 1,720; ruby: 1,079; exp: 762; php: 436; lisp: 258; awk: 247; sql: 66; sed: 54; csh: 10

file content (26 lines) | stat: -rw-r--r-- 910 bytes

parent folder | download | duplicates (19)

<!doctype html>
<html class="reftest-wait">
<title>transform-box: view-box, viewport mutated, &lt;foreignObject></title>
<link rel="match" href="reference/greensquare200x200.html">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-box">
<script src="/common/reftest-wait.js"></script>
<script src="/common/rendering-utils.js"></script>
<style>
#target {
  transform-box: view-box;
  transform: translate(-50%, 0);
}
</style>
<p>There should be a green 200x200 rectangle below, and no red.</p>
<svg width="400" height="200">
  <rect width="200" height="200" fill="red"/>
  <foreignObject id="target" x="100" width="200" height="100%">
    <div style="width: 200px; height: 200px; background-color: green"></div>
  </foreignObject>
</svg>
<script>
  waitForAtLeastOneFrame().then(() => {
    document.querySelector('svg').setAttribute('width', 200);
    takeScreenshot();
  });
</script>