diff --git a/packages/react-client/src/ReactFlightClient.js b/packages/react-client/src/ReactFlightClient.js index ec69d8aea9870..cfe82093df3ef 100644 --- a/packages/react-client/src/ReactFlightClient.js +++ b/packages/react-client/src/ReactFlightClient.js @@ -2077,32 +2077,34 @@ function startAsyncIterable( } }, }; - const iterable: $AsyncIterable = { - [ASYNC_ITERATOR](): $AsyncIterator { - let nextReadIndex = 0; - return createIterator(arg => { - if (arg !== undefined) { - throw new Error( - 'Values cannot be passed to next() of AsyncIterables passed to Client Components.', + + const iterable: $AsyncIterable = ({}: any); + // $FlowFixMe[cannot-write] + iterable[ASYNC_ITERATOR] = (): $AsyncIterator => { + let nextReadIndex = 0; + return createIterator(arg => { + if (arg !== undefined) { + throw new Error( + 'Values cannot be passed to next() of AsyncIterables passed to Client Components.', + ); + } + if (nextReadIndex === buffer.length) { + if (closed) { + // $FlowFixMe[invalid-constructor] Flow doesn't support functions as constructors + return new ReactPromise( + INITIALIZED, + {done: true, value: undefined}, + null, + response, ); } - if (nextReadIndex === buffer.length) { - if (closed) { - // $FlowFixMe[invalid-constructor] Flow doesn't support functions as constructors - return new ReactPromise( - INITIALIZED, - {done: true, value: undefined}, - null, - response, - ); - } - buffer[nextReadIndex] = - createPendingChunk>(response); - } - return buffer[nextReadIndex++]; - }); - }, + buffer[nextReadIndex] = + createPendingChunk>(response); + } + return buffer[nextReadIndex++]; + }); }; + // TODO: If it's a single shot iterator we can optimize memory by cleaning up the buffer after // reading through the end, but currently we favor code size over this optimization. resolveStream(