🐞 Bug Summary
The admin UI loads the standard Alpine.js CDN build (admin.html:286–291), which evaluates template expressions via Function() at runtime. This requires 'unsafe-eval' in script-src. Any effort to remove 'unsafe-eval' from the Content Security Policy will silently break all Alpine directives (x-data, x-show, x-bind, @click, etc.) across the admin panel.
🧩 Affected Component
Select the area of the project impacted:
🔁 Steps to Reproduce
- Deploy the admin UI with a CSP that omits 'unsafe-eval' from
script-src
- Open the admin panel in a browser
- Open the browser console
🤔 Expected Behaviour
Alpine directives render and respond to interaction normally under a strict CSP.
📓 Logs / Error Output
Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src ...".
All x-data components, x-show toggles, @click handlers, and x-for loops fail silently.
🧩 Additional Context
Root cause: The standard Alpine.js build (alpinejs on npm / jsDelivr CDN) compiles expressions at runtime using new Function(). The CSP build (@alpinejs/csp) ships pre-compiled expression evaluators and does not require 'unsafe-eval'.
Affected scope: All 20 admin templates using Alpine directives (~228 directive usages), including observability views, tool cards, overflow menus, and the dark-mode toggle.
Two viable paths:
- Switch to
@alpinejs/csp — replace the CDN script tag and npm dependency with @alpinejs/csp. The CSP build is API-compatible but requires that complex expressions (ternaries, method calls) be moved into x-data object definitions rather than inline attribute strings. Some directives in the current templates may need light refactoring.
- Bundle Alpine into the Vite output — import Alpine in
mcpgateway/admin_ui/index.js, remove it from the external array in vite.config.js, and drop the CDN script tag. If using the standard build, this does not remove the 'unsafe-eval' requirement; it must be combined with option 1 to be effective.
Related: The admin bundle already excludes Alpine as an external global (window.Alpine). The alpinejs npm package is pinned at 3.15.11 in package-lock.json.
Related: PR #4424 (CSP hardening) identified this gap — the policy introduced there cannot be fully enforced until these handlers are migrated.
🐞 Bug Summary
The admin UI loads the standard Alpine.js CDN build (admin.html:286–291), which evaluates template expressions via
Function()at runtime. This requires 'unsafe-eval' inscript-src. Any effort to remove 'unsafe-eval' from the Content Security Policy will silently break all Alpine directives (x-data, x-show, x-bind, @click, etc.) across the admin panel.🧩 Affected Component
Select the area of the project impacted:
mcpgateway- APImcpgateway- UI (admin panel)mcpgateway.wrapper- stdio wrapper🔁 Steps to Reproduce
script-src🤔 Expected Behaviour
Alpine directives render and respond to interaction normally under a strict CSP.
📓 Logs / Error Output
Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src ...".
All
x-datacomponents,x-showtoggles,@clickhandlers, andx-forloops fail silently.🧩 Additional Context
Root cause: The standard Alpine.js build (alpinejs on npm / jsDelivr CDN) compiles expressions at runtime using new Function(). The CSP build (@alpinejs/csp) ships pre-compiled expression evaluators and does not require 'unsafe-eval'.
Affected scope: All 20 admin templates using Alpine directives (~228 directive usages), including observability views, tool cards, overflow menus, and the dark-mode toggle.
Two viable paths:
@alpinejs/csp— replace the CDN script tag and npm dependency with@alpinejs/csp. The CSP build is API-compatible but requires that complex expressions (ternaries, method calls) be moved intox-dataobject definitions rather than inline attribute strings. Some directives in the current templates may need light refactoring.mcpgateway/admin_ui/index.js, remove it from the external array invite.config.js, and drop the CDN script tag. If using the standard build, this does not remove the'unsafe-eval'requirement; it must be combined with option 1 to be effective.Related: The admin bundle already excludes Alpine as an external global (
window.Alpine). Thealpinejsnpm package is pinned at3.15.11inpackage-lock.json.Related: PR #4424 (CSP hardening) identified this gap — the policy introduced there cannot be fully enforced until these handlers are migrated.