- From: Antoine Quint via GitHub <sysbot+gh@w3.org>
- Date: Sat, 24 Feb 2018 11:40:13 +0000
- To: public-css-archive@w3.org
graouts has just created a new issue for https://github.com/w3c/csswg-drafts:
== [web-animations-1] Pausing and setting the current time to animation duration resets the play state to finished ==
The following test fails in a WebKit development branch I'm working on:
```javascript
promise_test(t => {
const div = createDiv(t);
const animation = div.animate({}, 100 * MS_PER_SEC);
// Setup callback to run if finished promise is resolved
let finishPromiseResolved = false;
animation.finished.then(() => {
finishPromiseResolved = true;
});
return animation.ready.then(() => {
// Jump to mid-way in interval and pause
animation.currentTime = 100 * MS_PER_SEC / 2;
animation.pause();
// Jump to the end
animation.currentTime = 100 * MS_PER_SEC;
return waitForAnimationFrames(2);
}).then(() => {
assert_false(finishPromiseResolved,
'Finished promise should not resolve when pause-pending');
});
}, 'Finished promise does not resolve when pause-pending');
```
The issue that I see is that the playState is no longer `paused` once we set `currentTime` to `100ms` after the call to `pause()`.
>From my reading of the spec, when `pause()` is called the *hold time* is set in the [pending pause task](https://drafts.csswg.org/web-animations/#pending-pause-task) which is performed asynchronously. So when the call to `pause` returns, the *hold time* is unresolved and the *start time* is resolved.
Then we [set the current time](https://drafts.csswg.org/web-animations/#set-the-current-time) to `100ms` and start by [silently setting the current time](https://drafts.csswg.org/web-animations/#silently-set-the-current-time). We then have these two options:
> Update either animation’s hold time or start time as follows:
>
> If any of the following conditions are true:
> animation’s hold time is resolved, or
> animation’s start time is unresolved, or
> animation has no associated timeline or the associated timeline is inactive, or
> animation’s playback rate is 0,
> Set animation's hold time to seek time.
> Otherwise,
> Set animation's start time to the result of evaluating *`timeline time - (seek time / playback rate)`* where timeline time is the current time value of timeline associated with animation.
So we execute the "Otherwise" clause since none of the conditions of the first clause are true. I think the reason we check whether the *hold time* is resolved is to identify whether the animation is currently paused. If that is the case, then shouldn't we check its *play state* instead? This would account for the *pending paused task*.
As a result, currently, [setting the start time](https://drafts.csswg.org/web-animations/#setting-the-start-time-of-an-animation) will cancel the *pending pause task* and the finished promise will resolve when the [finish notification steps](https://drafts.csswg.org/web-animations/#finish-notification-steps) are executed.
Note that letting the *pending pause task* run before updating the `currentTime` to `100ms` makes the test work as expected:
```javascript
promise_test(t => {
const div = createDiv(t);
const animation = div.animate({}, 100 * MS_PER_SEC);
// Setup callback to run if finished promise is resolved
let finishPromiseResolved = false;
animation.finished.then(() => {
finishPromiseResolved = true;
});
return animation.ready.then(() => {
// Jump to mid-way in interval and pause
animation.currentTime = 100 * MS_PER_SEC / 2;
animation.pause();
animation.ready.then(() => {
// Jump to the end
animation.currentTime = 100 * MS_PER_SEC;
});
return waitForAnimationFrames(2);
}).then(() => {
assert_false(finishPromiseResolved,
'Finished promise should not resolve when pause-pending');
});
}, 'Finished promise does not resolve when pause-pending');
```
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2357 using your GitHub account
Received on Saturday, 24 February 2018 11:40:50 UTC