From c7e0bfbff4c9f1474e4b13128806b6789e1f163c Mon Sep 17 00:00:00 2001
From: nkomonen-amazon <nkomonen@amazon.com>
Date: Mon, 10 Feb 2025 21:52:16 -0500
Subject: [PATCH] fix(build): webviews sometimes did not load during
 development

Problem:

In our development build we spawn a webpack server that serves the Vue files
used by our webviews. It is served on port 8080, but sometimes an existing
process is already using it, and this causes the webpack server to use the next
available port. But because we assume it will use 8080 it silently breaks.

Solution:

Explicitly require 8080 in the webpack server cli command, also create a custom
script to catch the error early and explain how to resolve it.

Signed-off-by: nkomonen-amazon <nkomonen@amazon.com>
---
 packages/amazonq/.vscode/tasks.json           |  3 +-
 packages/core/package.json                    |  2 +-
 .../core/scripts/build/checkServerPort.ts     | 57 +++++++++++++++++++
 3 files changed, 60 insertions(+), 2 deletions(-)
 create mode 100644 packages/core/scripts/build/checkServerPort.ts

diff --git a/packages/amazonq/.vscode/tasks.json b/packages/amazonq/.vscode/tasks.json
index 9fefd8ec182..5e675fe4395 100644
--- a/packages/amazonq/.vscode/tasks.json
+++ b/packages/amazonq/.vscode/tasks.json
@@ -44,7 +44,8 @@
             "problemMatcher": "$ts-webpack-watch",
             "options": {
                 "cwd": "${workspaceFolder}/../../packages/core"
-            }
+            },
+            "presentation": { "panel": "dedicated" }
         },
         {
             "label": "terminate",
diff --git a/packages/core/package.json b/packages/core/package.json
index d9f19bad5f7..c0494bb790e 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -424,7 +424,7 @@
         "compileOnly": "tsc -p ./",
         "compileDev": "npm run compile -- --mode development",
         "webpackDev": "webpack --mode development",
-        "serveVue": "webpack serve --config-name vue --mode development",
+        "serveVue": "ts-node ./scripts/build/checkServerPort.ts && webpack serve --port 8080 --config-name vue --mode development",
         "watch": "npm run clean && npm run buildScripts && npm run compileOnly -- --watch",
         "lint": "ts-node ./scripts/lint/testLint.ts",
         "generateClients": "ts-node ./scripts/build/generateServiceClient.ts ",
diff --git a/packages/core/scripts/build/checkServerPort.ts b/packages/core/scripts/build/checkServerPort.ts
new file mode 100644
index 00000000000..4128504bd70
--- /dev/null
+++ b/packages/core/scripts/build/checkServerPort.ts
@@ -0,0 +1,57 @@
+/*!
+ * Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * Validate that the required port used by webviews during development is not being used.
+ */
+
+import * as net from 'net'
+
+/** This must be kept up to date with the port that is being used to serve the vue files. */
+const portNumber = 8080
+
+function checkPort(port: number): Promise<boolean> {
+    return new Promise((resolve) => {
+        const server = net.createServer()
+
+        server.once('error', (err) => {
+            if ((err as NodeJS.ErrnoException).code === 'EADDRINUSE') {
+                resolve(true)
+            }
+        })
+
+        server.once('listening', () => {
+            server.close()
+            resolve(false)
+        })
+
+        server.listen(port)
+    })
+}
+
+async function main() {
+    try {
+        const isPortInUse = await checkPort(portNumber)
+
+        if (isPortInUse) {
+            console.error(`
+    @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
+
+    ERROR: Webviews will not load as expected, meaning Q may not work.
+    REASON: Port ${portNumber} is already in use, preventing the latest webview files from being served.
+    SOLUTION: Kill the current process using port ${portNumber}.
+              - Unix: "kill -9 $(lsof -t -i :${portNumber})"
+
+    @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
+    `)
+            process.exit(1)
+        }
+    } catch (error) {
+        console.error('Error checking port:', error)
+        process.exit(1)
+    }
+}
+
+void main()