FormidableLabs / rapscallion

Asynchronous React VirtualDOM renderer for SSR.
MIT License
1.39k stars 50 forks source link

Invalid non-string/buffer chunk #106

Closed tehdb closed 7 years ago

tehdb commented 7 years ago

Since rapscallion update to 2.1.10 the following problem occurs:

render app setup:

import _get from "lodash/get";
import React from "react";
import { template, render } from "rapscallion";
import serialize from "serialize-javascript";
import { StaticRouter as Router } from "react-router";
import { Provider } from "react-redux";
import { IntlProvider } from "react-intl";
// ...

const initialState = getInitialState();
const store = initStore(initialState);
const routes = initRoutes();
const docType = "<!DOCTYPE html>";
const translations = { /* ... */ };
const defaultLocale = "en";
// ... 

export default function renderApp(req, res) {
    const context = {};
    const webpackAssets = getWebpackAssets();
    const currentLocale = _get(res, "locals.currentLocale", defaultLocale);

    const appRenderer = render(
        <Provider store={ store }>
            <IntlProvider
                defaultLocale={ defaultLocale }
                locale={ currentLocale }
                key={ currentLocale }
                messages={ translations[currentLocale] }
            >
                <Router
                    location={req.url}
                    context={context}
                >{ routes }</Router>
            </IntlProvider>
        </Provider>
    );

    const resRenderer = template`
        ${docType}
        <html lang="${currentLocale}">
        <head>
            <meta charSet="utf-8" />
            <link rel="stylesheet" href=${webpackAssets.app.css}>
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
        </head>
        <body>
            <div id="root">${appRenderer}</div>

            <script>
                window.__initialState__ = ${() => serialize(store.getState())};
                document.querySelector("#root").setAttribute("data-react-checksum", "${() => appRenderer.checksum()}");
            </script>
            <script src=${webpackAssets.app.js}></script>
        </body>
        </html>
    `;

    resRenderer.toStream().pipe(res);
}

Thrown exception:

Unhandled rejection TypeError: Invalid non-string/buffer chunk
    at chunkInvalid (_stream_readable.js:274:10)
    at readableAddChunk (_stream_readable.js:213:12)
    at Readable.push (_stream_readable.js:197:10)
    at /[PATH_TO_MY_APP/node_modules/rapscallion/lib/consumers/node-stream.js:38:16
    at runCallback (timers.js:800:20)
    at tryOnImmediate (timers.js:762:5)
    at processImmediate [as _immediateCallback] (timers.js:733:5)
From previous event:
    at Readable.read [as _read] (/[PATH_TO_MY_APP]/node_modules/rapscallion/lib/consumers/node-stream.js:33:10)
    at Readable.read (_stream_readable.js:431:10)
    at resume_ (_stream_readable.js:811:12)
    at _combinedTickCallback (internal/process/next_tick.js:102:11)
    at process._tickDomainCallback (internal/process/next_tick.js:198:9)

The problem does not occur with rapscallion 2.1.7

88kami88 commented 7 years ago

Thanks for the detail!

tehdb commented 7 years ago

you are welcome, let me know if you need further information or support to fix this bug

jamesjjk commented 7 years ago

Same issue version 2.1.7 fine, broken in 2.1.10

88kami88 commented 7 years ago

107 should fix this issue

88kami88 commented 7 years ago

107 was merged. Release hopefully soon.

88kami88 commented 7 years ago

@tehdb Closing this issue is I believe it is fixed in v2.1.12.