Always readjust the gradient radii for (CSS) radial gradients
If the stop offset range is zero-length/degenerate, it will be clipped
to the range [0, 1], but the radii will not be readjusted to match.
Since for the non-repeating case a stop with an offset at > 1 (100%)
will actually affect the rendered output the radii needs to be
readjusted.
Fixed: 1478473
Change-Id: Idd816865b06978e5e0ce37c83b765b708c77b7df
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4833638
Reviewed-by: Stephen Chenney <schenney@chromium.org>
Auto-Submit: Fredrik Söderquist <fs@opera.com>
Commit-Queue: Stephen Chenney <schenney@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1192440}
diff --git a/css/css-images/normalization-radial-3.html b/css/css-images/normalization-radial-3.html
new file mode 100644
index 0000000..927917c
--- /dev/null
+++ b/css/css-images/normalization-radial-3.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Radial gradient stop normalization</title>
+<link rel="help" href="https://drafts.csswg.org/css-images-3/#radial-gradients">
+<meta name="assert" content="Rendering of radial-gradient with normalized color stops">
+<link rel="match" href="reference/100x100-blue.html">
+<style>
+ #gradient {
+ width: 100px;
+ height: 100px;
+ background-image: radial-gradient(50px, blue 1000%, red 1000%);
+ }
+</style>
+<div id="gradient"></div>
diff --git a/css/css-images/normalization-radial-4.html b/css/css-images/normalization-radial-4.html
new file mode 100644
index 0000000..e9d948f
--- /dev/null
+++ b/css/css-images/normalization-radial-4.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Radial gradient stop normalization</title>
+<link rel="help" href="https://drafts.csswg.org/css-images-3/#repeating-gradients">
+<meta name="assert" content="Rendering of repeating-radial-gradient with normalized color stops">
+<link rel="match" href="reference/100x100-blue.html">
+<style>
+ #gradient {
+ width: 100px;
+ height: 100px;
+ background-image: repeating-radial-gradient(50px, red 1000%, blue 1000%);
+ }
+</style>
+<div id="gradient"></div>
