My ruby on rails app's CSP was working perfectly until I added webpacker. Now I get this:
Content Security Policy: The page’s settings observed the loading of a resource at inline (“style-src”). A CSP report is being sent. injectStylesIntoStyleTag.js:117
Content Security Policy: The page’s settings observed the loading of a resource at inline (“style-src”). A CSP report is being sent. injectStylesIntoStyleTag.js:190
The code in question looks like this:
function insertStyleElement(options) {
var style = document.createElement('style');
...
if (typeof options.insert === 'function') {
options.insert(style);
} else {
var target = getTarget(options.insert || 'head');
if (!target) {
throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");
}
target.appendChild(style); //LINE 117//
}
return style;
}
And:
function applyToTag(style, options, obj) {
var css = obj.css;
...
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
while (style.firstChild) {
style.removeChild(style.firstChild);
}
style.appendChild(document.createTextNode(css)); //LINE 190//
}
}
How do I add a nonce? This says to add __webpack_nonce__ = 'random'; to my entry file ( in this case app/javascript/packs/application.js), yet adding that nonce to my csp file has no effect on the style-src violation. Which in this case, looks like this: config.style_src :self, 'https://fonts.googleapis.com', 'nonce-random'