From bcc55e9e85f3eb3e6c047246421e7c4c42187a02 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Wed, 3 Nov 2021 23:41:55 -0500
Subject: [PATCH] Webpack: refactor devserver env

---
 webpack/development.js | 34 ++++++++++++++++++++++++++--------
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/webpack/development.js b/webpack/development.js
index be74a3650..9beb0cf5a 100644
--- a/webpack/development.js
+++ b/webpack/development.js
@@ -7,9 +7,17 @@ const sharedConfig = require('./shared');
 
 const watchOptions = {};
 
-const backendUrl  = process.env.BACKEND_URL || 'http://localhost:4000';
-const patronUrl  = process.env.PATRON_URL || 'http://localhost:3037';
-const secureProxy = !(process.env.PROXY_HTTPS_INSECURE === 'true');
+const {
+  DEVSERVER_URL,
+  BACKEND_URL,
+  PATRON_URL,
+  PROXY_HTTPS_INSECURE,
+} = process.env;
+
+const DEFAULTS = {
+  DEVSERVER_URL: 'http://localhost:3036',
+  PATRON_URL: 'http://localhost:3037',
+};
 
 const { FE_SUBDIRECTORY } = require(join(__dirname, '..', 'app', 'soapbox', 'build_config'));
 
@@ -28,15 +36,17 @@ const backendEndpoints = [
 ];
 
 const makeProxyConfig = () => {
+  const secureProxy = PROXY_HTTPS_INSECURE !== 'true';
+
   const proxyConfig = {};
   proxyConfig['/api/patron'] = {
-    target: patronUrl,
+    target: PATRON_URL || DEFAULTS.PATRON_URL,
     secure: secureProxy,
     changeOrigin: true,
   };
   backendEndpoints.map(endpoint => {
     proxyConfig[endpoint] = {
-      target: backendUrl,
+      target: BACKEND_URL || DEFAULTS.BACKEND_URL,
       secure: secureProxy,
       changeOrigin: true,
     };
@@ -51,6 +61,14 @@ if (process.env.VAGRANT) {
   watchOptions.poll = 1000;
 }
 
+const devServerUrl = (() => {
+  try {
+    return new URL(DEVSERVER_URL);
+  } catch {
+    return new URL(DEFAULTS.DEVSERVER_URL);
+  }
+})();
+
 module.exports = merge(sharedConfig, {
   mode: 'development',
   cache: true,
@@ -73,9 +91,9 @@ module.exports = merge(sharedConfig, {
 
   devServer: {
     compress: true,
-    host: 'localhost',
-    port: 3036,
-    https: false,
+    host: devServerUrl.hostname,
+    port: devServerUrl.port,
+    https: devServerUrl.protocol === 'https:',
     hot: false,
     allowedHosts: 'all',
     historyApiFallback: {