mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-23 10:15:41 +00:00
41 lines
1.5 KiB
HTML
41 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/
|
|
-->
|
|
<!--
|
|
This testcase ensures that we paint the background around an opaque image,
|
|
when the image is kept from filling the container via 'object-fit' (and
|
|
the img element is fragmented). This is an interesting case because, by
|
|
default, images fill their container, which means we can often optimize
|
|
away the background completely. BUT, if "object-fit" prevents the image
|
|
from filling its container, we can't optimize away the background; it need
|
|
to be painted in the uncovered area.
|
|
-->
|
|
<html class="reftest-paged">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<style type="text/css">
|
|
img.test {
|
|
background: salmon;
|
|
object-fit: none;
|
|
width: 32px;
|
|
/* We make the height 6in larger than the image's intrinsic height,
|
|
* which gives us the following happy results:
|
|
* (1) the <img> will split over several 3in tall reftest-paged cards
|
|
* (so, we get to test fragmentation).
|
|
* (2) the image pixels end up on the second fragment (not the first),
|
|
* so we get to test image-data painting on later fragments.
|
|
* (3) the reference case can easily match us using a simple img
|
|
* with 3in-tall divs before & after it.
|
|
*/
|
|
height: calc(32px + 6in);
|
|
display: block; /* Required for fragmentation */
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<img class="test" src="blue-32x32.png">
|
|
</body>
|
|
</html>
|