From 2affbb30eec773aa8dbd93c1475f046ab71dc491 Mon Sep 17 00:00:00 2001
From: Chad Taylor <chadtaylor@hey.com>
Date: Sun, 15 May 2022 21:43:00 -0500
Subject: [PATCH] fix(remix-dev): ensure devServerPort config value is the same
 across reloads

If the devServerPort changes values across config reloads then
LiveReload will attempt to connect to an incorrect port. Files being
created, deleted, or renamed under the app folder trigger config
reloads.

* chore: sign cla
---
 contributors.yml                                |  1 +
 packages/remix-dev/__tests__/readConfig-test.ts |  5 +++++
 packages/remix-dev/config.ts                    | 10 +++++++++-
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/contributors.yml b/contributors.yml
index 59d68d42a14..63af6470aea 100644
--- a/contributors.yml
+++ b/contributors.yml
@@ -306,6 +306,7 @@
 - SufianBabri
 - supachaidev
 - tascord
+- tessellator
 - TheRealAstoo
 - therealflyingcoder
 - thomasheyenbrock
diff --git a/packages/remix-dev/__tests__/readConfig-test.ts b/packages/remix-dev/__tests__/readConfig-test.ts
index 6d7dc58b0c5..92af7767d63 100644
--- a/packages/remix-dev/__tests__/readConfig-test.ts
+++ b/packages/remix-dev/__tests__/readConfig-test.ts
@@ -52,4 +52,9 @@ describe("readConfig", () => {
     `
     );
   });
+
+  it("returns the same devServerPort value across reloads", async () => {
+    let newConfig = await readConfig(remixRoot);
+    expect(newConfig.devServerPort).toBe(config.devServerPort);
+  });
 });
diff --git a/packages/remix-dev/config.ts b/packages/remix-dev/config.ts
index 8f0cc2b9128..e5f99a23d20 100644
--- a/packages/remix-dev/config.ts
+++ b/packages/remix-dev/config.ts
@@ -8,6 +8,11 @@ import { defineConventionalRoutes } from "./config/routesConvention";
 import { ServerMode, isValidServerMode } from "./config/serverModes";
 import { serverBuildVirtualModule } from "./compiler/virtualModules";
 
+/* eslint-disable prefer-let/prefer-let */
+declare global {
+  var __devServerPort: number | undefined;
+}
+
 export interface RemixMdxConfig {
   rehypePlugins?: any[];
   remarkPlugins?: any[];
@@ -358,7 +363,10 @@ export async function readConfig(
       process.env.REMIX_DEV_SERVER_WS_PORT || 8002
     );
   }
-  let devServerPort = await getPort({ port: appConfig.devServerPort });
+  if (!global.__devServerPort) {
+    global.__devServerPort = await getPort({ port: appConfig.devServerPort });
+  }
+  let devServerPort = global.__devServerPort;
   // set env variable so un-bundled servers can use it
   process.env.REMIX_DEV_SERVER_WS_PORT = `${devServerPort}`;
   let devServerBroadcastDelay = appConfig.devServerBroadcastDelay || 0;