CSP blocks inline styles: admin panel renders unlocked, theme swatches stripped (regression from #84) #116

Closed
opened 2026-09-10 02:16:01 +00:00 by fen · 1 comment
Collaborator

Regression from #84 (CSP header): the Content-Security-Policy default-src 'self' (no style-src) BLOCKS all inline style attributes, including the page's own.

Reproduced in headless Chromium on the dev server - console shows:
Applying inline style violates the following Content Security Policy directive 'default-src 'self'' ... style attributes ... The action has been blocked. (admin page, lines 40/44)

Visible consequences:

  1. /admin: the settings panel's style="display:none" is stripped by CSP, so the full settings form renders WITHOUT unlocking - defeats #99 and the #113 lock redesign.
  2. /settings: theme swatch spans are built with inline style="background:..." - blocked, contributing to the broken theme grid (alongside the t.colors bug fixed by #114).

Fix: add style-src 'self' 'unsafe-inline' to the CSP header (keep script-src tight). The app legitimately uses inline style attributes for dynamic theming; hashes/nonces are impractical for runtime-generated style attributes. Then verify in a real browser: /admin shows ONLY the lock on fresh load, /settings theme cards render with colored swatches, and the CSP header contains style-src.

Regression from #84 (CSP header): the Content-Security-Policy `default-src 'self'` (no style-src) BLOCKS all inline style attributes, including the page's own. Reproduced in headless Chromium on the dev server - console shows: `Applying inline style violates the following Content Security Policy directive 'default-src 'self'' ... style attributes ... The action has been blocked.` (admin page, lines 40/44) Visible consequences: 1. /admin: the settings panel's `style="display:none"` is stripped by CSP, so the full settings form renders WITHOUT unlocking - defeats #99 and the #113 lock redesign. 2. /settings: theme swatch spans are built with inline `style="background:..."` - blocked, contributing to the broken theme grid (alongside the t.colors bug fixed by #114). Fix: add `style-src 'self' 'unsafe-inline'` to the CSP header (keep script-src tight). The app legitimately uses inline style attributes for dynamic theming; hashes/nonces are impractical for runtime-generated style attributes. Then verify in a real browser: /admin shows ONLY the lock on fresh load, /settings theme cards render with colored swatches, and the CSP header contains style-src.
fen added the In Progress label 2026-09-10 02:17:41 +00:00
fen added spent time 30 seconds 2026-09-10 02:17:47 +00:00
fen added QA and removed In Progress labels 2026-09-10 02:19:00 +00:00
fen added spent time 30 minutes 2026-09-10 02:19:56 +00:00
fen closed this issue 2026-09-10 02:20:53 +00:00
Author
Collaborator

QA passed (independent verification, headless Chromium + local build + live palette-dev):

  • PR #117 diff touches only the CSP header string (+ its test). go vet clean, go test all green on fix-116-csp-inline-styles (073d39c).
  • Local render: 0 CSP violations on /admin and /settings; admin-panel renders with style="display:none"; 5 theme-card elements on /settings.
  • Merged to dev (aca99bc), CI test+docker green, palette-dev redeployed (rollout successful).
  • Live https://palette-dev.archfox.org: CSP header includes style-src 'self' 'unsafe-inline'; 0 violations on /admin and /settings; admin-panel display:none present; 5 theme-cards. Issue resolved.
QA passed (independent verification, headless Chromium + local build + live palette-dev): - PR #117 diff touches only the CSP header string (+ its test). go vet clean, go test all green on fix-116-csp-inline-styles (073d39c). - Local render: 0 CSP violations on /admin and /settings; admin-panel renders with style="display:none"; 5 theme-card elements on /settings. - Merged to dev (aca99bc), CI test+docker green, palette-dev redeployed (rollout successful). - Live https://palette-dev.archfox.org: CSP header includes style-src 'self' 'unsafe-inline'; 0 violations on /admin and /settings; admin-panel display:none present; 5 theme-cards. Issue resolved.
Sign in to join this conversation.
1 Participants
Notifications
Total Time Spent: 30 minutes
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: poslop/palette#116