CSP Error on browser console and how to fix it

[AlbertPMarti]

Hi, I'm working on a new web app with a strict CSP required. On lines 513, 532 of tarteaucitron.js there are some dynamic CSS Rules added that trigger errors on browser (they have TODO comments in order to add them to the CSS file).
I've managed to solve it by adding this on backend PHP code:

"style-src-elem 'nonce-" . $nonce . "' 'self' 'sha256-fsYXbbdxpSYs34GT6F5tr23KpZf1q65FBknssNyLnLo=' ;"

This hash corresponds to line 521: document.getElementsByTagName('head')[0].appendChild(customThemeMiddle);, or the CSS that it appends (declared as cssRuleMiddle on line 513).
I've only tried this solution with script 'middle' theme, as it's the one I use.

Edit: I forgot to mention that I've also added integrity="sha256-45jaHcWwlrBC9cPaZo6INU6AgU8m7O6fO0RDY6VFomg=" on HTML <script> tag, like this: <script nonce="…" src="scripts/tarteaucitron/tarteaucitron.js" integrity="sha256-45jaHcWwlrBC9cPaZo6INU6AgU8m7O6fO0RDY6VFomg=" crossorigin="anonymous"></script>

I hope this hack will help some of you out there who need to work with strict CSP rules, or maybe I'm wrong and there's a simpler, or better, way to solve it :)
BTW, I don't know if this is the right place to comment this issue.

Salut à toi Amauri et merci pour ton superb travail.

[AmauriC]

The better way is to put the CSS on the .css file 😄
I take care of this quickly.