mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-09-24 18:28:57 +00:00
LibWeb: Resolve CSS-wide keywords in keyframe properties
Also resolves the `revert` keyword against longhand properties rather than potential shorthands as this could cause a crash. Gains us 20 WPT tests.
This commit is contained in:
Callum Law
Jelle Raaijmakers
parent
6f3b38de0f
commit
d69e62425e
Notes:
github-actions[bot]
2025-08-27 12:52:27 +00:00
Author: https://github.com/Calme1709
Commit: d69e62425e
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/6002
Reviewed-by: https://github.com/gmta ✅
4 changed files with 49 additions and 27 deletions
|
|
@ -1129,8 +1129,6 @@ void StyleComputer::collect_animation_into(DOM::Element& element, Optional<CSS::
|
|||
if (style_value->is_pending_substitution())
|
||||
continue;
|
||||
|
||||
if (style_value->is_revert() || style_value->is_revert_layer())
|
||||
style_value = computed_properties.property(property_id);
|
||||
if (style_value->is_unresolved())
|
||||
style_value = Parser::Parser::resolve_unresolved_style_value(Parser::ParsingParams { element.document() }, element, pseudo_element, property_id, style_value->as_unresolved());
|
||||
|
||||
|
|
@ -1146,9 +1144,26 @@ void StyleComputer::collect_animation_into(DOM::Element& element, Optional<CSS::
|
|||
if (result.contains(physical_longhand_id) && result.get(physical_longhand_id) != nullptr && !property_is_set_by_use_initial.get(physical_longhand_id_bitmap_index) && !is_property_preferred(property_id, longhands_set_by_property_id.get(physical_longhand_id).value()))
|
||||
return;
|
||||
|
||||
auto const& specified_value_with_css_wide_keywords_applied = [&]() -> StyleValue const& {
|
||||
if (longhand_value.is_inherit() || (longhand_value.is_unset() && is_inherited_property(longhand_id))) {
|
||||
if (auto inherited_animated_value = get_animated_inherit_value(longhand_id, &element); inherited_animated_value.has_value())
|
||||
return inherited_animated_value.value();
|
||||
|
||||
return get_inherit_value(longhand_id, &element);
|
||||
}
|
||||
|
||||
if (longhand_value.is_initial() || longhand_value.is_unset())
|
||||
return property_initial_value(longhand_id);
|
||||
|
||||
if (longhand_value.is_revert() || longhand_value.is_revert_layer())
|
||||
return computed_properties.property(longhand_id);
|
||||
|
||||
return longhand_value;
|
||||
}();
|
||||
|
||||
longhands_set_by_property_id.set(physical_longhand_id, property_id);
|
||||
property_is_set_by_use_initial.set(physical_longhand_id_bitmap_index, is_use_initial);
|
||||
result.set(physical_longhand_id, { longhand_value.absolutized(viewport_rect(), font_metrics, m_root_element_font_metrics) });
|
||||
result.set(physical_longhand_id, { specified_value_with_css_wide_keywords_applied.absolutized(viewport_rect(), font_metrics, m_root_element_font_metrics) });
|
||||
});
|
||||
}
|
||||
return result;
|
||||
|
|
|
|||
7
Tests/LibWeb/Crash/CSS/animated-revert-shorthand.html
Normal file
7
Tests/LibWeb/Crash/CSS/animated-revert-shorthand.html
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<div id="foo"></div>
|
||||
<script>
|
||||
foo.animate([{ margin: "revert" }, { margin: "0" }], 1000);
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 120 tests
|
||||
|
||||
92 Pass
|
||||
28 Fail
|
||||
102 Pass
|
||||
18 Fail
|
||||
Pass CSS Transitions: property <border-spacing> from neutral to [20px] at (-0.3) should be [7px 7px]
|
||||
Pass CSS Transitions: property <border-spacing> from neutral to [20px] at (0) should be [10px 10px]
|
||||
Pass CSS Transitions: property <border-spacing> from neutral to [20px] at (0.3) should be [13px 13px]
|
||||
|
|
@ -88,18 +88,18 @@ Pass CSS Transitions with transition: all: property <border-spacing> from [unset
|
|||
Pass CSS Transitions with transition: all: property <border-spacing> from [unset] to [20px] at (0.6) should be [24px 24px]
|
||||
Pass CSS Transitions with transition: all: property <border-spacing> from [unset] to [20px] at (1) should be [20px 20px]
|
||||
Pass CSS Transitions with transition: all: property <border-spacing> from [unset] to [20px] at (1.5) should be [15px 15px]
|
||||
Fail CSS Animations: property <border-spacing> from [unset] to [20px] at (-0.3) should be [33px 33px]
|
||||
Fail CSS Animations: property <border-spacing> from [unset] to [20px] at (0) should be [30px 30px]
|
||||
Fail CSS Animations: property <border-spacing> from [unset] to [20px] at (0.3) should be [27px 27px]
|
||||
Fail CSS Animations: property <border-spacing> from [unset] to [20px] at (0.6) should be [24px 24px]
|
||||
Pass CSS Animations: property <border-spacing> from [unset] to [20px] at (-0.3) should be [33px 33px]
|
||||
Pass CSS Animations: property <border-spacing> from [unset] to [20px] at (0) should be [30px 30px]
|
||||
Pass CSS Animations: property <border-spacing> from [unset] to [20px] at (0.3) should be [27px 27px]
|
||||
Pass CSS Animations: property <border-spacing> from [unset] to [20px] at (0.6) should be [24px 24px]
|
||||
Pass CSS Animations: property <border-spacing> from [unset] to [20px] at (1) should be [20px 20px]
|
||||
Fail CSS Animations: property <border-spacing> from [unset] to [20px] at (1.5) should be [15px 15px]
|
||||
Fail Web Animations: property <border-spacing> from [unset] to [20px] at (-0.3) should be [33px 33px]
|
||||
Fail Web Animations: property <border-spacing> from [unset] to [20px] at (0) should be [30px 30px]
|
||||
Fail Web Animations: property <border-spacing> from [unset] to [20px] at (0.3) should be [27px 27px]
|
||||
Fail Web Animations: property <border-spacing> from [unset] to [20px] at (0.6) should be [24px 24px]
|
||||
Pass CSS Animations: property <border-spacing> from [unset] to [20px] at (1.5) should be [15px 15px]
|
||||
Pass Web Animations: property <border-spacing> from [unset] to [20px] at (-0.3) should be [33px 33px]
|
||||
Pass Web Animations: property <border-spacing> from [unset] to [20px] at (0) should be [30px 30px]
|
||||
Pass Web Animations: property <border-spacing> from [unset] to [20px] at (0.3) should be [27px 27px]
|
||||
Pass Web Animations: property <border-spacing> from [unset] to [20px] at (0.6) should be [24px 24px]
|
||||
Pass Web Animations: property <border-spacing> from [unset] to [20px] at (1) should be [20px 20px]
|
||||
Fail Web Animations: property <border-spacing> from [unset] to [20px] at (1.5) should be [15px 15px]
|
||||
Pass Web Animations: property <border-spacing> from [unset] to [20px] at (1.5) should be [15px 15px]
|
||||
Fail CSS Transitions: property <border-spacing> from [0px] to [10px] at (-0.3) should be [0px 0px]
|
||||
Pass CSS Transitions: property <border-spacing> from [0px] to [10px] at (0) should be [0px 0px]
|
||||
Pass CSS Transitions: property <border-spacing> from [0px] to [10px] at (0.3) should be [3px 3px]
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 168 tests
|
||||
|
||||
128 Pass
|
||||
40 Fail
|
||||
138 Pass
|
||||
30 Fail
|
||||
Pass CSS Transitions: property <text-shadow> from neutral to [green 20px 20px 20px] at (-0.3) should be [rgb(255, 176, 0) 7px 33px 7px]
|
||||
Pass CSS Transitions: property <text-shadow> from neutral to [green 20px 20px 20px] at (0) should be [rgb(255, 165, 0) 10px 30px 10px]
|
||||
Pass CSS Transitions: property <text-shadow> from neutral to [green 20px 20px 20px] at (0.3) should be [rgb(179, 154, 0) 13px 27px 13px]
|
||||
|
|
@ -88,18 +88,18 @@ Pass CSS Transitions with transition: all: property <text-shadow> from [unset] t
|
|||
Pass CSS Transitions with transition: all: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.6) should be [rgb(102, 143, 0) 24px 16px 24px]
|
||||
Pass CSS Transitions with transition: all: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1) should be [rgb(0, 128, 0) 20px 20px 20px]
|
||||
Pass CSS Transitions with transition: all: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1.5) should be [rgb(0, 110, 0) 15px 25px 15px]
|
||||
Fail CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (-0.3) should be [rgb(255, 176, 0) 33px 7px 33px]
|
||||
Fail CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0) should be [rgb(255, 165, 0) 30px 10px 30px]
|
||||
Fail CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.3) should be [rgb(179, 154, 0) 27px 13px 27px]
|
||||
Fail CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.6) should be [rgb(102, 143, 0) 24px 16px 24px]
|
||||
Pass CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (-0.3) should be [rgb(255, 176, 0) 33px 7px 33px]
|
||||
Pass CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0) should be [rgb(255, 165, 0) 30px 10px 30px]
|
||||
Pass CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.3) should be [rgb(179, 154, 0) 27px 13px 27px]
|
||||
Pass CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.6) should be [rgb(102, 143, 0) 24px 16px 24px]
|
||||
Pass CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1) should be [rgb(0, 128, 0) 20px 20px 20px]
|
||||
Fail CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1.5) should be [rgb(0, 110, 0) 15px 25px 15px]
|
||||
Fail Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (-0.3) should be [rgb(255, 176, 0) 33px 7px 33px]
|
||||
Fail Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0) should be [rgb(255, 165, 0) 30px 10px 30px]
|
||||
Fail Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.3) should be [rgb(179, 154, 0) 27px 13px 27px]
|
||||
Fail Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.6) should be [rgb(102, 143, 0) 24px 16px 24px]
|
||||
Pass CSS Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1.5) should be [rgb(0, 110, 0) 15px 25px 15px]
|
||||
Pass Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (-0.3) should be [rgb(255, 176, 0) 33px 7px 33px]
|
||||
Pass Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0) should be [rgb(255, 165, 0) 30px 10px 30px]
|
||||
Pass Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.3) should be [rgb(179, 154, 0) 27px 13px 27px]
|
||||
Pass Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (0.6) should be [rgb(102, 143, 0) 24px 16px 24px]
|
||||
Pass Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1) should be [rgb(0, 128, 0) 20px 20px 20px]
|
||||
Fail Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1.5) should be [rgb(0, 110, 0) 15px 25px 15px]
|
||||
Pass Web Animations: property <text-shadow> from [unset] to [green 20px 20px 20px] at (1.5) should be [rgb(0, 110, 0) 15px 25px 15px]
|
||||
Fail CSS Transitions: property <text-shadow> from [black 15px 10px 5px] to [orange -15px -10px 25px] at (-0.3) should be [rgb(0, 0, 0) 24px 16px 0px]
|
||||
Pass CSS Transitions: property <text-shadow> from [black 15px 10px 5px] to [orange -15px -10px 25px] at (0) should be [rgb(0, 0, 0) 15px 10px 5px]
|
||||
Pass CSS Transitions: property <text-shadow> from [black 15px 10px 5px] to [orange -15px -10px 25px] at (0.3) should be [rgb(77, 50, 0) 6px 4px 11px]
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue