Skip to content

Commit 992b0a4

Browse files
Calme1709AtkinsSJ
Calme1709
authored and
AtkinsSJ
committed
LibWeb: Parse the scroll-timeline-axis CSS property
1 parent e95f326 commit 992b0a4

File tree

11 files changed

+135
-0
lines changed

11 files changed

+135
-0
lines changed

‎Libraries/LibWeb/CSS/Enums.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -110,6 +110,12 @@
110110
"textarea",
111111
"textfield"
112112
],
113+
"axis": [
114+
"block",
115+
"inline",
116+
"x",
117+
"y"
118+
],
113119
"background-attachment": [
114120
"fixed",
115121
"local",

‎Libraries/LibWeb/CSS/Keywords.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -628,13 +628,15 @@
628628
"windowtext",
629629
"wrap",
630630
"wrap-reverse",
631+
"x",
631632
"x-end",
632633
"x-large",
633634
"x-start",
634635
"x-small",
635636
"xx-large",
636637
"xx-small",
637638
"xxx-large",
639+
"y",
638640
"y-end",
639641
"y-start",
640642
"zoom-in",

‎Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -745,6 +745,7 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue const>> Parser::parse_css_value(Pr
745745
return parse_all_as(tokens, [this](auto& tokens) { return parse_translate_value(tokens); });
746746
case PropertyID::Scale:
747747
return parse_all_as(tokens, [this](auto& tokens) { return parse_scale_value(tokens); });
748+
case PropertyID::ScrollTimelineAxis:
748749
case PropertyID::ScrollTimelineName:
749750
return parse_all_as(tokens, [this, property_id](auto& tokens) { return parse_simple_comma_separated_value_list(property_id, tokens); });
750751
case PropertyID::WhiteSpace:

‎Libraries/LibWeb/CSS/Properties.json‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3440,6 +3440,16 @@
34403440
"affects-layout": false,
34413441
"affects-stacking-context": true
34423442
},
3443+
"scroll-timeline-axis": {
3444+
"affects-layout": false,
3445+
"animation-type": "none",
3446+
"inherited": false,
3447+
"initial": "block",
3448+
"valid-types": [
3449+
"axis"
3450+
],
3451+
"multiplicity": "coordinating-list"
3452+
},
34433453
"scroll-timeline-name": {
34443454
"affects-layout": false,
34453455
"animation-type": "none",

‎Tests/LibWeb/Text/expected/css/CSSStyleDeclaration-has-indexed-property-getter.txt‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -259,6 +259,7 @@ All properties associated with getComputedStyle(document.body):
259259
"rx",
260260
"ry",
261261
"scale",
262+
"scroll-timeline-axis",
262263
"scroll-timeline-name",
263264
"scrollbar-color",
264265
"scrollbar-gutter",

‎Tests/LibWeb/Text/expected/css/CSSStyleProperties-all-supported-properties-and-default-values.txt‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -694,6 +694,8 @@ All supported properties and their default values exposed from CSSStylePropertie
694694
'rx': 'auto'
695695
'ry': 'auto'
696696
'scale': 'none'
697+
'scrollTimelineAxis': 'block'
698+
'scroll-timeline-axis': 'block'
697699
'scrollTimelineName': 'none'
698700
'scroll-timeline-name': 'none'
699701
'scrollbarColor': 'auto'

‎Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -257,6 +257,7 @@ row-gap: normal
257257
rx: auto
258258
ry: auto
259259
scale: none
260+
scroll-timeline-axis: block
260261
scroll-timeline-name: none
261262
scrollbar-color: auto
262263
scrollbar-gutter: auto

‎Tests/LibWeb/Text/expected/wpt-import/scroll-animations/css/scroll-timeline-axis-computed.txt‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
Harness status: OK
2+
3+
Found 14 tests
4+
5+
13 Pass
6+
1 Fail
7+
Pass Property scroll-timeline-axis value 'initial'
8+
Pass Property scroll-timeline-axis value 'inherit'
9+
Pass Property scroll-timeline-axis value 'unset'
10+
Pass Property scroll-timeline-axis value 'revert'
11+
Pass Property scroll-timeline-axis value 'block'
12+
Pass Property scroll-timeline-axis value 'inline'
13+
Pass Property scroll-timeline-axis value 'y'
14+
Pass Property scroll-timeline-axis value 'x'
15+
Pass Property scroll-timeline-axis value 'block, inline'
16+
Pass Property scroll-timeline-axis value 'inline, block'
17+
Pass Property scroll-timeline-axis value 'block, y, x, inline'
18+
Fail Property scroll-timeline-axis value 'inline, inline, inline, inline'
19+
Pass The scroll-timeline-axis property shows up in CSSStyleDeclaration enumeration
20+
Pass The scroll-timeline-axis property shows up in CSSStyleDeclaration.cssText

‎Tests/LibWeb/Text/expected/wpt-import/scroll-animations/css/scroll-timeline-axis-parsing.txt‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
Harness status: OK
2+
3+
Found 18 tests
4+
5+
17 Pass
6+
1 Fail
7+
Pass e.style['scroll-timeline-axis'] = "initial" should set the property value
8+
Pass e.style['scroll-timeline-axis'] = "inherit" should set the property value
9+
Pass e.style['scroll-timeline-axis'] = "unset" should set the property value
10+
Pass e.style['scroll-timeline-axis'] = "revert" should set the property value
11+
Pass e.style['scroll-timeline-axis'] = "block" should set the property value
12+
Pass e.style['scroll-timeline-axis'] = "inline" should set the property value
13+
Pass e.style['scroll-timeline-axis'] = "y" should set the property value
14+
Pass e.style['scroll-timeline-axis'] = "x" should set the property value
15+
Pass e.style['scroll-timeline-axis'] = "block, inline" should set the property value
16+
Pass e.style['scroll-timeline-axis'] = "inline, block" should set the property value
17+
Pass e.style['scroll-timeline-axis'] = "block, y, x, inline" should set the property value
18+
Fail e.style['scroll-timeline-axis'] = "inline, inline, inline, inline" should set the property value
19+
Pass e.style['scroll-timeline-axis'] = "abc" should not set the property value
20+
Pass e.style['scroll-timeline-axis'] = "10px" should not set the property value
21+
Pass e.style['scroll-timeline-axis'] = "auto" should not set the property value
22+
Pass e.style['scroll-timeline-axis'] = "none" should not set the property value
23+
Pass e.style['scroll-timeline-axis'] = "block inline" should not set the property value
24+
Pass e.style['scroll-timeline-axis'] = "block / inline" should not set the property value

‎Tests/LibWeb/Text/input/wpt-import/scroll-animations/css/scroll-timeline-axis-computed.html‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#scroll-timeline-axis">
3+
<script src="../../resources/testharness.js"></script>
4+
<script src="../../resources/testharnessreport.js"></script>
5+
<script src="../../css/support/computed-testcommon.js"></script>
6+
<style>
7+
#outer { scroll-timeline-axis: inline; }
8+
#target { scroll-timeline-axis: y; }
9+
</style>
10+
<div id="outer">
11+
<div id="target"></div>
12+
</div>
13+
<script>
14+
test_computed_value('scroll-timeline-axis', 'initial', 'block');
15+
test_computed_value('scroll-timeline-axis', 'inherit', 'inline');
16+
test_computed_value('scroll-timeline-axis', 'unset', 'block');
17+
test_computed_value('scroll-timeline-axis', 'revert', 'block');
18+
test_computed_value('scroll-timeline-axis', 'block');
19+
test_computed_value('scroll-timeline-axis', 'inline');
20+
test_computed_value('scroll-timeline-axis', 'y');
21+
test_computed_value('scroll-timeline-axis', 'x');
22+
test_computed_value('scroll-timeline-axis', 'block, inline');
23+
test_computed_value('scroll-timeline-axis', 'inline, block');
24+
test_computed_value('scroll-timeline-axis', 'block, y, x, inline');
25+
test_computed_value('scroll-timeline-axis', 'inline, inline, inline, inline');
26+
27+
test(() => {
28+
let style = getComputedStyle(document.getElementById('target'));
29+
assert_not_equals(Array.from(style).indexOf('scroll-timeline-axis'), -1);
30+
}, 'The scroll-timeline-axis property shows up in CSSStyleDeclaration enumeration');
31+
32+
test(() => {
33+
let style = document.getElementById('target').style;
34+
assert_not_equals(style.cssText.indexOf('scroll-timeline-axis'), -1);
35+
}, 'The scroll-timeline-axis property shows up in CSSStyleDeclaration.cssText');
36+
37+
</script>

0 commit comments

Comments
 (0)