testing/web-platform/tests/css/css-transforms/transform-box/view-box.html
author Sam Sneddon <me@gsnedders.com>
Wed, 06 Mar 2019 16:52:04 +0000
changeset 464678 ebf53d1ec11d1ace63aa391143f201b446a644a8
parent 464361 66b1aba3fb4372ec47986e728b1da9b32dd3d368
permissions -rw-r--r--
Bug 1531007 [wpt PR 15523] - Reftest cleanup, a=testonly Automatic update from web-platform-tests Move some references out of support directories See #5843 -- Get rid of reftest/, standardize on reference/ -- Rewrite a lot of the border-*-radius tests These previously formed reftest cycles which means they either didn't get run or didn't clearly test either thing. Given what we have visual tests for, it seems more meaningful to just restrict these tests to testing percentages. Fixes https://github.com/web-platform-tests/wpt/issues/5492. -- Give css/css-backgrounds/border-image-6.html a real ref The current ref is just an image of roughly what it should look like, which isn't at all useful as a reftest (which needs pixel-for-pixel equivalence). -- Get rid of broken reftest, replaced with simple JS test Using an image as a reference is almost certain to never work. -- Make various transform3d tests have sane reference graphs These seem to have been written under the assumption that multiple <link rel=match> links formed multiple required matches rather than alternates. -- Fix text-indent-wrap-001 to have a single reference This seems to have assumed multiple refs were AND, not OR. -- wpt-commits: 8d2a5d9ee6e10577da1342bedc1d64bba9799e94, 29f50c937e8be8ccf73dbb8b8e74f0668a1cd426, b855a6d58fa3d9cf36b128e645091e8dd6d50464, 74c9fbb2d655638bc4079636dfc420bde4d94c6c, 8f61bf97d0ab9e47081f4dd068c0f7e72dabb862, b26ec10a9e9d769a20e9959bb90d1ec904f458e8, 7748ad90a13a51a3f74436295869b2f253f98e8a wpt-pr: 15523

<!DOCTYPE html>
<title>transform-box: view-box</title>
<link rel="match" href="reference/greensquare200x200.html">
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-box">
<style>
svg {
  background-color: red;
}
rect {
  transform-box: view-box;
}
#target1 {
  transform-origin: 25% 25%;
  transform: scale(2);
}
#target2 {
  transform: translate(50%, 0);
}
#target3 {
  transform: translate(0, 50%);
}
#target4 {
  transform-origin: 50% 50%;
  transform: rotate(180deg);
}
</style>
<p>There should be a green 200x200 rectangle below, and no red.</p>
<svg width="200" height="200">
  <rect id="target1" x="25" y="25" width="50" height="50" fill="green"/>
  <rect id="target2" width="100" height="100" fill="green"/>
  <rect id="target3" width="100" height="100" fill="green"/>
  <rect id="target4" width="100" height="100" fill="green"/>
</svg>