12345678910111213141516171819202122232425262728293031323334353637383940414243444546 |
- <!DOCTYPE html>
- <!--
- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/
- -->
- <!--
- This testcase ensures that we repaint correctly when "object-fit" is
- adjusted on a replaced element with SVG content. We start with
- "object-fit: contain", which lets some of the red background show through
- as we fit the SVG's square aspect-ratio into the wide rectangular
- container elements. We then change dynamically to "object-fit: cover",
- which should scale our SVG content to cover each replaced element's
- content-box. No red should ultimately be visible in the reftest snapshot.
- -->
- <html class="reftest-wait">
- <head>
- <meta charset="utf-8">
- <style type="text/css">
- embed, img, object, video {
- object-fit: contain;
- background: red;
- width: 50px;
- height: 30px;
- }
- </style>
- <script>
- function go() {
- var elemsToTweak = ["embed", "img", "object", "video"];
- elemsToTweak.forEach(tweakElemObjectFit);
- document.documentElement.removeAttribute("class");
- }
- function tweakElemObjectFit(tagName) {
- var elem = document.getElementsByTagName(tagName)[0];
- elem.style.objectFit = "cover";
- }
- document.addEventListener("MozReftestInvalidate", go);
- </script>
- </head>
- <body>
- <embed src="500.svg">
- <img src="500.svg">
- <object data="500.svg"></object>
- <video poster="500.svg"></video>
- </body>
- </html>
|