[scroll-animations] Make scroll() accept arguments in any order

This CL also reorders some code/members so it matches the canonical
order in the spec (purely for aesthetic reasons):

 - <scroller> || <axis>
 - root | nearest | self

Fixed: 1428549
Change-Id: I7b3ff3a15416aaa51d117136f927c23f56ff79d5
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4398110
Reviewed-by: Robert Flack <flackr@chromium.org>
Commit-Queue: Anders Hartvoll Ruud <andruud@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1128562}

scroll-animations/css/animation-timeline-computed.html

@@ -40,7 +40,7 @@
 //
 // animation-timeline: scroll(<axis>? <scroller>?);
 // <axis> = block | inline | vertical | horizontal
-// <scroller> = root | nearest
+// <scroller> = root | nearest | self
 test_computed_value('animation-timeline', 'scroll()');
 test_computed_value('animation-timeline', 'scroll(block)', 'scroll()');
 test_computed_value('animation-timeline', 'scroll(inline)');
@@ -51,7 +51,10 @@
 test_computed_value('animation-timeline', 'scroll(self)');
 test_computed_value('animation-timeline', 'scroll(self), scroll(nearest)', 'scroll(self), scroll()');
 test_computed_value('animation-timeline', 'scroll(inline nearest)', 'scroll(inline)');
-test_computed_value('animation-timeline', 'scroll(vertical root)');
+test_computed_value('animation-timeline', 'scroll(nearest inline)', 'scroll(inline)');
+test_computed_value('animation-timeline', 'scroll(block self)', 'scroll(self)');
+test_computed_value('animation-timeline', 'scroll(self block)', 'scroll(self)');
+test_computed_value('animation-timeline', 'scroll(vertical root)', 'scroll(root vertical)');
 
 // https://drafts.csswg.org/scroll-animations-1/#view-notation
 test_computed_value('animation-timeline', 'view()');

scroll-animations/css/animation-timeline-parsing.html

@@ -33,7 +33,7 @@
 //
 // animation-timeline: scroll(<axis>? <scroller>?);
 // <axis> = block | inline | vertical | horizontal
-// <scroller> = root | nearest
+// <scroller> = root | nearest | self
 test_valid_value('animation-timeline', 'scroll()');
 test_valid_value('animation-timeline', 'scroll(block)', 'scroll()');
 test_valid_value('animation-timeline', 'scroll(inline)');
@@ -43,9 +43,11 @@
 test_valid_value('animation-timeline', 'scroll(nearest)', 'scroll()');
 test_valid_value('animation-timeline', 'scroll(self)');
 test_valid_value('animation-timeline', 'scroll(inline nearest)', 'scroll(inline)');
-test_valid_value('animation-timeline', 'scroll(vertical root)');
+test_valid_value('animation-timeline', 'scroll(nearest inline)', 'scroll(inline)');
+test_valid_value('animation-timeline', 'scroll(block self)', 'scroll(self)');
+test_valid_value('animation-timeline', 'scroll(self block)', 'scroll(self)');
+test_valid_value('animation-timeline', 'scroll(vertical root)', 'scroll(root vertical)');
 
-test_invalid_value('animation-timeline', 'scroll(root block)');
 test_invalid_value('animation-timeline', 'scroll(abc root)');
 test_invalid_value('animation-timeline', 'scroll(abc)');
 test_invalid_value('animation-timeline', 'scroll(vertical abc)');