Open
Description
If a player does not have start time 0, and/or the player does not have playback rate 1, calling document.timeline._pauseAnimationsForTesting with the current timeline time will change the player's currentTime, and will change the animated element's computed style.
var target = document.getElementById('target');
var targetPlayer;
window.setTimeout(function() {
var keyframes = [
{ width: '200px'},
{ width: '300px'}
];
targetPlayer = target.animate(keyframes, 5000);
targetPlayer.playbackRate = 0.25;
}, 2000);
function describeTarget() {
console.log('document.timeline.currentTime = ' + document.timeline.currentTime);
console.log('targetPlayer.startTime = ' + targetPlayer.startTime);
console.log('targetPlayer.currentTime = ' + targetPlayer.currentTime);
console.log('getComputedStyle(target).width = ' + getComputedStyle(target).width);
}
window.setTimeout(function() {
describeTarget();
var currentTime = document.timeline.currentTime;
document.timeline._pauseAnimationsForTesting(currentTime);
console.log('*** AFTER CALLING document.timeline._pauseAnimationsForTesting('+currentTime+') ***');
describeTarget();
}, 4000);
leads to (with numbers rounded)
document.timeline.currentTime = 4000
targetPlayer.startTime = 2000
targetPlayer.currentTime = 500
getComputedStyle(target).width = 210
*** AFTER CALLING document.timeline._pauseAnimationsForTesting(4000) ***
document.timeline.currentTime = 4000
targetPlayer.startTime = 2000
targetPlayer.currentTime = 4000
getComputedStyle(target).width = 280
Metadata
Metadata
Assignees
Labels
No labels