Search code examples
ruststyled-componentstauricss-in-js

What is the correct way to configure CSP in Tauri when using CSS-in-JS libraries?

In the release build, Tauri does not render anything. After a bit of Googling, I found the same issue, but I am still confused about the right CSP configuration to set when using CSS-in-JS libraries like styled-components.

Right now, this is my CSP: "csp": "default-src 'self'"

Error: enter image description here

Solution

  • Okay, I finally ended up with this configuration in the tauri.conf.json file. Is this the right way to do it? I don't know. I'm leaving my answer here so people who come here may find this useful.

      "security": {
      "dangerousDisableAssetCspModification": ["style-src"],
      "csp": "default-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' asset:"
    }

    EDIT:

    Based on my own experience, I've never seen an attack that leveraged the injection of CSS to cause harm. - https://scotthelme.co.uk/can-you-get-pwned-with-css/

    I guess "unsafe-inline" is okay.

    Related: https://github.com/tauri-apps/tauri/discussions/8578