LibWeb: Allow multiple values for the transition-delay property

This commit is contained in:
Tim Ledbetter 2025-04-17 12:25:08 +01:00 committed by Sam Atkins
parent c5f1f36119
commit 1ca9f2a44d
Notes: github-actions[bot] 2025-04-23 20:04:09 +00:00
4 changed files with 55 additions and 0 deletions

View file

@ -436,6 +436,8 @@ private:
RefPtr<CSSStyleValue const> parse_grid_area_shorthand_value(TokenStream<ComponentValue>&);
RefPtr<CSSStyleValue const> parse_grid_shorthand_value(TokenStream<ComponentValue>&);
RefPtr<CSSStyleValue const> parse_list_of_time_values(PropertyID, TokenStream<ComponentValue>&);
RefPtr<CalculationNode const> convert_to_calculation_node(CalcParsing::Node const&, CalculationContext const&);
RefPtr<CalculationNode const> parse_a_calculation(Vector<ComponentValue> const&, CalculationContext const&);

View file

@ -670,6 +670,10 @@ Parser::ParseErrorOr<NonnullRefPtr<CSSStyleValue const>> Parser::parse_css_value
if (auto parsed_value = parse_transition_value(tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
return ParseError::SyntaxError;
case PropertyID::TransitionDelay:
if (auto parsed_value = parse_list_of_time_values(property_id, tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
return ParseError::SyntaxError;
case PropertyID::TransitionProperty:
if (auto parsed_value = parse_transition_property_value(tokens); parsed_value && !tokens.has_next_token())
return parsed_value.release_nonnull();
@ -3783,6 +3787,26 @@ RefPtr<CSSStyleValue const> Parser::parse_transition_value(TokenStream<Component
return TransitionStyleValue::create(move(transitions));
}
RefPtr<CSSStyleValue const> Parser::parse_list_of_time_values(PropertyID property_id, TokenStream<ComponentValue>& tokens)
{
auto transaction = tokens.begin_transaction();
auto time_values = parse_a_comma_separated_list_of_component_values(tokens);
StyleValueVector time_value_list;
for (auto const& value : time_values) {
TokenStream time_value_tokens { value };
auto time_style_value = parse_time_value(time_value_tokens);
if (!time_style_value)
return nullptr;
if (time_value_tokens.has_next_token())
return nullptr;
if (!time_style_value->is_calculated() && !property_accepts_time(property_id, time_style_value->as_time().time()))
return nullptr;
time_value_list.append(*time_style_value);
}
transaction.commit();
return StyleValueList::create(move(time_value_list), StyleValueList::Separator::Comma);
}
RefPtr<CSSStyleValue const> Parser::parse_transition_property_value(TokenStream<ComponentValue>& tokens)
{
// https://drafts.csswg.org/css-transitions/#transition-property-property

View file

@ -0,0 +1,9 @@
Harness status: OK
Found 4 tests
4 Pass
Pass e.style['transition-delay'] = "0s" should set the property value
Pass e.style['transition-delay'] = "500ms" should set the property value
Pass e.style['transition-delay'] = "1s, 2s" should set the property value
Pass e.style['transition-delay'] = "-1s, -2s" should set the property value

View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Transitions: parsing transition-delay with valid values</title>
<link rel="help" href="https://drafts.csswg.org/css-transitions/#propdef-transition-delay">
<meta name="assert" content="transition-delay supports the full grammar '<time> #'.">
<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("transition-delay", '0s');
test_valid_value("transition-delay", '500ms');
test_valid_value("transition-delay", '1s, 2s');
test_valid_value("transition-delay", '-1s, -2s');
</script>
</body>
</html>