clarify conditions in normalized-asset-prefix helper + adjust types a…

…nd returned prefix in getSocketUrl

packages/next/src/client/components/react-dev-overlay/internal/helpers/get-socket-url.ts

@@ -11,16 +11,15 @@ function getSocketProtocol(assetPrefix: string): string {
   return protocol === 'http:' ? 'ws' : 'wss'
 }
 
-export function getSocketUrl(assetPrefix: string): string {
+export function getSocketUrl(assetPrefix: string | undefined): string {
   const { hostname, port } = window.location
-  const protocol = getSocketProtocol(assetPrefix)
+  const protocol = getSocketProtocol(assetPrefix || '')
   const prefix = normalizedAssetPrefix(assetPrefix)
 
-  let url = `${protocol}://${hostname}:${port}${prefix && prefix !== '' ? `/${prefix}` : ''}`
-
-  if (prefix.startsWith('http')) {
-    url = `${protocol}://${prefix.split('://', 2)[1]}`
+  // same check but on original assetPrefix value
+  if (assetPrefix?.replace(/^\/+/, '').startsWith('http')) {
+    return `${protocol}://${prefix}`
   }
 
-  return url
+  return `${protocol}://${hostname}:${port}${prefix}`
 }

packages/next/src/shared/lib/normalized-asset-prefix.ts

@@ -1,9 +1,16 @@
-export function normalizedAssetPrefix(assetPrefix: string): string {
-  const escapedAssetPrefix = assetPrefix.replace(/^\/+/, '')
+export function normalizedAssetPrefix(assetPrefix: string | undefined): string {
+  const escapedAssetPrefix = assetPrefix?.replace(/^\/+/, '') || false
 
-  if (escapedAssetPrefix.startsWith('http')) {
+  // assetPrefix as a url
+  if (escapedAssetPrefix && escapedAssetPrefix.startsWith('http')) {
     return escapedAssetPrefix.split('://', 2)[1]
   }
 
-  return `${escapedAssetPrefix ? `/${escapedAssetPrefix}` : ''}`
+  // assetPrefix is set to `undefined` or '/'
+  if (!escapedAssetPrefix || escapedAssetPrefix === '') {
+    return ''
+  }
+
+  // assetPrefix is a common path but escaped so let's add one leading slash
+  return `/${escapedAssetPrefix}`
 }