Bug 1514410 [wpt PR 14529] - Fix gradient background sizing, a=testonly
authorStephen Chenney <schenney@chromium.org>
Wed, 19 Dec 2018 12:09:27 +0000
changeset 454936 8375b7606b0ebd068678d4f17722bbb30c0b14e4
parent 454935 a2b2c1fa37b33ff14f5cfa3b548bc2dc105b73f6
child 454937 625c6152a40cbe9039035a9e598f582cd49412ae
push id111373
push userjames@hoppipolla.co.uk
push dateWed, 23 Jan 2019 11:17:29 +0000
treeherdermozilla-inbound@2072956ca042 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1514410, 14529, 898950, 1376814, 616944
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1514410 [wpt PR 14529] - Fix gradient background sizing, a=testonly Automatic update from web-platform-tests Fix gradient background sizing This is a hard-to-fix situation. We size generated background images according to the tile size, which is a snapped rectangle sized according to the destination values, in general. But then we compute a src rect for image drawing using the unsnapped values, because that is best for bitmap images where we want to pull out the most accurate src rect possible. However, that source rect ends up larger than the tile size due to rounding without the original offset in the layer (because now we are working in image space). The gradient painting code then sees that it has a src rect that is larger than the tile size and hence the gradient image size. The code thinks that we want to have some more pixels than the gradient provides, which is true in some cases, and scales things to get those extra pixels in the painted output. Hence empty pixels on the screen when we really want the gradient to be filling the dest rect. Changing the gradient painting code will break valid use cases. Changing the tile size breaks things in a different way and doesn't really fix the problem. So change the src rect computation to use snapped sizes for generated content in an attempt to get a src that matches the tile size. R=fmalita@chromium.org Bug: 898950 Change-Id: I100575ad4f4fa3004fbc232a72c90b0032ccef4e Reviewed-on: https://chromium-review.googlesource.com/c/1376814 Commit-Queue: Stephen Chenney <schenney@chromium.org> Reviewed-by: Florin Malita <fmalita@chromium.org> Cr-Commit-Position: refs/heads/master@{#616944} -- wpt-commits: fcb8094864e059a942cadbdb839794182b309dc8 wpt-pr: 14529
testing/web-platform/tests/css/css-backgrounds/background-gradient-subpixel-fills-area.html
testing/web-platform/tests/css/css-backgrounds/reference/background-gradient-subpixel-fills-area-ref.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-backgrounds/background-gradient-subpixel-fills-area.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en-GB" xml:lang="en-GB" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+  <title>CSS Background Test: Gradient backgrounds should fill the positioning area</title>
+  <link rel="author" title="schenney" href="mailto:schenney@chromium.org">
+  <link rel="help" href="http://www.w3.org/TR/css3-background">
+  <link rel="match" href="reference/background-gradient-subpixel-fills-area-ref.html">
+  <style>
+    ul {
+      width: 396.875px;
+      overflow: auto;
+      padding: 0;
+      list-style: none;
+      background-color: red;
+    }
+
+    li {
+      float: left;
+    }
+
+    div {
+      display: block;
+      width: 19.6875px;
+      height: 17px;
+      padding: 20px 10px;
+      background: linear-gradient(to bottom, green 0%, darkgreen 100%) darkgreen;
+    }
+  </style>
+</head>
+<body>
+    <ul>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+      <li><div></div></li>
+    </ul>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-backgrounds/reference/background-gradient-subpixel-fills-area-ref.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en-GB" xml:lang="en-GB" xmlns="http://www.w3.org/1999/xhtml">
+<head>
+  <title>CSS Background Test Reference</title>
+  <link rel="author" title="schenney" href="mailto:schenney@chromium.org">
+  <style>
+    ul {
+      width: 396.875px;
+      overflow: auto;
+      padding: 0;
+      list-style: none;
+      background-color: red;
+    }
+
+    li {
+      float: left;
+    }
+
+    div {
+      display: block;
+      width: 376.875px;
+      height: 17px;
+      padding: 20px 10px;
+      background: linear-gradient(to bottom, green 0%, darkgreen 100%) darkgreen;
+    }
+  </style>
+</head>
+<body>
+    <ul>
+      <li><div></div></li>
+    </ul>
+</body>
+</html>