DEV: Fix livereload locally on https (#31776)

pmusaraj · CvX · web-flow · commit d62db42f116a · 2025-03-13T09:05:39.000-04:00
Previously, I was getting this error in the JS console:

```
livereload.js:2232 Mixed Content: The page at 'https://DOMAIN/' was
loaded over HTTPS, but attempted to connect to the insecure WebSocket
endpoint 'ws://DOMAIN:443/_lr/livereload'. This request has been blocked;
this endpoint must be available over WSS.
````

Adding a `https: true` option seems to fix the problem when running the
local server over an https proxy. (It'll be marked as `false` when the
protocol isn't https.)

This isn't just a warning, opening `/tests` is delayed about 10-20
seconds.

---------

Co-authored-by: Jarek Radosz &lt;jradosz@gmail.com&gt;
diff --git a/app/assets/javascripts/custom-proxy/index.js b/app/assets/javascripts/custom-proxy/index.js
@@ -98,7 +98,7 @@ function updateScriptReferences({
         // ember-cli-live-reload doesn't select ports correctly, so we use _lr/livereload directly
         // (important for cloud development environments like GitHub CodeSpaces)
         newElements.unshift(
-          `<script nonce="${nonce}">window.LiveReloadOptions = { "path": "_lr/livereload", "host": location.hostname, "port": location.port || (location.protocol === "https:" ? 443 : 80) }</script>`,
+          `<script nonce="${nonce}">window.LiveReloadOptions = { "path": "_lr/livereload", "host": location.hostname, "port": location.port || (location.protocol === "https:" ? 443 : 80), "https": location.protocol === "https:" }</script>`,
           `<script async src="/_lr/livereload.js" nonce="${nonce}"></script>`
         );
       }

Original file line number	Diff line number	Diff line change
`@@ -98,7 +98,7 @@ function updateScriptReferences({`
`98`	`98`	`// ember-cli-live-reload doesn't select ports correctly, so we use _lr/livereload directly`
`99`	`99`	`// (important for cloud development environments like GitHub CodeSpaces)`
`100`	`100`	`newElements.unshift(`
`101`		- `<script nonce="${nonce}">window.LiveReloadOptions = { "path": "_lr/livereload", "host": location.hostname, "port": location.port \|\| (location.protocol === "https:" ? 443 : 80) }</script>`,
	`101`	+ `<script nonce="${nonce}">window.LiveReloadOptions = { "path": "_lr/livereload", "host": location.hostname, "port": location.port \|\| (location.protocol === "https:" ? 443 : 80), "https": location.protocol === "https:" }</script>`,
`102`	`102`	`<script async src="/_lr/livereload.js" nonce="${nonce}"></script>`
`103`	`103`	`);`
`104`	`104`	`}`