| Index: third_party/WebKit/LayoutTests/animations/animated-css-property-usecounter.html
|
| diff --git a/third_party/WebKit/LayoutTests/animations/animated-css-property-usecounter.html b/third_party/WebKit/LayoutTests/animations/animated-css-property-usecounter.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..d5c8e4729b078a264839f16f55284cc0f7ae5079
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/animations/animated-css-property-usecounter.html
|
| @@ -0,0 +1,90 @@
|
| +<!DOCTYPE html>
|
| +<script src="../resources/testharness.js"></script>
|
| +<script src="../resources/testharnessreport.js"></script>
|
| +
|
| +<style>
|
| +@keyframes bgColorAnim {
|
| + from {
|
| + background-color: blue;
|
| + }
|
| + to {
|
| + background-color: red;
|
| + }
|
| +}
|
| +
|
| +@keyframes customPropertyAnim {
|
| + from {
|
| + --x: blue;
|
| + }
|
| + to {
|
| + --x: red;
|
| + }
|
| +}
|
| +
|
| +#target {
|
| + width: 100px;
|
| + height: 100px;
|
| +}
|
| +</style>
|
| +
|
| +<div id="target"></div>
|
| +
|
| +<script>
|
| +'use strict';
|
| +
|
| +test(() => {
|
| + assert_true(
|
| + internals.isCSSPropertyUseCounted(document, "background-color"),
|
| + 'Usage of background-color in style causes it to be counted in ' +
|
| + 'normal CSS property UseCounter');
|
| + assert_true(
|
| + internals.isCSSPropertyUseCounted(document, "width"),
|
| + 'Usage of width in style causes it to be counted in normal CSS ' +
|
| + 'property UseCounter');
|
| +
|
| + assert_false(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "background-color"),
|
| + 'Initially background-color animation has not been UseCounted');
|
| + assert_false(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "width"),
|
| + 'Initially width animation has not been UseCounted');
|
| +
|
| + target.style.animation = 'bgColorAnim 1s';
|
| + target.offsetTop; // force recalc
|
| +
|
| + assert_true(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "background-color"),
|
| + 'After applying the animation, background-color has been counted');
|
| + assert_false(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "width"),
|
| + 'Width is not animated, so not counted');
|
| +}, 'Animating properties via CSS causes UseCounter to be incremented.');
|
| +
|
| +test(() => {
|
| + assert_true(
|
| + internals.isCSSPropertyUseCounted(document, "--x"),
|
| + 'Usage of custom property --x in style causes it to be counted in ' +
|
| + 'normal CSS property UseCounter');
|
| + assert_true(
|
| + internals.isCSSPropertyUseCounted(document, "--y"),
|
| + 'All custom properties are counted together in normal CSS property ' +
|
| + 'UseCounter');
|
| +
|
| + assert_false(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "--x"),
|
| + 'Initially custom property --x animation has not been UseCounted');
|
| + assert_false(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "--y"),
|
| + 'Initially custom property --y animation has not been UseCounted');
|
| +
|
| + target.style.animation = 'customPropertyAnim 1s';
|
| + target.offsetTop; // force recalc
|
| +
|
| + assert_true(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "--x"),
|
| + 'After applying the animation, custom property animation has been counted');
|
| + assert_true(
|
| + internals.isAnimatedCSSPropertyUseCounted(document, "--y"),
|
| + 'All custom property animations are counted together');
|
| +}, 'Animating custom CSS properties causes UseCounter to be incremented.');
|
| +</script>
|
|
|
Chromium Code Reviews
Issue 2678143003:
Move CSS animations use counters to UseCounter (Closed)
