chromium/src/third_party/blink/web_tests/external/wpt/web-animations/timing-model/animations/seamlessly-updating-the-playback-rate-of-an-animation.html - manifest_repos/chromium_src - Git at Google

 <!doctype html>
 <meta charset=utf-8>
 <title>Seamlessly updating the playback rate of an animation</title>
 <link rel="help"
   href="https://drafts.csswg.org/web-animations-1/#seamlessly-updating-the-playback-rate-of-an-animation">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="../../testcommon.js"></script>
 <body>
 <div id="log"></div>
 <script>
 'use strict';

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   await animation.ready;

   animation.currentTime = 50 * MS_PER_SEC;

   animation.updatePlaybackRate(0.5);
   await animation.ready;
   // Since the animation is in motion (and we want to test it while it is in
   // motion!) we can't assert that the current time == 50s but we can check
   // that the current time is NOT re-calculated by simply substituting in the
   // new playback rate (i.e. without adjusting the start time). If that were
   // the case the currentTime would jump to 25s. So we just test the currentTime
   // hasn't gone backwards.
   assert_greater_than_equal(animation.currentTime, 50 * MS_PER_SEC,
     'Reducing the playback rate should not change the current time ' +
     'of a playing animation');

   animation.updatePlaybackRate(2);
   await animation.ready;
   // Likewise, we test here that the current time does not jump to 100s as it
   // would if we naively applied a playbackRate of 2 without adjusting the
   // startTime.
   assert_less_than(animation.currentTime, 100 * MS_PER_SEC,
     'Increasing the playback rate should not change the current time ' +
     'of a playing animation');
 }, 'Updating the playback rate maintains the current time');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   await animation.ready;

   assert_false(animation.pending);
   animation.updatePlaybackRate(2);
   assert_true(animation.pending);
 }, 'Updating the playback rate while running makes the animation pending');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   animation.currentTime = 50 * MS_PER_SEC;
   assert_true(animation.pending);

   animation.updatePlaybackRate(0.5);

   // Check that the hold time is updated as expected
   assert_time_equals_literal(animation.currentTime, 50 * MS_PER_SEC);

   await animation.ready;

   // As above, check that the currentTime is not calculated by simply
   // substituting in the updated playbackRate without updating the startTime.
   assert_greater_than_equal(animation.currentTime, 50 * MS_PER_SEC,
     'Reducing the playback rate should not change the current time ' +
     'of a play-pending animation');
 }, 'Updating the playback rate on a play-pending animation maintains'
    + ' the current time');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   animation.currentTime = 50 * MS_PER_SEC;
   await animation.ready;

   animation.pause();
   animation.updatePlaybackRate(0.5);

   assert_greater_than_equal(animation.currentTime, 50 * MS_PER_SEC);
 }, 'Updating the playback rate on a pause-pending animation maintains'
    + ' the current time');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);

   animation.updatePlaybackRate(2);
   animation.updatePlaybackRate(3);
   animation.updatePlaybackRate(4);

   assert_equals(animation.playbackRate, 1);
   await animation.ready;

   assert_equals(animation.playbackRate, 4);
 }, 'If a pending playback rate is set multiple times, the latest wins');

 test(t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   animation.cancel();

   animation.updatePlaybackRate(2);
   assert_equals(animation.playbackRate, 2);
   assert_false(animation.pending);
 }, 'In the idle state, the playback rate is applied immediately');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   animation.pause();
   await animation.ready;

   animation.updatePlaybackRate(2);
   assert_equals(animation.playbackRate, 2);
   assert_false(animation.pending);
 }, 'In the paused state, the playback rate is applied immediately');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   animation.finish();
   assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
   assert_false(animation.pending);

   animation.updatePlaybackRate(2);
   assert_equals(animation.playbackRate, 2);
   assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
   assert_false(animation.pending);
 }, 'Updating the playback rate on a finished animation maintains'
    + ' the current time');

 promise_test(async t => {
   const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
   animation.finish();
   assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
   assert_false(animation.pending);

   animation.updatePlaybackRate(0);
   assert_equals(animation.playbackRate, 0);
   assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
   assert_false(animation.pending);
 }, 'Updating the playback rate to zero on a finished animation maintains'
    + ' the current time');

 </script>
 </body>
	<!doctype html>
	<meta charset=utf-8>
	<title>Seamlessly updating the playback rate of an animation</title>
	<link rel="help"
	href="https://drafts.csswg.org/web-animations-1/#seamlessly-updating-the-playback-rate-of-an-animation">
	<script src="/resources/testharness.js"></script>
	<script src="/resources/testharnessreport.js"></script>
	<script src="../../testcommon.js"></script>
	<body>
	<div id="log"></div>
	<script>
	'use strict';

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	await animation.ready;

	animation.currentTime = 50 * MS_PER_SEC;

	animation.updatePlaybackRate(0.5);
	await animation.ready;
	// Since the animation is in motion (and we want to test it while it is in
	// motion!) we can't assert that the current time == 50s but we can check
	// that the current time is NOT re-calculated by simply substituting in the
	// new playback rate (i.e. without adjusting the start time). If that were
	// the case the currentTime would jump to 25s. So we just test the currentTime
	// hasn't gone backwards.
	assert_greater_than_equal(animation.currentTime, 50 * MS_PER_SEC,
	'Reducing the playback rate should not change the current time ' +
	'of a playing animation');

	animation.updatePlaybackRate(2);
	await animation.ready;
	// Likewise, we test here that the current time does not jump to 100s as it
	// would if we naively applied a playbackRate of 2 without adjusting the
	// startTime.
	assert_less_than(animation.currentTime, 100 * MS_PER_SEC,
	'Increasing the playback rate should not change the current time ' +
	'of a playing animation');
	}, 'Updating the playback rate maintains the current time');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	await animation.ready;

	assert_false(animation.pending);
	animation.updatePlaybackRate(2);
	assert_true(animation.pending);
	}, 'Updating the playback rate while running makes the animation pending');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	animation.currentTime = 50 * MS_PER_SEC;
	assert_true(animation.pending);

	animation.updatePlaybackRate(0.5);

	// Check that the hold time is updated as expected
	assert_time_equals_literal(animation.currentTime, 50 * MS_PER_SEC);

	await animation.ready;

	// As above, check that the currentTime is not calculated by simply
	// substituting in the updated playbackRate without updating the startTime.
	assert_greater_than_equal(animation.currentTime, 50 * MS_PER_SEC,
	'Reducing the playback rate should not change the current time ' +
	'of a play-pending animation');
	}, 'Updating the playback rate on a play-pending animation maintains'
	+ ' the current time');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	animation.currentTime = 50 * MS_PER_SEC;
	await animation.ready;

	animation.pause();
	animation.updatePlaybackRate(0.5);

	assert_greater_than_equal(animation.currentTime, 50 * MS_PER_SEC);
	}, 'Updating the playback rate on a pause-pending animation maintains'
	+ ' the current time');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);

	animation.updatePlaybackRate(2);
	animation.updatePlaybackRate(3);
	animation.updatePlaybackRate(4);

	assert_equals(animation.playbackRate, 1);
	await animation.ready;

	assert_equals(animation.playbackRate, 4);
	}, 'If a pending playback rate is set multiple times, the latest wins');

	test(t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	animation.cancel();

	animation.updatePlaybackRate(2);
	assert_equals(animation.playbackRate, 2);
	assert_false(animation.pending);
	}, 'In the idle state, the playback rate is applied immediately');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	animation.pause();
	await animation.ready;

	animation.updatePlaybackRate(2);
	assert_equals(animation.playbackRate, 2);
	assert_false(animation.pending);
	}, 'In the paused state, the playback rate is applied immediately');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	animation.finish();
	assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
	assert_false(animation.pending);

	animation.updatePlaybackRate(2);
	assert_equals(animation.playbackRate, 2);
	assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
	assert_false(animation.pending);
	}, 'Updating the playback rate on a finished animation maintains'
	+ ' the current time');

	promise_test(async t => {
	const animation = createDiv(t).animate(null, 100 * MS_PER_SEC);
	animation.finish();
	assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
	assert_false(animation.pending);

	animation.updatePlaybackRate(0);
	assert_equals(animation.playbackRate, 0);
	assert_time_equals_literal(animation.currentTime, 100 * MS_PER_SEC);
	assert_false(animation.pending);
	}, 'Updating the playback rate to zero on a finished animation maintains'
	+ ' the current time');

	</script>
	</body>