Skip to content

Commit abce89b

Browse files
lillesmertcanaltin
lilles
authored and
mertcanaltin
committed
Make view-timelines/ tests pass for run-snapshot-post-layout
Preparing for proposed change: whatwg/html#11613 Bug: 384523570 Change-Id: I88d37991e8791e276ae7e5632723efd8a82e8d9c Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6974476 Commit-Queue: Rune Lillesveen <[email protected]> Reviewed-by: Kevin Ellis <[email protected]> Cr-Commit-Position: refs/heads/main@{#1519480}
1 parent 42b8acf commit abce89b

8 files changed

+152
-102
lines changed

‎scroll-animations/view-timelines/block-view-timeline-current-time-vertical-rl.tentative.html‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,9 @@
5050
'Effect is inactive in the before phase');
5151

5252
// Advance to the start offset, which triggers entry to the active phase.
53-
container.scrollLeft = -600;
54-
await waitForNextFrame();
53+
await runAndWaitForFrameUpdate(() => {
54+
container.scrollLeft = -600;
55+
});
5556
assert_percents_equal(timeline.currentTime, 0,
5657
"Timeline's current time at start offset");
5758
assert_percents_equal(anim.currentTime, 0,
@@ -60,8 +61,9 @@
6061
'Effect at the start of the active phase');
6162

6263
// Advance to the midpoint of the animation.
63-
container.scrollLeft = -800;
64-
await waitForNextFrame();
64+
await runAndWaitForFrameUpdate(() => {
65+
container.scrollLeft = -800;
66+
});
6567
assert_percents_equal(timeline.currentTime, 50,
6668
"Timeline's currentTime at midpoint");
6769
assert_percents_equal(anim.currentTime, 50,
@@ -70,9 +72,10 @@
7072
'Effect at the midpoint of the active range');
7173

7274
// Advance to the end of the animation.
73-
container.scrollLeft = -1000;
74-
anim.effect.updateTiming({ fill: 'forwards' });
75-
await waitForNextFrame();
75+
await runAndWaitForFrameUpdate(() => {
76+
container.scrollLeft = -1000;
77+
anim.effect.updateTiming({ fill: 'forwards' });
78+
});
7679
assert_percents_equal(timeline.currentTime, 100,
7780
"Timeline's currentTime at end offset");
7881
assert_percents_equal(anim.currentTime, 100,
@@ -84,8 +87,9 @@
8487
'Opacity with fill none at effect end time');
8588

8689
// Advance to the scroll limit.
87-
container.scrollLeft = -1600;
88-
await waitForNextFrame();
90+
await runAndWaitForFrameUpdate(() => {
91+
container.scrollLeft = -1600;
92+
});
8993
assert_percents_equal(timeline.currentTime, 250,
9094
"Timeline's currentTime at scroll limit");
9195
// Hold time set when the animation finishes, which clamps the value of

‎scroll-animations/view-timelines/block-view-timeline-current-time.tentative.html‎

Lines changed: 36 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,9 @@
5050
'Effect is inactive in the before phase');
5151

5252
// Advance to the start offset, which triggers entry to the active phase.
53-
container.scrollTop = 600;
54-
await waitForNextFrame();
53+
await runAndWaitForFrameUpdate(() => {
54+
container.scrollTop = 600;
55+
});
5556
assert_percents_equal(timeline.currentTime, 0,
5657
"Timeline's current time at start offset");
5758
assert_percents_equal(anim.currentTime, 0,
@@ -60,8 +61,9 @@
6061
'Effect at the start of the active phase');
6162

6263
// Advance to the midpoint of the animation.
63-
container.scrollTop = 800;
64-
await waitForNextFrame();
64+
await runAndWaitForFrameUpdate(() => {
65+
container.scrollTop = 800;
66+
});
6567
assert_percents_equal(timeline.currentTime, 50,
6668
"Timeline's currentTime at midpoint");
6769
assert_percents_equal(anim.currentTime, 50,
@@ -70,8 +72,9 @@
7072
'Effect at the midpoint of the active range');
7173

7274
// Advance to the end of the animation.
73-
container.scrollTop = 1000;
74-
await waitForNextFrame();
75+
await runAndWaitForFrameUpdate(() => {
76+
container.scrollTop = 1000;
77+
});
7578
assert_percents_equal(timeline.currentTime, 100,
7679
"Timeline's currentTime at end offset");
7780
assert_percents_equal(anim.currentTime, 100,
@@ -80,8 +83,9 @@
8083
'Effect is in the after phase at effect end time');
8184

8285
// Advance to the scroll limit.
83-
container.scrollTop = 1600;
84-
await waitForNextFrame();
86+
await runAndWaitForFrameUpdate(() => {
87+
container.scrollTop = 1600;
88+
});
8589
assert_percents_equal(timeline.currentTime, 250,
8690
"Timeline's currentTime at scroll limit");
8791
// Hold time set when the animation finishes, which clamps the value of
@@ -101,8 +105,9 @@
101105
leading.style = null;
102106
});
103107

104-
container.scrollTop = 0;
105-
await waitForNextFrame();
108+
await runAndWaitForFrameUpdate(() => {
109+
container.scrollTop = 0;
110+
});
106111

107112
const anim = CreateViewTimelineOpacityAnimation(t, target);
108113
const timeline = anim.timeline;
@@ -117,8 +122,9 @@
117122

118123

119124
// Advance to midpoint
120-
container.scrollTop = 100;
121-
await waitForNextFrame();
125+
await runAndWaitForFrameUpdate(() => {
126+
container.scrollTop = 100;
127+
});
122128
assert_percents_equal(timeline.currentTime, 75,
123129
"Timeline's current time at midpoint");
124130
assert_percents_equal(anim.currentTime, 75,
@@ -127,8 +133,9 @@
127133
'Effect at the middle of the active phase');
128134

129135
// Advance to end-offset
130-
container.scrollTop = 200;
131-
await waitForNextFrame();
136+
await runAndWaitForFrameUpdate(() => {
137+
container.scrollTop = 200;
138+
});
132139
assert_percents_equal(timeline.currentTime, 100,
133140
"Timeline's current time at end offset");
134141
assert_percents_equal(anim.currentTime, 100,
@@ -137,8 +144,9 @@
137144
'Effect inactive at the end offset');
138145

139146
// Advance to scroll limit.
140-
container.scrollTop = 800;
141-
await waitForNextFrame();
147+
await runAndWaitForFrameUpdate(() => {
148+
container.scrollTop = 800;
149+
});
142150
assert_percents_equal(timeline.currentTime, 250,
143151
"Timeline's current time at scroll limit");
144152
assert_percents_equal(anim.currentTime, 100,
@@ -155,8 +163,9 @@
155163
trailing.style = null;
156164
});
157165

158-
container.scrollTop = 0;
159-
await waitForNextFrame();
166+
await runAndWaitForFrameUpdate(() => {
167+
container.scrollTop = 0;
168+
});
160169

161170
const anim = CreateViewTimelineOpacityAnimation(t, target);
162171
const timeline = anim.timeline;
@@ -171,8 +180,9 @@
171180
'Effect enters active phase at container start boundary');
172181

173182
// Advance to start offset.
174-
container.scrollTop = 600;
175-
await waitForNextFrame();
183+
await runAndWaitForFrameUpdate(() => {
184+
container.scrollTop = 600;
185+
});
176186
assert_percents_equal(timeline.currentTime, 0,
177187
"Timeline's current time at start offset");
178188
assert_percents_equal(anim.currentTime, 0,
@@ -181,8 +191,9 @@
181191
'Effect at the start of the active phase');
182192

183193
// Advance to midpoint.
184-
container.scrollTop = 700;
185-
await waitForNextFrame();
194+
await runAndWaitForFrameUpdate(() => {
195+
container.scrollTop = 700;
196+
});
186197
assert_percents_equal(timeline.currentTime, 25,
187198
"Timeline's current time at the midpoint");
188199
assert_percents_equal(anim.currentTime, 25,
@@ -191,8 +202,9 @@
191202
'Effect at the midpoint of the active phase');
192203

193204
// Advance to end offset.
194-
container.scrollTop = 800;
195-
await waitForNextFrame();
205+
await runAndWaitForFrameUpdate(() => {
206+
container.scrollTop = 800;
207+
});
196208
assert_percents_equal(timeline.currentTime, 50,
197209
"Timeline's currentTime at max scroll offset");
198210
assert_percents_equal(anim.currentTime, 50,

‎scroll-animations/view-timelines/block-view-timeline-nested-subject.tentative.html‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -66,8 +66,9 @@
6666

6767

6868
// Advance to the start offset, which triggers entry to the active phase.
69-
container.scrollTop = 600;
70-
await waitForNextFrame();
69+
await runAndWaitForFrameUpdate(() => {
70+
container.scrollTop = 600;
71+
});
7172
assert_percents_equal(timeline.currentTime, 0,
7273
"Timeline's current time at start offset");
7374
assert_percents_equal(anim.currentTime, 0,
@@ -76,8 +77,9 @@
7677
'Effect at the start of the active phase');
7778

7879
// Advance to the midpoint of the animation.
79-
container.scrollTop = 800;
80-
await waitForNextFrame();
80+
await runAndWaitForFrameUpdate(() => {
81+
container.scrollTop = 800;
82+
});
8183
assert_percents_equal(timeline.currentTime, 50,
8284
"Timeline's currentTime at midpoint");
8385
assert_percents_equal(anim.currentTime, 50,
@@ -86,8 +88,9 @@
8688
'Effect at the midpoint of the active range');
8789

8890
// Advance to the end of the animation.
89-
container.scrollTop = 1000;
90-
await waitForNextFrame();
91+
await runAndWaitForFrameUpdate(() => {
92+
container.scrollTop = 1000;
93+
});
9194
assert_percents_equal(timeline.currentTime, 100,
9295
"Timeline's currentTime at end offset");
9396
assert_percents_equal(anim.currentTime, 100,
@@ -96,8 +99,9 @@
9699
'Effect is in the after phase at effect end time');
97100

98101
// Advance to the scroll limit.
99-
container.scrollTop = 1600;
100-
await waitForNextFrame();
102+
await runAndWaitForFrameUpdate(() => {
103+
container.scrollTop = 1600;
104+
});
101105
assert_percents_equal(timeline.currentTime, 225,
102106
"Timeline's currentTime at scroll limit");
103107
// Hold time set when the animation finishes, which clamps the value of

‎scroll-animations/view-timelines/inline-subject.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -40,9 +40,10 @@
4040
await anim.ready;
4141
assert_equals(getComputedStyle(anim.effect.target)
4242
.backgroundColor, 'rgb(0, 0, 255)');
43-
scroller.scrollTop =
44-
scroller.scrollHeight - scroller.clientHeight;
45-
await waitForNextFrame();
43+
44+
await runAndWaitForFrameUpdate(() => {
45+
scroller.scrollTop = scroller.scrollHeight - scroller.clientHeight;
46+
});
4647
assert_equals(getComputedStyle(anim.effect.target)
4748
.backgroundColor, 'rgb(0, 128, 0)');
4849
}, 'View timeline attached to SVG graphics element');

0 commit comments

Comments
 (0)