sphinx-agent: Pick websocket scheme based on window location

Author: alcarney

lib/esbonio/changes/896.fix.md

@@ -0,0 +1 @@
+The websocket connection uri used by the preview should now correctly pick between `ws://` and `wss://` based on the window's origin

lib/esbonio/esbonio/sphinx_agent/static/webview.js

@@ -216,13 +216,14 @@ function renderLineMarkers() {
     document.body.append(markerStyle)
 }
 
-const host = window.location.hostname;
 const queryString = window.location.search;
 const queryParams = new URLSearchParams(queryString);
-const ws = parseInt(queryParams.get("ws"));
 const showMarkers = queryParams.has("show-markers")
 
-const wsServer = `ws://${host}:${ws}`
+const wsScheme = (window.location.protocol === 'https:') ? 'wss' : 'ws'
+const wsHost = window.location.hostname;
+const wsPort = parseInt(queryParams.get("ws"));
+const wsServer = `${wsScheme}://${wsHost}:${wsPort}`
 console.debug(`Connecting to '${wsServer}'...`)
 
 const socket = new WebSocket(wsServer);
@@ -242,7 +243,7 @@ const handlers = {
         console.debug("Reloading page...")
         window.location.reload()
     },
-    "view/scroll": (params) => {scrollViewTo(params.uri, params.line)}
+    "view/scroll": (params) => { scrollViewTo(params.uri, params.line) }
 }
 
 function handle(message) {
@@ -291,7 +292,7 @@ function main() {
         renderLineMarkers()
     }
 
-    rewriteInternalLinks(ws)
+    rewriteInternalLinks(wsPort)
 
     // Are we in an <iframe>?
     if (window.parent !== window.top) {