configure timeout for livereload component

remix-run · Sep 3, 2022 · 47db8a3 · 47db8a3
1 parent 3d9a72f
commit 47db8a3
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/packages/remix-react/__tests__/components-test.tsx b/packages/remix-react/__tests__/components-test.tsx
@@ -65,6 +65,14 @@ describe("<LiveReload />", () => {
         `1234 + "/socket"`
       );
     });
+
+    it("timeout of reload is set to 200ms", () => {
+      LiveReload = require("../components").LiveReload;
+      let { container } = render(<LiveReload timeout={200} />);
+      expect(container.querySelector("script")).toHaveTextContent(
+        "setTimeout( () => remixLiveReloadConnect({ onOpen: () => window.location.reload(), }), 200 );"
+      );
+    });
   });
 });
 

diff --git a/packages/remix-react/components.tsx b/packages/remix-react/components.tsx
@@ -1474,9 +1474,11 @@ export const LiveReload =
     ? () => null
     : function LiveReload({
         port = Number(process.env.REMIX_DEV_SERVER_WS_PORT || 8002),
+        timeout = 1000,
         nonce = undefined,
       }: {
         port?: number;
+        timeout?: number;
         /**
          * @deprecated this property is no longer relevant.
          */
@@ -1519,7 +1521,7 @@ export const LiveReload =
                         remixLiveReloadConnect({
                           onOpen: () => window.location.reload(),
                         }),
-                      1000
+                      ${String(timeout)}
                     );
                   };
                   ws.onerror = (error) => {