Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-12-07 21:59:54 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb: Parse the scroll-timeline-axis CSS property

Browse source
This commit is contained in:
Callum Law 2025-11-20 23:04:29 +13:00 • committed by Sam Atkins
parent e95f326f3d
commit 992b0a4dc6
Notes: github-actions[bot] 2025-11-28 13:26:31 +00:00
11 changed files with 135 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

6
Libraries/LibWeb/CSS/Enums.json
View file

@ -110,6 +110,12 @@
"textarea", "textarea",
"textfield" "textfield"
], ],
"axis": [
"block",
"inline",
"x",
"y"
],
"background-attachment": [ "background-attachment": [
"fixed", "fixed",
"local", "local",

2
Libraries/LibWeb/CSS/Keywords.json
View file

@ -628,6 +628,7 @@
"windowtext", "windowtext",
"wrap", "wrap",
"wrap-reverse", "wrap-reverse",
"x",
"x-end", "x-end",
"x-large", "x-large",
"x-start", "x-start",
@ -635,6 +636,7 @@
"xx-large", "xx-large",
"xx-small", "xx-small",
"xxx-large", "xxx-large",
"y",
"y-end", "y-end",
"y-start", "y-start",
"zoom-in", "zoom-in",

1
Libraries/LibWeb/CSS/Parser/PropertyParsing.cpp
View file

@ -745,6 +745,7 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue const>> Parser::parse_css_value(Pr
return parse_all_as(tokens, [this](auto& tokens) { return parse_translate_value(tokens); }); return parse_all_as(tokens, [this](auto& tokens) { return parse_translate_value(tokens); });
case PropertyID::Scale: case PropertyID::Scale:
return parse_all_as(tokens, [this](auto& tokens) { return parse_scale_value(tokens); }); return parse_all_as(tokens, [this](auto& tokens) { return parse_scale_value(tokens); });
case PropertyID::ScrollTimelineAxis:
case PropertyID::ScrollTimelineName: case PropertyID::ScrollTimelineName:
return parse_all_as(tokens, [this, property_id](auto& tokens) { return parse_simple_comma_separated_value_list(property_id, tokens); }); return parse_all_as(tokens, [this, property_id](auto& tokens) { return parse_simple_comma_separated_value_list(property_id, tokens); });
case PropertyID::WhiteSpace: case PropertyID::WhiteSpace:

10
Libraries/LibWeb/CSS/Properties.json
View file

@ -3440,6 +3440,16 @@
"affects-layout": false, "affects-layout": false,
"affects-stacking-context": true "affects-stacking-context": true
}, },
"scroll-timeline-axis": {
"affects-layout": false,
"animation-type": "none",
"inherited": false,
"initial": "block",
"valid-types": [
"axis"
],
"multiplicity": "coordinating-list"
},
"scroll-timeline-name": { "scroll-timeline-name": {
"affects-layout": false, "affects-layout": false,
"animation-type": "none", "animation-type": "none",

1
Tests/LibWeb/Text/expected/css/CSSStyleDeclaration-has-indexed-property-getter.txt
View file

@ -259,6 +259,7 @@ All properties associated with getComputedStyle(document.body):
"rx", "rx",
"ry", "ry",
"scale", "scale",
"scroll-timeline-axis",
"scroll-timeline-name", "scroll-timeline-name",
"scrollbar-color", "scrollbar-color",
"scrollbar-gutter", "scrollbar-gutter",

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

@ -694,6 +694,8 @@ All supported properties and their default values exposed from CSSStylePropertie
'rx': 'auto' 'rx': 'auto'
'ry': 'auto' 'ry': 'auto'
'scale': 'none' 'scale': 'none'
'scrollTimelineAxis': 'block'
'scroll-timeline-axis': 'block'
'scrollTimelineName': 'none' 'scrollTimelineName': 'none'
'scroll-timeline-name': 'none' 'scroll-timeline-name': 'none'
'scrollbarColor': 'auto' 'scrollbarColor': 'auto'

1
Tests/LibWeb/Text/expected/css/getComputedStyle-print-all.txt
View file

@ -257,6 +257,7 @@ row-gap: normal
rx: auto rx: auto
ry: auto ry: auto
scale: none scale: none
scroll-timeline-axis: block
scroll-timeline-name: none scroll-timeline-name: none
scrollbar-color: auto scrollbar-color: auto
scrollbar-gutter: auto scrollbar-gutter: auto

20
Tests/LibWeb/Text/expected/wpt-import/scroll-animations/css/scroll-timeline-axis-computed.txt Normal file
View file

@ -0,0 +1,20 @@
Harness status: OK
Found 14 tests
13 Pass
1 Fail
Pass Property scroll-timeline-axis value 'initial'
Pass Property scroll-timeline-axis value 'inherit'
Pass Property scroll-timeline-axis value 'unset'
Pass Property scroll-timeline-axis value 'revert'
Pass Property scroll-timeline-axis value 'block'
Pass Property scroll-timeline-axis value 'inline'
Pass Property scroll-timeline-axis value 'y'
Pass Property scroll-timeline-axis value 'x'
Pass Property scroll-timeline-axis value 'block, inline'
Pass Property scroll-timeline-axis value 'inline, block'
Pass Property scroll-timeline-axis value 'block, y, x, inline'
Fail Property scroll-timeline-axis value 'inline, inline, inline, inline'
Pass The scroll-timeline-axis property shows up in CSSStyleDeclaration enumeration
Pass The scroll-timeline-axis property shows up in CSSStyleDeclaration.cssText

24
Tests/LibWeb/Text/expected/wpt-import/scroll-animations/css/scroll-timeline-axis-parsing.txt Normal file
View file

@ -0,0 +1,24 @@
Harness status: OK
Found 18 tests
17 Pass
1 Fail
Pass e.style['scroll-timeline-axis'] = "initial" should set the property value
Pass e.style['scroll-timeline-axis'] = "inherit" should set the property value
Pass e.style['scroll-timeline-axis'] = "unset" should set the property value
Pass e.style['scroll-timeline-axis'] = "revert" should set the property value
Pass e.style['scroll-timeline-axis'] = "block" should set the property value
Pass e.style['scroll-timeline-axis'] = "inline" should set the property value
Pass e.style['scroll-timeline-axis'] = "y" should set the property value
Pass e.style['scroll-timeline-axis'] = "x" should set the property value
Pass e.style['scroll-timeline-axis'] = "block, inline" should set the property value
Pass e.style['scroll-timeline-axis'] = "inline, block" should set the property value
Pass e.style['scroll-timeline-axis'] = "block, y, x, inline" should set the property value
Fail e.style['scroll-timeline-axis'] = "inline, inline, inline, inline" should set the property value
Pass e.style['scroll-timeline-axis'] = "abc" should not set the property value
Pass e.style['scroll-timeline-axis'] = "10px" should not set the property value
Pass e.style['scroll-timeline-axis'] = "auto" should not set the property value
Pass e.style['scroll-timeline-axis'] = "none" should not set the property value
Pass e.style['scroll-timeline-axis'] = "block inline" should not set the property value
Pass e.style['scroll-timeline-axis'] = "block / inline" should not set the property value

37
Tests/LibWeb/Text/input/wpt-import/scroll-animations/css/scroll-timeline-axis-computed.html Normal file
View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#scroll-timeline-axis">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../css/support/computed-testcommon.js"></script>
<style>
#outer { scroll-timeline-axis: inline; }
#target { scroll-timeline-axis: y; }
</style>
<div id="outer">
<div id="target"></div>
</div>
<script>
test_computed_value('scroll-timeline-axis', 'initial', 'block');
test_computed_value('scroll-timeline-axis', 'inherit', 'inline');
test_computed_value('scroll-timeline-axis', 'unset', 'block');
test_computed_value('scroll-timeline-axis', 'revert', 'block');
test_computed_value('scroll-timeline-axis', 'block');
test_computed_value('scroll-timeline-axis', 'inline');
test_computed_value('scroll-timeline-axis', 'y');
test_computed_value('scroll-timeline-axis', 'x');
test_computed_value('scroll-timeline-axis', 'block, inline');
test_computed_value('scroll-timeline-axis', 'inline, block');
test_computed_value('scroll-timeline-axis', 'block, y, x, inline');
test_computed_value('scroll-timeline-axis', 'inline, inline, inline, inline');
test(() => {
let style = getComputedStyle(document.getElementById('target'));
assert_not_equals(Array.from(style).indexOf('scroll-timeline-axis'), -1);
}, 'The scroll-timeline-axis property shows up in CSSStyleDeclaration enumeration');
test(() => {
let style = document.getElementById('target').style;
assert_not_equals(style.cssText.indexOf('scroll-timeline-axis'), -1);
}, 'The scroll-timeline-axis property shows up in CSSStyleDeclaration.cssText');
</script>

31
Tests/LibWeb/Text/input/wpt-import/scroll-animations/css/scroll-timeline-axis-parsing.html Normal file
View file

@ -0,0 +1,31 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#scroll-timeline-axis">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../css/support/parsing-testcommon.js"></script>
<div id="target"></div>
<script>
test_valid_value('scroll-timeline-axis', 'initial');
test_valid_value('scroll-timeline-axis', 'inherit');
test_valid_value('scroll-timeline-axis', 'unset');
test_valid_value('scroll-timeline-axis', 'revert');
test_valid_value('scroll-timeline-axis', 'block');
test_valid_value('scroll-timeline-axis', 'inline');
test_valid_value('scroll-timeline-axis', 'y');
test_valid_value('scroll-timeline-axis', 'x');
test_valid_value('scroll-timeline-axis', 'block, inline');
test_valid_value('scroll-timeline-axis', 'inline, block');
test_valid_value('scroll-timeline-axis', 'block, y, x, inline');
test_valid_value('scroll-timeline-axis', 'inline, inline, inline, inline');
test_invalid_value('scroll-timeline-axis', 'abc');
test_invalid_value('scroll-timeline-axis', '10px');
test_invalid_value('scroll-timeline-axis', 'auto');
test_invalid_value('scroll-timeline-axis', 'none');
test_invalid_value('scroll-timeline-axis', 'block inline');
test_invalid_value('scroll-timeline-axis', 'block / inline');
</script>