mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-28 11:49:44 +00:00
LibWeb: Don't play initially-paused animations
Some checks are pending
CI / macOS, arm64, Sanitizer_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Fuzzers_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, GNU (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, Clang (push) Waiting to run
Package the js repl as a binary artifact / macOS, arm64 (push) Waiting to run
Package the js repl as a binary artifact / Linux, x86_64 (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
Some checks are pending
CI / macOS, arm64, Sanitizer_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Fuzzers_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, GNU (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, Clang (push) Waiting to run
Package the js repl as a binary artifact / macOS, arm64 (push) Waiting to run
Package the js repl as a binary artifact / Linux, x86_64 (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
This commit is contained in:
parent
6169e91994
commit
e96338dd63
Notes:
github-actions[bot]
2025-06-18 15:18:49 +00:00
Author: https://github.com/Gingeh
Commit: e96338dd63
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/5114
Reviewed-by: https://github.com/gmta ✅
Reviewed-by: https://github.com/tcl3
11 changed files with 143 additions and 37 deletions
32
Tests/LibWeb/Text/input/css/initially-paused-animation.html
Normal file
32
Tests/LibWeb/Text/input/css/initially-paused-animation.html
Normal file
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
div {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: #3498db;
|
||||
position: relative;
|
||||
animation: moveRight 0.1s linear;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
@keyframes moveRight {
|
||||
0% {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
left: 100px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<script src="../include.js"></script>
|
||||
<div></div>
|
||||
<script>
|
||||
test(() => {
|
||||
let animation = document.querySelector("div").getAnimations()[0];
|
||||
println(animation.playState);
|
||||
animation.play();
|
||||
println(animation.playState);
|
||||
});
|
||||
</script>
|
59
Tests/LibWeb/Text/input/css/showing-hidden-animation.html
Normal file
59
Tests/LibWeb/Text/input/css/showing-hidden-animation.html
Normal file
|
@ -0,0 +1,59 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
#paused, #running, #pseudo::before, #pseudo::after {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: #3498db;
|
||||
position: relative;
|
||||
animation: moveRight 1s linear;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
#paused {
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
#running {
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
#pseudo::before {
|
||||
content: 'running';
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
#pseudo::after {
|
||||
content: 'paused';
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
@keyframes moveRight {
|
||||
0% {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
left: 100px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<script src="../include.js"></script>
|
||||
<div id="outer" style="display: none;">
|
||||
<div id="paused"></div>
|
||||
<div id="running"></div>
|
||||
<div id="pseudo"></div>
|
||||
</div>
|
||||
<script>
|
||||
asyncTest((done) => {
|
||||
setTimeout(() => {
|
||||
document.getElementById("outer").style.display = "block";
|
||||
println(document.getElementById("paused").getAnimations()[0].playState);
|
||||
println(document.getElementById("running").getAnimations()[0].playState);
|
||||
println(document.getElementById("pseudo").getAnimations()[0].playState);
|
||||
println(document.getElementById("pseudo").getAnimations()[1].playState);
|
||||
done();
|
||||
}, 100);
|
||||
});
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue