From d524dad96e7686a7f607a5bea5a3958b3126bad0 Mon Sep 17 00:00:00 2001
From: Jamal Youssefi <jamal.youssefi@gmail.com>
Date: Mon, 30 Nov 2020 17:29:55 +0100
Subject: [PATCH] fix: stream script props

---
 .travis.yml    | 4 ++--
 package.json   | 2 +-
 src/server.tsx | 8 ++++----
 yarn.lock      | 8 ++++----
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/.travis.yml b/.travis.yml
index 837c47a..98b5ce8 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,7 +1,7 @@
 language: node_js
 
 node_js:
-- '11'
+- '14'
 
 cache:
   directories:
@@ -19,5 +19,5 @@ deploy:
   api_key: $NPM_AUTH_TOKEN
   on:
     tags: true
-    node_js: '11'
+    node_js: '14'
   skip_cleanup: true
diff --git a/package.json b/package.json
index 47db69c..db815c1 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
   "devDependencies": {
     "@types/express": "^4.16.1",
     "@types/jest": "^24.0.0",
-    "@types/node": "^10.12.21",
+    "@types/node": "^14.14.10",
     "@types/react": "^16.8.2",
     "@types/react-dom": "^16.8.0",
     "@types/react-test-renderer": "^16.8.0",
diff --git a/src/server.tsx b/src/server.tsx
index 9e2d283..4adbb85 100644
--- a/src/server.tsx
+++ b/src/server.tsx
@@ -2,7 +2,7 @@ import crypto from "crypto";
 import { Request, Response } from "express";
 import React from "react";
 import { renderToNodeStream } from "react-dom/server";
-import { Transform } from "stream";
+import { Readable, Transform } from "stream";
 
 export const path = process.env.REACT_ESI_PATH || "/_fragment";
 const secret =
@@ -156,9 +156,9 @@ export async function serveFragment(
   const encodedProps = JSON.stringify(childProps).replace(/</g, "\\u003c");
 
   // Remove the <script> class from the DOM to prevent breaking the React reconciliation algorithm
-  res.write(
-    `<script>window.__REACT_ESI__ = window.__REACT_ESI__ || {}; window.__REACT_ESI__['${fragmentID}'] = ${encodedProps};document.currentScript.remove();</script>`
-  );
+  const script = "<script>window.__REACT_ESI__ = window.__REACT_ESI__ || {}; window.__REACT_ESI__['" + fragmentID + "'] = " + encodedProps + ";document.currentScript.remove();</script>";
+  const scriptStream = Readable.from(script)
+  scriptStream.pipe(res, { end: false });
 
   // Wrap the content in a div having the data-reactroot attribute, to be removed
   const stream = renderToNodeStream(
diff --git a/yarn.lock b/yarn.lock
index fa91b08..06b3a8b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -454,10 +454,10 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-14.0.5.tgz#3d03acd3b3414cf67faf999aed11682ed121f22b"
   integrity sha512-90hiq6/VqtQgX8Sp0EzeIsv3r+ellbGj4URKj5j30tLlZvRUpnAe9YbYnjl3pJM93GyXU0tghHhvXHq+5rnCKA==
 
-"@types/node@^10.12.21":
-  version "10.17.24"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.17.24.tgz#c57511e3a19c4b5e9692bb2995c40a3a52167944"
-  integrity sha512-5SCfvCxV74kzR3uWgTYiGxrd69TbT1I6+cMx1A5kEly/IVveJBimtAMlXiEyVFn5DvUFewQWxOOiJhlxeQwxgA==
+"@types/node@^14.14.10":
+  version "14.14.10"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.10.tgz#5958a82e41863cfc71f2307b3748e3491ba03785"
+  integrity sha512-J32dgx2hw8vXrSbu4ZlVhn1Nm3GbeCFNw2FWL8S5QKucHGY0cyNwjdQdO+KMBZ4wpmC7KhLCiNsdk1RFRIYUQQ==
 
 "@types/prop-types@*":
   version "15.7.3"