Skip to content

GitLab

T
tangled
Commit 60ac816f authored by jakearchibald@google.com's avatar jakearchibald@google.com
Browse files
Options

Adding janky transform test case 


BUG=http://code.google.com/p/chromium/issues/detail?id=172102


Review URL: https://chromiumcodereview.appspot.com/12036096

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@182202 0039d316-1c4b-4281-b951-d872f2087c98
parent ef6cf922
Hide whitespace changes
Inline Side-by-side
Showing with 53 additions and 0 deletions
tools/perf/page_sets/tough_animation_cases.json
View file @ 60ac816f
...@@ -24,6 +24,14 @@ ...@@ -24,6 +24,14 @@
"action": "wait_action", "action": "wait_action",
"duration": 5 "duration": 5
} }
},
{
"url": "file:///tough_animation_cases/transform_transition_js_block.html",
"why": "JS execution blocks CSS transition unless initial transform is set",
"smoothness": {
"action": "wait_interaction",
"duration": 5
}
} }
] ]
} }
tools/perf/page_sets/tough_animation_cases/transform_transition_js_block.html 0 → 100644
View file @ 60ac816f
<!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>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment