| Index: third_party/WebKit/LayoutTests/animations/add-keyframes-recalc.html
|
| diff --git a/third_party/WebKit/LayoutTests/animations/add-keyframes-recalc.html b/third_party/WebKit/LayoutTests/animations/add-keyframes-recalc.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..cd35208cc60a2935b3e9077bd903339c8a1ee1c3
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/animations/add-keyframes-recalc.html
|
| @@ -0,0 +1,62 @@
|
| +<!DOCTYPE html>
|
| +<script src="../resources/testharness.js"></script>
|
| +<script src="../resources/testharnessreport.js"></script>
|
| +<div id="anim"></div>
|
| +<script>
|
| + test(() => assert_not_equals(window.internals, undefined, "No window.internals."), "Needs window.internals for testing");
|
| + anim.offsetTop;
|
| +</script>
|
| +<style>
|
| + @keyframes unused {
|
| + from { color: pink }
|
| + to { color: orange }
|
| + }
|
| +</style>
|
| +<script>
|
| + test(() =>
|
| + assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2, "Incorrect element recalc count.")
|
| + , "Check that adding @keyframes does not cause a style recalc of the anim element when no animations are running.");
|
| +</script>
|
| +<style>
|
| + #anim {
|
| + color: red;
|
| + animation-name: later;
|
| + animation-duration: 100s;
|
| + animation-timing-function: step-end;
|
| + }
|
| +</style>
|
| +<script>
|
| + test(() =>
|
| + assert_equals(getComputedStyle(anim).color, "rgb(255, 0, 0)", "Color of #anim is not red.")
|
| + , "Check initial color of #anim.");
|
| +
|
| + anim.offsetTop;
|
| +</script>
|
| +<style>
|
| + @keyframes later {
|
| + from { color: green }
|
| + to { color: red }
|
| + }
|
| +</style>
|
| +<script>
|
| + test(() =>
|
| + assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 13, "Incorrect full document recalc count")
|
| + , "Check that adding @keyframes after keyframe resolution failed, recalculates whole document");
|
| +
|
| + test(() =>
|
| + assert_equals(getComputedStyle(anim).color, "rgb(0, 128, 0)", "Color of #anim during animation is not green.")
|
| + , "Check that @keyframes rule applies.");
|
| +
|
| + anim.offsetTop;
|
| +</script>
|
| +<style>
|
| + @keyframes unused2 {
|
| + from { color: pink }
|
| + to { color: orange }
|
| + }
|
| +</style>
|
| +<script>
|
| + test(() =>
|
| + assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3, "Incorrect recalc count.")
|
| + , "Check that adding @keyframes causes a style recalc of the anim element when an animation is running.");
|
| +</script>
|
|
|
Chromium Code Reviews
Issue 2105743002:
Optimize style recalc when adding @keyframes. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master