[scroll-timeline] List-valued scroll-timeline properties

This CL makes it possible to specify more than one scroll timeline
on the same element (like view timelines). This largely means
generalizing some view-timeline-specific code, and re-using that
for scroll-timeline.

Fixed: 1357795
Change-Id: I91f46bffb22b81811ffaad562c9df6ebf86e9402
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4177115
Reviewed-by: Kevin Ellis <kevers@chromium.org>
Commit-Queue: Anders Hartvoll Ruud <andruud@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1096134}
diff --git a/scroll-animations/css/scroll-timeline-shorthand.tentative.html b/scroll-animations/css/scroll-timeline-shorthand.tentative.html
index c76ee9e..b74113a 100644
--- a/scroll-animations/css/scroll-timeline-shorthand.tentative.html
+++ b/scroll-animations/css/scroll-timeline-shorthand.tentative.html
@@ -17,9 +17,13 @@
 test_valid_value('scroll-timeline', 'inline inline');
 test_valid_value('scroll-timeline', 'abc');
 test_valid_value('scroll-timeline', 'inline');
+test_valid_value('view-timeline', 'a, b, c');
+test_valid_value('view-timeline', 'a inline, b block, c vertical', 'a inline, b, c vertical');
 
 test_invalid_value('scroll-timeline', '');
 test_invalid_value('scroll-timeline', 'abc abc');
+test_invalid_value('view-timeline', ',');
+test_invalid_value('view-timeline', ',,block,,');
 
 test_computed_value('scroll-timeline', 'none block', 'none');
 test_computed_value('scroll-timeline', 'abc inline');
@@ -27,6 +31,8 @@
 test_computed_value('scroll-timeline', 'abc horizontal');
 test_computed_value('scroll-timeline', 'vertical vertical');
 test_computed_value('scroll-timeline', 'abc');
+test_computed_value('view-timeline', 'a, b, c');
+test_computed_value('view-timeline', 'a inline, b block, c vertical', 'a inline, b, c vertical');
 
 test_shorthand_value('scroll-timeline', 'abc vertical',
 {
@@ -38,4 +44,14 @@
   'scroll-timeline-name': 'inline',
   'scroll-timeline-axis': 'horizontal',
 });
+test_shorthand_value('scroll-timeline', 'abc vertical, def',
+{
+  'scroll-timeline-name': 'abc, def',
+  'scroll-timeline-axis': 'vertical, block',
+});
+test_shorthand_value('scroll-timeline', 'abc, def',
+{
+  'scroll-timeline-name': 'abc, def',
+  'scroll-timeline-axis': 'block, block',
+});
 </script>