fix(BA-632): Fix Broken CSS by allowing unsafe-inline CSP (#3572)

Backported-from: main (25.1)
Backported-to: 24.09
Backport-of: 3572

changes/3572.fix.md

@@ -0,0 +1 @@
+Fix Broken CSS by allowing `unsafe-inline` content security policy.

src/ai/backend/web/security.py

@@ -70,7 +70,7 @@ def reject_access_for_unsafe_file_policy(request: web.Request) -> None:
 
 def add_self_content_security_policy(response: web.StreamResponse) -> web.StreamResponse:
     response.headers["Content-Security-Policy"] = (
-        "default-src 'self'; frame-ancestors 'none'; form-action 'self';"
+        "default-src 'self'; style-src 'self' 'unsafe-inline'; frame-ancestors 'none'; form-action 'self';"
     )
     return response
 

tests/webserver/test_security_policy.py

@@ -41,7 +41,7 @@ async def test_default_security_policy_response(default_app, async_handler) -> N
     response = await security_policy_middleware(request, async_handler)
     assert (
         response.headers["Content-Security-Policy"]
-        == "default-src 'self'; frame-ancestors 'none'; form-action 'self';"
+        == "default-src 'self'; style-src 'self' 'unsafe-inline'; frame-ancestors 'none'; form-action 'self';"
     )
     assert response.headers["X-Content-Type-Options"] == "nosniff"
 
@@ -100,7 +100,7 @@ async def test_add_self_content_security_policy(async_handler) -> None:
     response = await security_policy_middleware(request, async_handler)
     assert (
         response.headers["Content-Security-Policy"]
-        == "default-src 'self'; frame-ancestors 'none'; form-action 'self';"
+        == "default-src 'self'; style-src 'self' 'unsafe-inline'; frame-ancestors 'none'; form-action 'self';"
     )