Commit affde464 authored by Eric Willigers's avatar Eric Willigers Committed by Commit Bot

animation-events tests: force style recalc at start

Instead of using setTimeout to hope for a style recalculation,
we now read offsetTop to force a style recalculation.


Bug: 770362
Change-Id: Ic4918cd336aef56641e483ce2ae8d31ceb29acc9
Reviewed-on: https://chromium-review.googlesource.com/700154Reviewed-by: default avatarAli Juma <ajuma@chromium.org>
Commit-Queue: Eric Willigers <ericwilligers@chromium.org>
Cr-Commit-Position: refs/heads/master@{#506499}
parent ad7eeea3
......@@ -65,11 +65,12 @@
document.addEventListener('animationend', function() {
endEventReceived = true;
document.getElementById('box').className = '';
document.getElementById('box').offsetTop; // force style recalc
// Launch again the animation to catch the animation iteration events this time.
setTimeout(function () {
document.getElementById('box').style.animationIterationCount = "infinite";
document.getElementById('box').className = 'animate';
}, 200);
document.getElementById('box').style.animationIterationCount = "infinite";
document.getElementById('box').className = 'animate';
}, false);
onload = function()
......
......@@ -46,11 +46,12 @@
function recordAnimationEnd() {
endEventReceived = true;
document.getElementById('box').className = '';
document.getElementById('box').offsetTop; // force style recalc
// Launch again the animation to catch the animation iteration events this time.
setTimeout(function () {
document.getElementById('box').style.animationIterationCount = "infinite";
document.getElementById('box').className = 'animate';
}, 200);
document.getElementById('box').style.animationIterationCount = "infinite";
document.getElementById('box').className = 'animate';
}
</script>
</head>
......
......@@ -46,11 +46,12 @@
document.addEventListener('animationend', function() {
endEventReceived = true;
document.getElementById('box').className = '';
document.getElementById('box').offsetTop; // force style recalc
// Launch again the animation to catch the animation iteration events this time.
setTimeout(function () {
document.getElementById('box').style.animationIterationCount = "infinite";
document.getElementById('box').className = 'animate';
}, 200);
document.getElementById('box').style.animationIterationCount = "infinite";
document.getElementById('box').className = 'animate';
}, false);
onload = function()
......
......@@ -29,21 +29,20 @@
if (window.testRunner)
testRunner.waitUntilDone();
const expectedValues = [
const expectedValues = [
// [time, element-id, property, expected-value, tolerance]
[0.5, "control", "left", 200, 10],
[0.5, "test", "left", 200, 10],
];
[0.5, "control", "left", 200, 0],
[0.5, "test", "left", 200, 0],
];
function setupTest()
{
document.getElementById('movers').className = 'moved';
movers.offsetTop; // force style recalc
movers.className = 'moved';
runAnimationTest(expectedValues);
}
window.addEventListener('load', function() {
window.setTimeout(setupTest, 0);
}, false);
window.addEventListener('load', setupTest, false);
</script>
</head>
<body>
......
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