Understand CSP for style and ensure it doesnt break while developing

[dennyabrain]

We had a CSP entry for style-src that looked like this

style-src https://fonts.googleapis.com 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU=' 'sha256-o7bYsu5iNiTxIObyslerFNZrDfkROYhElKhuOItXvVk=' 'sha256-ymN5q6v7MB6PygHnN3N59Z0O74H6pvF05DOnMn25Xvg='; 

I have noticed that whenever we make changes or add new features to the plugin, the UI for the plugin breaks. I am guessing because whatever that sha is supposed to denote changes when you modify the source code of the plugin. We were defaulting to completely removing CSP during development, which is of course non ideal.

To be able to proceed for now, we've updated the csp to contain this style-src https://fonts.googleapis.com 'self' 'unsafe-inline

I would like us to understand and document how CSP for style works. And what we can do to ensure we stay secure without breaking the plugin UI as new features are added.