LibWeb/CSS: Remove unnecessary shorthand serialization special cases

The serialization of these properties is improved by using the new
default behavior.
This commit is contained in:
Tim Ledbetter 2025-04-06 23:38:41 +01:00
parent 7efe30556c
commit 77db38b8e0
5 changed files with 72 additions and 19 deletions

View file

@ -194,8 +194,6 @@ String ShorthandStyleValue::to_string(SerializationMode mode) const
}
case PropertyID::Flex:
return MUST(String::formatted("{} {} {}", longhand(PropertyID::FlexGrow)->to_string(mode), longhand(PropertyID::FlexShrink)->to_string(mode), longhand(PropertyID::FlexBasis)->to_string(mode)));
case PropertyID::FlexFlow:
return MUST(String::formatted("{} {}", longhand(PropertyID::FlexDirection)->to_string(mode), longhand(PropertyID::FlexWrap)->to_string(mode)));
case PropertyID::Font: {
auto font_style = longhand(PropertyID::FontStyle);
auto font_variant = longhand(PropertyID::FontVariant);
@ -350,8 +348,6 @@ String ShorthandStyleValue::to_string(SerializationMode mode) const
return start->to_string(mode);
return MUST(String::formatted("{} / {}", start->to_string(mode), end->to_string(mode)));
}
case PropertyID::ListStyle:
return MUST(String::formatted("{} {} {}", longhand(PropertyID::ListStylePosition)->to_string(mode), longhand(PropertyID::ListStyleImage)->to_string(mode), longhand(PropertyID::ListStyleType)->to_string(mode)));
case PropertyID::Overflow: {
auto overflow_x = longhand(PropertyID::OverflowX);
auto overflow_y = longhand(PropertyID::OverflowY);

View file

@ -78,9 +78,9 @@ All supported properties and their default values exposed from CSSStylePropertie
'WebkitFlexDirection': 'row'
'webkitFlexDirection': 'row'
'-webkit-flex-direction': 'row'
'WebkitFlexFlow': 'row nowrap'
'webkitFlexFlow': 'row nowrap'
'-webkit-flex-flow': 'row nowrap'
'WebkitFlexFlow': 'row'
'webkitFlexFlow': 'row'
'-webkit-flex-flow': 'row'
'WebkitFlexGrow': '0'
'webkitFlexGrow': '0'
'-webkit-flex-grow': '0'
@ -322,8 +322,8 @@ All supported properties and their default values exposed from CSSStylePropertie
'flex-basis': 'auto'
'flexDirection': 'row'
'flex-direction': 'row'
'flexFlow': 'row nowrap'
'flex-flow': 'row nowrap'
'flexFlow': 'row'
'flex-flow': 'row'
'flexGrow': '0'
'flex-grow': '0'
'flexShrink': '1'
@ -432,8 +432,8 @@ All supported properties and their default values exposed from CSSStylePropertie
'letter-spacing': 'normal'
'lineHeight': 'normal'
'line-height': 'normal'
'listStyle': 'outside none disc'
'list-style': 'outside none disc'
'listStyle': 'outside'
'list-style': 'outside'
'listStyleImage': 'none'
'list-style-image': 'none'
'listStylePosition': 'outside'

View file

@ -2,12 +2,11 @@ Harness status: OK
Found 7 tests
1 Pass
6 Fail
Fail e.style['flex-flow'] = "column nowrap" should set the property value
Fail e.style['flex-flow'] = "nowrap column" should set the property value
7 Pass
Pass e.style['flex-flow'] = "column nowrap" should set the property value
Pass e.style['flex-flow'] = "nowrap column" should set the property value
Pass e.style['flex-flow'] = "wrap row-reverse" should set the property value
Fail e.style['flex-flow'] = "nowrap" should set the property value
Fail e.style['flex-flow'] = "row nowrap" should set the property value
Fail e.style['flex-flow'] = "wrap" should set the property value
Fail e.style['flex-flow'] = "row wrap" should set the property value
Pass e.style['flex-flow'] = "nowrap" should set the property value
Pass e.style['flex-flow'] = "row nowrap" should set the property value
Pass e.style['flex-flow'] = "wrap" should set the property value
Pass e.style['flex-flow'] = "row wrap" should set the property value

View file

@ -0,0 +1,23 @@
Harness status: OK
Found 17 tests
16 Pass
1 Fail
Pass e.style['list-style'] = "none" should set the property value
Pass e.style['list-style'] = "disc outside none" should set the property value
Pass e.style['list-style'] = "inside" should set the property value
Pass e.style['list-style'] = "inside disc" should set the property value
Pass e.style['list-style'] = "inside none" should set the property value
Pass e.style['list-style'] = "inside none none" should set the property value
Pass e.style['list-style'] = "none inside none" should set the property value
Pass e.style['list-style'] = "none none inside" should set the property value
Pass e.style['list-style'] = "none inside" should set the property value
Pass e.style['list-style'] = "url(\"https://example.com/\")" should set the property value
Pass e.style['list-style'] = "none url(\"https://example.com/\")" should set the property value
Pass e.style['list-style'] = "url(\"https://example.com/\") disc" should set the property value
Pass e.style['list-style'] = "url(\"https://example.com/\") disc outside" should set the property value
Pass e.style['list-style'] = "square" should set the property value
Pass e.style['list-style'] = "square url(\"https://example.com/\") inside" should set the property value
Pass e.style['list-style'] = "square linear-gradient(red,blue) inside" should set the property value
Fail e.style['list-style'] = "disc radial-gradient(circle, #006, #00a 90%, #0000af 100%,white 100%) inside" should set the property value

View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Lists: parsing list-style with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-lists-3/#propdef-list-style">
<meta name="assert" content="list-style supports the full grammar '<'list-style-position'> || <'list-style-image'> || <'list-style-type'>'.">
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/support/parsing-testcommon.js"></script>
</head>
<body>
<script>
test_valid_value('list-style', 'none');
test_valid_value('list-style', 'disc outside none', 'outside');
test_valid_value('list-style', 'inside');
test_valid_value('list-style', 'inside disc', 'inside');
test_valid_value('list-style', 'inside none');
test_valid_value('list-style', 'inside none none', 'inside none');
test_valid_value('list-style', 'none inside none', 'inside none');
test_valid_value('list-style', 'none none inside', 'inside none');
test_valid_value('list-style', 'none inside', 'inside none');
test_valid_value('list-style', 'url("https://example.com/")');
test_valid_value('list-style', 'none url("https://example.com/")', 'url("https://example.com/") none');
test_valid_value('list-style', 'url("https://example.com/") disc', 'url("https://example.com/")');
test_valid_value('list-style', 'url("https://example.com/") disc outside', 'url("https://example.com/")');
test_valid_value('list-style', 'square');
test_valid_value('list-style', 'square url("https://example.com/") inside', 'inside url("https://example.com/") square');
test_valid_value('list-style', 'square linear-gradient(red,blue) inside', 'inside linear-gradient(red, blue) square');
test_valid_value('list-style', 'disc radial-gradient(circle, #006, #00a 90%, #0000af 100%,white 100%) inside', 'inside radial-gradient(circle, rgb(0, 0, 102), rgb(0, 0, 170) 90%, rgb(0, 0, 175) 100%, white 100%)');
</script>
</body>
</html>