| Index: tools/perf/page_sets/tough_animation_cases/transform_transition_js_block.html
|
| diff --git a/tools/perf/page_sets/tough_animation_cases/transform_transition_js_block.html b/tools/perf/page_sets/tough_animation_cases/transform_transition_js_block.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..02dfcdcb1f17b0cb8d90a1c7bdb3c191f75cee2b
|
| --- /dev/null
|
| +++ b/tools/perf/page_sets/tough_animation_cases/transform_transition_js_block.html
|
| @@ -0,0 +1,45 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| +<head>
|
| +<meta charset="utf-8">
|
| +<title>JS janking CSS transition</title>
|
| +
|
| +<style>
|
| + html {
|
| + font-family: sans-serif;
|
| + }
|
| +
|
| + .box {
|
| + background: green;
|
| + position: relative;
|
| + width: 100px;
|
| + height: 100px;
|
| + -webkit-transition: -webkit-transform 10s linear;
|
| + transition: transform 10s linear;
|
| +
|
| + /* Adding these lines fixes the issue
|
| + -webkit-transform: translate3d(0, 0, 0);
|
| + transform: translate3d(0, 0, 0);
|
| + */
|
| + }
|
| +</style>
|
| +</head>
|
| +<body>
|
| +<div class="box"></div>
|
| +<button class="run">Run</button>
|
| +<script>
|
| + function jankify() {
|
| + var start = Date.now();
|
| + while (Date.now() - start < 250);
|
| + setTimeout(jankify, 750);
|
| + }
|
| +
|
| + var box = document.querySelector('.box');
|
| +
|
| + window.addEventListener('load', function() {
|
| + box.style.transform = box.style.WebkitTransform = 'translate3d(500px, 0, 0)'
|
| + jankify();
|
| + });
|
| +</script>
|
| +</body>
|
| +</html>
|
|
|
Chromium Code Reviews
Issue 12036096:
Adding janky transform test case (Closed)
Base URL: https://git.chromium.org/chromium/src.git@master