ec51539954
Automatic update from web-platform-tests [ScrollTimeline] Run tests on cc if threaded compositing is enabled The scroller in the updated tests is not composited by default. When we run the tests with the virtual/threaded test suite, the tests can not properly run on the compositor because cc::ScrollTimeline is considered as inactive, i.e. scroller is not in cc::ScrollTree because it's not composited. This patch forces compositing the scrollers if the animation needs to play. Note that once all ScrollNodes including uncomposited ones are in the compositor after the scroll unification (crbug.com/476553), we no longer need to add will-change to the scrollers. Bug: None Change-Id: I0e379abb071c9bffc58f2167f4cac9f92edbb9da Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2211048 Reviewed-by: Xida Chen <xidachen@chromium.org> Commit-Queue: Yi Gu <yigu@chromium.org> Cr-Commit-Position: refs/heads/master@{#771161} -- wpt-commits: 4a7093f7968cd6badcd1720cf08cb1f285e20c9a wpt-pr: 23719
295 lines
10 KiB
HTML
295 lines
10 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset=utf-8>
|
|
<title>Setting the current time of an animation</title>
|
|
<link rel="help" href="https://drafts.csswg.org/web-animations-1/#setting-the-current-time-of-an-animation">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="/web-animations/testcommon.js"></script>
|
|
<script src="testcommon.js"></script>
|
|
<style>
|
|
.scroller {
|
|
overflow: auto;
|
|
height: 200px;
|
|
width: 100px;
|
|
will-change: transform;
|
|
}
|
|
.contents {
|
|
height: 1000px;
|
|
width: 100%;
|
|
}
|
|
</style>
|
|
<body>
|
|
<div id="log"></div>
|
|
<script>
|
|
'use strict';
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
await animation.ready;
|
|
|
|
assert_throws_js(TypeError, () => {
|
|
animation.currentTime = null;
|
|
});
|
|
}, 'Setting animation current time to null throws TypeError.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
|
|
animation.currentTime = 333;
|
|
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
333,
|
|
"Animation current time should be equal to the set value."
|
|
);
|
|
}, 'Set animation current time to a valid value without playing.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
await animation.ready;
|
|
animation.currentTime = 333;
|
|
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
333,
|
|
"Animation current time should be equal to the set value."
|
|
);
|
|
}, 'Set animation current time to a valid value while playing.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
const range = animation.timeline.timeRange;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
await animation.ready;
|
|
const largerThanDuration = animation.effect.getTiming().duration * 2;
|
|
animation.currentTime = largerThanDuration;
|
|
|
|
assert_greater_than_equal(largerThanDuration, range, "Make sure that the" +
|
|
" test value is after the end of the effect and the timeline");
|
|
assert_equals(animation.playState, "finished");
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
largerThanDuration,
|
|
"Animation current time should be equal to the set value."
|
|
);
|
|
}, 'Set animation current time to a value beyond effect end.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
const range = animation.timeline.timeRange;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
await animation.ready;
|
|
animation.currentTime = -100;
|
|
|
|
assert_equals(animation.playState, "running");
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
-100,
|
|
"Animation current time should be equal to the set value."
|
|
);
|
|
}, 'Set animation current time to a negative value.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
animation.currentTime = 300;
|
|
|
|
assert_equals(animation.playState, "running");
|
|
assert_true(animation.pending);
|
|
assert_time_equals_literal(animation.currentTime, 300);
|
|
}, "Setting current time while play pending overrides the current time");
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
await animation.ready;
|
|
animation.currentTime = 333;
|
|
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
333,
|
|
"Animation current time should be equal to the set value."
|
|
);
|
|
|
|
// Cancel the animation and play it again, check that current time has reset
|
|
// to scroll offset based current time.
|
|
animation.cancel();
|
|
animation.play();
|
|
await animation.ready;
|
|
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
animation.timeline.currentTime,
|
|
"Animation current time should return to a value matching its" +
|
|
" timeline current time after animation is cancelled and played again."
|
|
);
|
|
}, 'Setting animation.currentTime then restarting the animation should' +
|
|
' reset the current time.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
|
|
scroller.scrollTop = 0.25 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
|
|
await animation.ready;
|
|
const originalCurrentTime = animation.currentTime;
|
|
|
|
// Set the current time to something other than where the scroll offset.
|
|
animation.currentTime = 500;
|
|
|
|
// Setting current time is internally setting the start time to
|
|
// scrollTimeline.currentTime - newAnimationCurrentTime.
|
|
// Which results in current time of (timeline.currentTime - start_time).
|
|
// This behavior puts the animation in a strange "out of sync" state between
|
|
// the scroller and the animation effect, this is currently expected
|
|
// behavior.
|
|
|
|
const expectedStartTime = originalCurrentTime - animation.currentTime;
|
|
assert_times_equal(
|
|
animation.startTime,
|
|
expectedStartTime,
|
|
"Animation current time should be updated when setting the current time" +
|
|
" to a time within the range of the animation.");
|
|
|
|
scroller.scrollTop = 0.7 * maxScroll;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
|
|
assert_times_equal(
|
|
animation.startTime,
|
|
expectedStartTime,
|
|
"Animation start time should remain unchanged when the scroller changes" +
|
|
" position."
|
|
);
|
|
assert_times_equal(
|
|
animation.currentTime,
|
|
animation.timeline.currentTime - animation.startTime,
|
|
"Animation current time should return to a value equal to" +
|
|
" (timeline.currentTime - animation.startTime) after timeline scroll" +
|
|
" source has been scrolled."
|
|
);
|
|
}, 'Set Animation current time then scroll.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
await animation.ready;
|
|
|
|
// Make the timeline inactive.
|
|
scroller.style.overflow = 'visible';
|
|
scroller.scrollTop;
|
|
await waitForNextFrame();
|
|
|
|
assert_equals(animation.currentTime, null,
|
|
'Current time is unresolved when the timeline is inactive.');
|
|
|
|
animation.currentTime = 300;
|
|
assert_equals(animation.currentTime, 300,
|
|
'Animation current time should be equal to the set value.');
|
|
assert_equals(animation.playState, 'paused',
|
|
'Animation play state is \'paused\' when current time is set and ' +
|
|
'timeline is inactive.');
|
|
}, 'Animation current time and play state are correct when current time is ' +
|
|
'set while the timeline is inactive.');
|
|
|
|
promise_test(async t => {
|
|
const animation = createScrollLinkedAnimation(t);
|
|
const scroller = animation.timeline.scrollSource;
|
|
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
animation.play();
|
|
await animation.ready;
|
|
|
|
// Make the timeline inactive.
|
|
scroller.style.overflow = 'visible';
|
|
scroller.scrollTop;
|
|
await waitForNextFrame();
|
|
|
|
assert_equals(animation.timeline.currentTime, null,
|
|
'Current time is unresolved when the timeline is inactive.');
|
|
|
|
animation.currentTime = 300;
|
|
assert_equals(animation.currentTime, 300,
|
|
'Animation current time should be equal to the set value.');
|
|
assert_equals(animation.playState, 'paused',
|
|
'Animation play state is \'paused\' when current time is set and ' +
|
|
'timeline is inactive.');
|
|
|
|
// Make the timeline active.
|
|
scroller.style.overflow = 'auto';
|
|
scroller.scrollTop;
|
|
await waitForNextFrame();
|
|
|
|
assert_equals(animation.timeline.currentTime, 0,
|
|
'Current time is resolved when the timeline is active.');
|
|
assert_equals(animation.currentTime, 300,
|
|
'Animation current time holds the set value.');
|
|
assert_equals(animation.playState, 'paused',
|
|
'Animation holds \'paused\' state.');
|
|
}, 'Animation current time set while the timeline is inactive holds when the ' +
|
|
'timeline becomes active again.');
|
|
</script>
|
|
</body>
|