commit 1267d50de7f8adf06dbddaba00b4d9651ae146a4
author Aaron Krajeski <aaronhk@chromium.org> Sat Sep 30 14:20:11 2023
committer Blink WPT Bot <blink-w3c-test-autoroller@chromium.org> Sat Sep 30 14:36:23 2023
tree 66ee28dd974e61a4d3c6766dba712a030eda008f
parent 7a6bdf8df295da519b0e46bf1bfbc491119b02c0

Fix shadow color interpolation

Color spaces were not being properly set up before interpolation which
meant that nonsense results could be produced as each parameter
blindly interpolated with each other parameter, or that crashes could
be produced on DCHECK builds. We were avoiding those crashes earlier
because all shadow colors were getting squashed to srgb:
https://chromium-review.googlesource.com/c/chromium/src/+/4879833

This CL mirrors what happened to paint types here:
https://chromium-review.googlesource.com/c/chromium/src/+/4831492

InterpolableShadow's private color_ was already always storing an
InterpolableColor, never any other kind of InterpolableValue. I've made
that more explicit here.

Bug: 1441315
Change-Id: Iccd26319bcd442b10eef5431fc8b8d44e9451c44
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4904472
Reviewed-by: Robert Flack <flackr@chromium.org>
Commit-Queue: Aaron Krajeski <aaronhk@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1203677}

css/css-backgrounds/animations/box-shadow-interpolation.html

diff --git a/css/css-backgrounds/animations/box-shadow-interpolation.html b/css/css-backgrounds/animations/box-shadow-interpolation.html
index 4ed55ab..f0b7ec0 100644
--- a/css/css-backgrounds/animations/box-shadow-interpolation.html
+++ b/css/css-backgrounds/animations/box-shadow-interpolation.html
@@ -194,5 +194,45 @@
   from: '10px 20px yellow, 5px 10px green',
   to: 'inset 5px 10px green, 15px 20px blue'
 });
+
+// Test CSS color 4 color types
+test_interpolation({
+  property: 'box-shadow',
+  from: '10px 10px 10px 10px rgb(0 0 0)',
+  to: '10px 10px 10px 10px color(srgb 1 1 1)',
+}, [
+{at: -0.3, expect: '10px 10px 10px 10px oklab(0 0 0)'},
+  {at: 0, expect: '10px 10px 10px 10px oklab(0 0 0)'},
+  {at: 0.3, expect: '10px 10px 10px 10px oklab(0.3 0 0)'},
+  {at: 0.6, expect: '10px 10px 10px 10px oklab(0.6 0 0)'},
+  {at: 1, expect: '10px 10px 10px 10px oklab(1 0 0)'},
+  {at: 1.5, expect: '10px 10px 10px 10px oklab(1 0 0)'},
+]);
+
+test_interpolation({
+  property: 'box-shadow',
+  from: '10px 10px 10px 10px color(srgb 0, 0, 0)',
+  to: '10px 10px 10px 10px rgb(255 255 255)',
+}, [
+{at: -0.3, expect: '10px 10px 10px 10px oklab(0 0 0)'},
+  {at: 0, expect: '10px 10px 10px 10px oklab(0 0 0)'},
+  {at: 0.3, expect: '10px 10px 10px 10px oklab(0.3 0 0)'},
+  {at: 0.6, expect: '10px 10px 10px 10px oklab(0.6 0 0)'},
+  {at: 1, expect: '10px 10px 10px 10px oklab(1 0 0)'},
+  {at: 1.5, expect: '10px 10px 10px 10px oklab(1 0 0)'},
+]);
+
+test_interpolation({
+  property: 'box-shadow',
+  from: '10px 10px 10px 10px color(srgb 0, 0, 0)',
+  to: '10px 10px 10px 10px color(srgb 1 1 1)',
+}, [
+{at: -0.3, expect: '10px 10px 10px 10px oklab(0 0 0)'},
+  {at: 0, expect: '10px 10px 10px 10px oklab(0 0 0)'},
+  {at: 0.3, expect: '10px 10px 10px 10px oklab(0.3 0 0)'},
+  {at: 0.6, expect: '10px 10px 10px 10px oklab(0.6 0 0)'},
+  {at: 1, expect: '10px 10px 10px 10px oklab(1 0 0)'},
+  {at: 1.5, expect: '10px 10px 10px 10px oklab(1 0 0)'},
+]);
 </script>
 </body>