You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Take note that the model never resolves, and the HTML in the fixture is never updated:
The current behavior
The model never resolves, and the data is never rendered to the DOM.
Other findings
If you console.log each chunk individually using response.getReader().read() ..., you'll see chunks written, but some are duplicates, and some are out of order. In the reader, done never gets called.
If you remove the Suspense read() from the Title component in the fixture, everything works correctly.
If you add add a console.logafterlet blob = await responseToDisplay.blob();, it never logs. This means that response.blob() is hanging.
If you replace the contents of display with renderResult(ReactServerDOMReader.createFromReadableStream(responseToDisplay.body)), everything works correctly.
We're seeing this same behavior in Hydrogen: Shopify/hydrogen#463 both when calling renderToReadableStream and passing that to Response in a Workers runtime, and when calling renderToReadableStream and consuming that stream in an SSR context. The chunks are written out of order and duplicated, and the response never resolves.
It's very odd that the automated tests in react-dom-server-webpack/.../ReactFlightDOMBrowser-test.js do not fail under these same conditions. I'm trying to pinpoint the conditions where this happens — e.g. is it when a ReadableStream gets sent through a Response.body? — but I can't nail it down yet.
The expected behavior
The flight model resolves when using renderToReadableStream with Suspense, and the data is rendered to the DOM.
The text was updated successfully, but these errors were encountered:
React version: 0.0.0-experimental-0cc724c77-20211125 (and
main
)Steps To Reproduce
main
open fixtures/flight-browser/index.html
The current behavior
The model never resolves, and the data is never rendered to the DOM.
Other findings
console.log
each chunk individually usingresponse.getReader().read() ...
, you'll see chunks written, but some are duplicates, and some are out of order. In the reader,done
never gets called.read()
from theTitle
component in the fixture, everything works correctly.console.log
afterlet blob = await responseToDisplay.blob();
, it never logs. This means thatresponse.blob()
is hanging.display
withrenderResult(ReactServerDOMReader.createFromReadableStream(responseToDisplay.body))
, everything works correctly.We're seeing this same behavior in Hydrogen: Shopify/hydrogen#463 both when calling
renderToReadableStream
and passing that toResponse
in a Workers runtime, and when callingrenderToReadableStream
and consuming that stream in an SSR context. The chunks are written out of order and duplicated, and the response never resolves.It's very odd that the automated tests in
react-dom-server-webpack/.../ReactFlightDOMBrowser-test.js
do not fail under these same conditions. I'm trying to pinpoint the conditions where this happens — e.g. is it when a ReadableStream gets sent through aResponse.body
? — but I can't nail it down yet.The expected behavior
The flight model resolves when using
renderToReadableStream
with Suspense, and the data is rendered to the DOM.The text was updated successfully, but these errors were encountered: