Recover from SSR error in Flight fixture (#28368)
If an error happens before the shell, we need to handle it. In this case we choose the strategy of rendering a blank document and client rendering the app. Which will intentionally have a hydration mismatch.
Sebastian Markbåge committed
Feb 19, 2024 at 11:50 UTC
017397d7d33f151f2c2a9936c4b130fded68d08b
2 files changed
+14
-8
fixtures/flight/server/global.js
+12
-1
@@ -174,8 +174,19 @@ app.all('/', async function (req, res, next) {
174
const {pipe} = renderToPipeableStream(React.createElement(Root), {
175
bootstrapScripts: mainJSChunks,
176
formState: formState,
177
+ onShellReady() {
178
+ pipe(res);
179
+ },
180
+ onShellError(error) {
181
+ const {pipe: pipeError} = renderToPipeableStream(
182
+ React.createElement('html', null, React.createElement('body')),
183
+ {
184
+ bootstrapScripts: mainJSChunks,
185
+ }
186
+ );
187
+ pipeError(res);
188
+ },
189
});
178
- pipe(res);
190
} catch (e) {
191
console.error(`Failed to SSR: ${e.stack}`);
192
res.statusCode = 500;
fixtures/flight/server/region.js
+2
-7
@@ -103,13 +103,8 @@ app.get('/', async function (req, res) {
103
});
104
105
app.post('/', bodyParser.text(), async function (req, res) {
106
- const {
107
- renderToPipeableStream,
108
- decodeReply,
109
- decodeReplyFromBusboy,
110
- decodeAction,
111
- decodeFormState,
112
- } = await import('react-server-dom-webpack/server');
106
+ const {decodeReply, decodeReplyFromBusboy, decodeAction, decodeFormState} =
107
+ await import('react-server-dom-webpack/server');
108
const serverReference = req.get('rsc-action');
109
if (serverReference) {
110
// This is the client-side case