Skip to content

Commit 91ac1fe

Browse files
authored
[Fizz] Pass batch as argument to revealCompletedBoundaries (#33330)
Follow up to #33293. This solves a race condition when boundaries are added to the batch after the `startViewTransition` call. This doesn't matter yet but it will once we start assigning names before the `startViewTransition` call. A possible alternative solution might be to ensure the names are added synchronously in the event that adds to the batch. It's possible to keep adding to a batch until the snapshot has happened.
1 parent 08064ea commit 91ac1fe

File tree

2 files changed

+18
-10
lines changed

2 files changed

+18
-10
lines changed

packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetInlineCodeStrings.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react-dom-bindings/src/server/fizz-instruction-set/ReactDOMFizzInstructionSetShared.js

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,8 @@ const SUSPENSE_FALLBACK_START_DATA = '$!';
1818
// working. Closure converts it to a dot access anyway, though, so it's not an
1919
// urgent issue.
2020

21-
export function revealCompletedBoundaries() {
21+
export function revealCompletedBoundaries(batch) {
2222
window['$RT'] = performance.now();
23-
const batch = window['$RB'];
24-
window['$RB'] = [];
2523
for (let i = 0; i < batch.length; i += 2) {
2624
const suspenseIdNode = batch[i];
2725
const contentNode = batch[i + 1];
@@ -79,37 +77,47 @@ export function revealCompletedBoundaries() {
7977
suspenseNode['_reactRetry']();
8078
}
8179
}
80+
batch.length = 0;
8281
}
8382

84-
export function revealCompletedBoundariesWithViewTransitions(revealBoundaries) {
83+
export function revealCompletedBoundariesWithViewTransitions(
84+
revealBoundaries,
85+
batch,
86+
) {
8587
try {
8688
const existingTransition = document['__reactViewTransition'];
8789
if (existingTransition) {
8890
// Retry after the previous ViewTransition finishes.
89-
existingTransition.finished.then(window['$RV'], window['$RV']);
91+
existingTransition.finished.finally(window['$RV'].bind(null, batch));
9092
return;
9193
}
9294
const shouldStartViewTransition = window['_useVT']; // TODO: Detect.
9395
if (shouldStartViewTransition) {
9496
const transition = (document['__reactViewTransition'] = document[
9597
'startViewTransition'
9698
]({
97-
update: revealBoundaries,
99+
update: revealBoundaries.bind(null, batch),
98100
types: [], // TODO: Add a hard coded type for Suspense reveals.
99101
}));
102+
transition.ready.finally(() => {
103+
// TODO
104+
});
100105
transition.finished.finally(() => {
101106
if (document['__reactViewTransition'] === transition) {
102107
document['__reactViewTransition'] = null;
103108
}
104109
});
110+
// Queue any future completions into its own batch since they won't have been
111+
// snapshotted by this one.
112+
window['$RB'] = [];
105113
return;
106114
}
107115
// Fall through to reveal.
108116
} catch (x) {
109117
// Fall through to reveal.
110118
}
111119
// ViewTransitions v2 not supported or no ViewTransitions found. Reveal immediately.
112-
revealBoundaries();
120+
revealBoundaries(batch);
113121
}
114122

115123
export function clientRenderBoundary(
@@ -182,7 +190,7 @@ export function completeBoundary(suspenseBoundaryID, contentID) {
182190
// We always schedule the flush in a timer even if it's very low or negative to allow
183191
// for multiple completeBoundary calls that are already queued to have a chance to
184192
// make the batch.
185-
setTimeout(window['$RV'], msUntilTimeout);
193+
setTimeout(window['$RV'].bind(null, window['$RB']), msUntilTimeout);
186194
}
187195
}
188196

0 commit comments

Comments
 (0)