mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-07-31 05:09:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Fix extra validation for EasingStyleValue intervals

Browse source
This commit is contained in:
Pavel Shliak 2024-11-18 17:13:42 +04:00 • committed by Alexander Kalenik
commit b342758dbf
Notes: github-actions[bot] 2024-11-19 13:11:56 +00:00
3 changed files with 33 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
Libraries/LibWeb/CSS/Parser/Parser.cpp
View file

@ -6506,13 +6506,13 @@ RefPtr<CSSStyleValue> Parser::parse_easing_value(TokenStream<ComponentValue>& to
}
// Perform extra validation
// https://drafts.csswg.org/css-easing/#funcdef-step-easing-function-steps
// The first parameter specifies the number of intervals in the function. It must be a positive integer greater than 0
// unless the second parameter is jump-none in which case it must be a positive integer greater than 1.
// https://drafts.csswg.org/css-easing/#step-easing-functions
// If the <step-position> is jump-none, the <integer> must be at least 2, or the function is invalid.
// Otherwise, the <integer> must be at least 1, or the function is invalid.
if (steps.position == EasingStyleValue::Steps::Position::JumpNone) {
if (intervals < 1)
if (intervals <= 1)
return nullptr;
} else if (intervals < 0) {
} else if (intervals <= 0) {
return nullptr;
}

1
Tests/LibWeb/Text/expected/WebAnimations/misc/parse-animation-timing-function-steps.txt Normal file
View file

@ -0,0 +1 @@
Computed animation-timing-function: ease

27
Tests/LibWeb/Text/input/WebAnimations/misc/parse-animation-timing-function-steps.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<style>
@keyframes test-animation {
from {
transform: translateX(0);
}
to {
transform: translateX(100px);
}
}
.animate {
animation: test-animation 2s steps(1, jump-none) infinite;
}
</style>
<div class="box animate" style="width: 50px; height: 50px; background-color: red;"></div>
<script src="../../include.js"></script>
<script>
test(() => {
// Apply animation dynamically to trigger re-computation.
document.querySelector('.box').classList.add('animate');
// Log computed style to confirm the animation is parsed and applied correctly.
const animation = getComputedStyle(document.querySelector('.box')).animationTimingFunction;
println('Computed animation-timing-function: ' + animation);
});
</script>