Use relative URLs to resolve custom resources (#7705)

panel/custom.py

@@ -355,7 +355,8 @@ def _render_esm(cls, compiled: bool | Literal['compiling'] = True, server: bool
         esm_path = cls._esm_path(compiled=compiled is True)
         if esm_path:
             if esm_path == cls._bundle_path and cls.__module__ in sys.modules and server:
-                esm = cls._component_resource_path(esm_path, compiled)
+                # Generate relative path to handle apps served on subpaths
+                esm = (state.rel_path or './') + cls._component_resource_path(esm_path, compiled)
                 if config.autoreload:
                     modified = hashlib.sha256(str(esm_path.stat().st_mtime).encode('utf-8')).hexdigest()
                     esm += f'?{modified}'

panel/models/reactive_esm.ts

@@ -650,12 +650,7 @@ export class ReactiveESM extends HTMLBox {
       }
       let url
       if (this.bundle === "url") {
-        const parts = location.pathname.split("/")
-        let path = parts.slice(0, parts.length-1).join("/")
-        if (path.length) {
-          path += "/"
-        }
-        url = `${location.origin}/${path}${this.esm}`
+        url = this.esm
       } else {
         url = URL.createObjectURL(new Blob([this.compiled], {type: "text/javascript"}))
       }