Automatic update from web-platform-tests Initial implementation of progress based ScrollTimelines This work is the first step in implementing upcoming spec change in: https://github.com/w3c/csswg-drafts/issues/4862 Converted AnimationTimeline::currentTime() to CSSNumberish Added AnimationTimeline::duration Bug: 1140602 Change-Id: I5c9b8b7130b91faae5f172493ba5f55d77b4bdd6 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2476900 Commit-Queue: Jordan Taylor <jortaylo@microsoft.com> Reviewed-by: Robert Flack <flackr@chromium.org> Cr-Commit-Position: refs/heads/master@{#826533} -- wpt-commits: d494b8ec23759c6bfb747bee1ff3a1b3d67f5177 wpt-pr: 26142
502 lines
19 KiB
HTML
502 lines
19 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<title>ScrollTimeline current time algorithm</title>
|
|
<link rel="help" href="https://wicg.github.io/scroll-animations/#current-time-algorithm">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="/web-animations/testcommon.js"></script>
|
|
<script src="./resources/scrolltimeline-utils.js"></script>
|
|
<script src="./testcommon.js"></script>
|
|
|
|
<body></body>
|
|
|
|
<script>
|
|
'use strict';
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollerSize = scroller.scrollHeight - scroller.clientHeight;
|
|
const blockScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller
|
|
});
|
|
|
|
assert_equals(blockScrollTimeline.duration.unit, "percent",
|
|
"duration returns as a percent for scroll timelines");
|
|
assert_equals(blockScrollTimeline.duration.value, 100, "duration is 100%");
|
|
}, "Scroll timeline correctly returns duration as 100%");
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollerSize = scroller.scrollHeight - scroller.clientHeight;
|
|
|
|
const blockScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block'
|
|
});
|
|
const inlineScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'inline'
|
|
});
|
|
const horizontalScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'horizontal'
|
|
});
|
|
const verticalScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'vertical'
|
|
});
|
|
|
|
// Unscrolled, all timelines should read a currentTime of 0.
|
|
assert_percent_css_unit_value_approx_equals(
|
|
blockScrollTimeline.currentTime, 0, 0, 'Unscrolled block timeline');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
inlineScrollTimeline.currentTime, 0, 0, 'Unscrolled inline timeline');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
horizontalScrollTimeline.currentTime, 0, 0,
|
|
'Unscrolled horizontal timeline');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
verticalScrollTimeline.currentTime, 0, 0, 'Unscrolled vertical timeline');
|
|
|
|
// Do some scrolling and make sure that the ScrollTimelines update.
|
|
scroller.scrollTop = 50;
|
|
scroller.scrollLeft = 75;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
|
|
assert_percent_css_unit_value_approx_equals(
|
|
blockScrollTimeline.currentTime, 12.048, 0.01, 'Scrolled block timeline');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
inlineScrollTimeline.currentTime, 18.072, 0.01, 'Scrolled inline timeline');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
horizontalScrollTimeline.currentTime, 18.072, 0.01, 'Scrolled horizontal timeline');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
verticalScrollTimeline.currentTime, 12.048, 0.01, 'Scrolled vertical timeline');
|
|
}, 'currentTime calculates the correct time based on scroll progress');
|
|
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollerSize = scroller.scrollHeight - scroller.clientHeight;
|
|
|
|
const lengthScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
startScrollOffset: CSS.px(20)
|
|
});
|
|
const percentageScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
startScrollOffset: CSS.percent(20)
|
|
});
|
|
const calcScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
startScrollOffset: CSS.percent(20).sub(CSS.px(5))
|
|
});
|
|
|
|
// Unscrolled all timelines should read a current time of 0, as the
|
|
// current offset (0) will be less than the startScrollOffset.
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime, 0, 0,
|
|
'Unscrolled length-based timeline current time');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "before",
|
|
'Unscrolled length-based timeline phase');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime, 0, 0,
|
|
'Unscrolled percentage-based timeline current time');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "before",
|
|
'Unscrolled percentage-based timeline phase');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime, 0, 0,
|
|
'Unscrolled calc-based timeline current time');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "before",
|
|
'Unscrolled calc-based timeline phase');
|
|
|
|
// Check the length-based ScrollTimeline.
|
|
scroller.scrollTop = 19;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime, 0, 0,
|
|
'Length-based timeline current time before the startScrollOffset'
|
|
+ ' point');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "before",
|
|
'Length-based timeline phase before the startScrollOffset point');
|
|
scroller.scrollTop = 20;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime, 0, 0,
|
|
'Length-based timeline current time at the startScrollOffset point');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "active",
|
|
'Length-based timeline phase at the startScrollOffset point');
|
|
scroller.scrollTop = 50;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime,
|
|
calculateCurrentTime(50, 20, scrollerSize, 100), 0.01,
|
|
'Length-based timeline current time after the startScrollOffset point');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "active",
|
|
'Length-based timeline phase after the startScrollOffset point');
|
|
|
|
// Check the percentage-based ScrollTimeline.
|
|
scroller.scrollTop = 0.19 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime, 0, 0,
|
|
'Percentage-based timeline current time before the startScrollOffset'
|
|
+ ' point');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "before",
|
|
'Percentage-based timeline phase before the startScrollOffset point');
|
|
scroller.scrollTop = 0.20 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime, 0, 0,
|
|
'Percentage-based timeline current time at the startScrollOffset point');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "active",
|
|
'Percentage-based timeline phase at the startScrollOffset point');
|
|
scroller.scrollTop = 0.50 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime,
|
|
calculateCurrentTime(
|
|
scroller.scrollTop, 0.2 * scrollerSize, scrollerSize, 100), 0.01,
|
|
'Percentage-based timeline current time after the startScrollOffset'
|
|
+ ' point');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "active",
|
|
'Percentage-based timeline phase after the startScrollOffset point');
|
|
|
|
// Check the calc-based ScrollTimeline.
|
|
scroller.scrollTop = 0.2 * scrollerSize - 10;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime, 0, 0,
|
|
'Calc-based timeline current time before the startScrollOffset point');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "before",
|
|
'Calc-based timeline phase at the startScrollOffset point');
|
|
scroller.scrollTop = 0.2 * scrollerSize - 5;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime, 0, 0,
|
|
'Calc-based timeline current time at the startScrollOffset point');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "active",
|
|
'Calc-based timeline phase at the startScrollOffset point');
|
|
scroller.scrollTop = 0.2 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime,
|
|
calculateCurrentTime(
|
|
scroller.scrollTop, 0.2 * scrollerSize - 5, scrollerSize,
|
|
100), 0.01,
|
|
'Calc-based timeline current time after the startScrollOffset point');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "active",
|
|
'Calc-based timeline phase at the startScrollOffset point');
|
|
}, 'currentTime handles startScrollOffset correctly');
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollerSize = scroller.scrollHeight - scroller.clientHeight;
|
|
|
|
// When the endScrollOffset is equal to the maximum scroll offset (and there
|
|
// are no fill modes), the endScrollOffset is treated as inclusive.
|
|
const inclusiveAutoScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: 'auto'
|
|
});
|
|
const inclusiveLengthScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: CSS.px(scrollerSize)
|
|
});
|
|
const inclusivePercentageScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: CSS.percent(100)
|
|
});
|
|
const inclusiveCalcScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: CSS.percent(80).add(CSS.px(0.2 * scrollerSize))
|
|
});
|
|
|
|
scroller.scrollTop = scrollerSize;
|
|
let expectedCurrentTime = calculateCurrentTime(
|
|
scroller.scrollTop, 0, scrollerSize, 100);
|
|
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
|
|
assert_percent_css_unit_value_approx_equals(
|
|
inclusiveAutoScrollTimeline.currentTime, expectedCurrentTime, 0.01,
|
|
'Inclusive auto timeline at the endScrollOffset point');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
inclusiveLengthScrollTimeline.currentTime, expectedCurrentTime, 0.01, 0.01,
|
|
'Inclusive length-based timeline at the endScrollOffset point');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
inclusivePercentageScrollTimeline.currentTime, expectedCurrentTime, 0.01,
|
|
'Inclusive percentage-based timeline at the endScrollOffset point');
|
|
assert_percent_css_unit_value_approx_equals(
|
|
inclusiveCalcScrollTimeline.currentTime, expectedCurrentTime, 0.01,
|
|
'Inclusive calc-based timeline at the endScrollOffset point');
|
|
}, 'currentTime handles endScrollOffset correctly (inclusive cases)');
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollerSize = scroller.scrollHeight - scroller.clientHeight;
|
|
|
|
const lengthScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: CSS.px(scrollerSize - 20)
|
|
});
|
|
const percentageScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: CSS.percent(80)
|
|
});
|
|
const calcScrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
endScrollOffset: CSS.percent(80).add(CSS.px(5))
|
|
});
|
|
|
|
// Check the length-based ScrollTimeline.
|
|
scroller.scrollTop = scrollerSize;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime, 100, 0.01,
|
|
'Length-based timeline current time after the endScrollOffset point');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "after",
|
|
'Length-based timeline phase after the endScrollOffset point');
|
|
scroller.scrollTop = scrollerSize - 20;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime, 100, 0.01,
|
|
'Length-based timeline current time at the endScrollOffset point');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "after",
|
|
'Length-based timeline phase at the endScrollOffset point');
|
|
scroller.scrollTop = scrollerSize - 50;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
lengthScrollTimeline.currentTime,
|
|
calculateCurrentTime(
|
|
scrollerSize - 50, 0, scrollerSize - 20, 100), 0.01,
|
|
'Length-based timeline current time before the endScrollOffset point');
|
|
assert_equals(
|
|
lengthScrollTimeline.phase, "active",
|
|
'Length-based timeline phase before the endScrollOffset point');
|
|
|
|
// Check the percentage-based ScrollTimeline.
|
|
scroller.scrollTop = 0.81 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime, 100, 0.01,
|
|
'Percentage-based timeline current time after the endScrollOffset point');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "after",
|
|
'Percentage-based timeline phase after the endScrollOffset point');
|
|
scroller.scrollTop = 0.80 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime, 100, 0.01,
|
|
'Percentage-based timeline current time at the endScrollOffset point');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "after",
|
|
'Percentage-based timeline phase at the endScrollOffset point');
|
|
scroller.scrollTop = 0.50 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
percentageScrollTimeline.currentTime,
|
|
calculateCurrentTime(
|
|
scroller.scrollTop, 0, 0.8 * scrollerSize, 100), 0.01,
|
|
'Percentage-based timeline current time before the endScrollOffset point');
|
|
assert_equals(
|
|
percentageScrollTimeline.phase, "active",
|
|
'Percentage-based timeline phase before the endScrollOffset point');
|
|
|
|
// Check the calc-based ScrollTimeline.
|
|
scroller.scrollTop = 0.8 * scrollerSize + 6;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime, 100, 0.01,
|
|
'Calc-based timeline current time after the endScrollOffset point');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "after",
|
|
'Calc-based timeline phase after the endScrollOffset point');
|
|
scroller.scrollTop = 0.8 * scrollerSize + 5;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime, 100, 0.01,
|
|
'Calc-based timeline current time at the endScrollOffset point');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "after",
|
|
'Calc-based timeline phase at the endScrollOffset point');
|
|
scroller.scrollTop = 0.5 * scrollerSize;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
calcScrollTimeline.currentTime,
|
|
calculateCurrentTime(
|
|
scroller.scrollTop, 0, 0.8 * scrollerSize + 5, 100), 0.01,
|
|
'Calc-based timeline current time before the endScrollOffset point');
|
|
assert_equals(
|
|
calcScrollTimeline.phase, "active",
|
|
'Calc-based timeline phase before the endScrollOffset point');
|
|
}, 'currentTime handles endScrollOffset correctly');
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollerSize = scroller.scrollHeight - scroller.clientHeight;
|
|
|
|
const scrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
startScrollOffset: CSS.px(20),
|
|
endScrollOffset: CSS.px(scrollerSize - 50)
|
|
});
|
|
|
|
scroller.scrollTop = 150;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime,
|
|
calculateCurrentTime(150, 20, scrollerSize - 50, 100), 0.01);
|
|
}, 'currentTime handles startScrollOffset and endScrollOffset together correctly');
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
startScrollOffset: CSS.px(20),
|
|
endScrollOffset: CSS.px(20)
|
|
});
|
|
|
|
scroller.scrollTop = 150;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(scrollTimeline.currentTime,
|
|
100, 0.01);
|
|
}, 'currentTime handles startScrollOffset == endScrollOffset correctly');
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
startScrollOffset: CSS.px(50),
|
|
endScrollOffset: CSS.px(10)
|
|
});
|
|
|
|
scroller.scrollTop = 40;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(scrollTimeline.currentTime, 0, 0.01);
|
|
scroller.scrollTop = 60;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(scrollTimeline.currentTime, 100, 0.01);
|
|
}, 'currentTime handles startScrollOffset > endScrollOffset correctly');
|
|
|
|
promise_test(async t => {
|
|
const scroller = setupScrollTimelineTest();
|
|
const scrollTimeline = new ScrollTimeline({
|
|
scrollSource: scroller,
|
|
orientation: 'block',
|
|
scrollOffsets: [CSS.px(10), CSS.px(20), CSS.px(40), CSS.px(70), CSS.px(90)],
|
|
});
|
|
|
|
var offset = 0;
|
|
var w = 1 / 4; // offset weight
|
|
var p = 0; // progress within the offset
|
|
|
|
scroller.scrollTop = 10;
|
|
// Wait for new animation frame which allows the timeline to compute new
|
|
// current time.
|
|
await waitForNextFrame();
|
|
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
p = (12 - 10) / (20 - 10);
|
|
scroller.scrollTop = 12;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
offset = 1;
|
|
p = 0;
|
|
scroller.scrollTop = 20;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
p = (35 - 20) / (40 - 20);
|
|
scroller.scrollTop = 35;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
offset = 2;
|
|
p = 0;
|
|
scroller.scrollTop = 40;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
p = (60 - 40) / (70 - 40);
|
|
scroller.scrollTop = 60;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
offset = 3;
|
|
p = 0;
|
|
scroller.scrollTop = 70;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
p = (80 - 70) / (90 - 70);
|
|
scroller.scrollTop = 80;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, (offset + p) * w * 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
|
|
scroller.scrollTop = 90;
|
|
await waitForNextFrame();
|
|
assert_percent_css_unit_value_approx_equals(
|
|
scrollTimeline.currentTime, 100, 0.01,
|
|
"current time calculation when scroll = " + scroller.scrollTop);
|
|
}, 'currentTime calculations when multiple scroll offsets are specified');
|
|
|
|
</script>
|