Skip to content

Turbo Improvement Request: Support for CSP Nonces with Dynamically Applied Styles #729

Open
@danielavdh

Description

@danielavdh

Issue Description

When using Turbo with a Content Security Policy that requires nonces for inline styles, I'm encountering CSP violations. Turbo appears to be dynamically applying inline styles without the required nonce attribute, causing browsers to block these styles.

Error Message

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' https: 'nonce-4991a22ea38a43bc86c26623d6c36944'". Either the 'unsafe-inline' keyword, a hash ('sha256-qnVkQSG7pWu17hBhIw0kCpfEB3XGvt0mNRa6+uM6OUU='), or a nonce ('nonce-...') is required to enable inline execution.

Context

I'm using Rails 8 with a properly configured Content Security Policy that requires nonces for inline styles. This is a recommended security practice, but it conflicts with how Turbo currently applies styles.

The error occurs with standard Turbo functionality, such as when using data attributes for confirmation dialogs:

<%= link_to "Delete", document, 
    data: { 
      turbo: true,
      turbo_method: :delete,
      turbo_confirm: "Are you sure?" 
    }, 
    class: "backend_link" %>

Suggested Improvements

I'd like to suggest one or more of the following improvements:

  1. Add nonce support: Have Turbo read the CSP nonce from the document (perhaps from a meta tag) and apply it to any dynamically generated style elements.

  2. Use class-based styling: Instead of inline styles, Turbo could apply predefined classes that are included in the application's stylesheets.

  3. Configuration option: Provide a configuration setting to choose between inline styles (current behavior) or class-based styling for better CSP compatibility.

Impact

Implementing this improvement would allow developers to maintain strong security policies with Content Security Policy while still benefiting from Turbo's features. It would eliminate the need to choose between security (strict CSP) and functionality (Turbo features).

Additional Information

  • Turbo version: 2.0.13
  • Rails version: 8.0.2
  • Browser: Chrome 124

Thank you for considering this improvement!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions