rrweb: Regression: support for strict CSP broken by style mutation
The optimization in PR https://github.com/rrweb-io/rrweb/pull/464 broke support for users who run a strict Content-Security-Policy (CSP).
Specifically, this line sets the style attribute on a DOM node and will be blocked without style-src: 'unsafe-inline' (which is the unsafe CSP).
For any apps that pull in the affected versions and have a strict CSP, this issue will generate a very large numbers of errors like the one below (one for each time that line of code runs). As a possible side effect, any error reporting services or report-url endpoints may be quickly overwhelmed with error reports.
About this issue
- Original URL
- State: open
- Created 2 years ago
- Reactions: 1
- Comments: 30 (15 by maintainers)
Commits related to this issue
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to statcounter/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to statcounter/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to statcounter/rrweb by eoghanmurray 2 years ago
- Fix for rrweb-io#816 - avoid triggering a CSP (content security policy) error with setAttribute('style') — committed to Analyzee/rrweb by AntonioStipic a year ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to eoghanmurray/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to eoghanmurray/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to eoghanmurray/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to eoghanmurray/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to statcounter/rrweb by eoghanmurray 2 years ago
- Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` — committed to statcounter/rrweb by eoghanmurray 2 years ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to rrweb-io/rrweb by eoghanmurray a year ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to eoghanmurray/rrweb by eoghanmurray a year ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to eoghanmurray/rrweb by eoghanmurray a year ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to eoghanmurray/rrweb by eoghanmurray a year ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to eoghanmurray/rrweb by eoghanmurray a year ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to eoghanmurray/rrweb by eoghanmurray a year ago
- Avoid triggering a CSP (content security policy) error (#846) * Fix for #816 - avoid triggering a CSP (content security policy) error with `.setAttribute('style')` * The bare unattachedDoc that I ... — committed to eoghanmurray/rrweb by eoghanmurray a year ago
Our test suite was able to validate that it didn’t work — I’ve added some commits today to make it actually work so #846 might be able to land in trunk soon.
Sure. Just some more context on how I discovered the issue. I recently updated our app to MUI v5 which is supposed to have strict CSP compatibility now (since they switched to emotion / styled-components and no longer use CSS in JS). I enabled the strict CSP headers and tested the site in staging where we are NOT running rrweb and saw no errors. When moved to prod where recording is enabled, I saw the CSP errors triggered by the referenced mutation line from rrweb.
I actually would expect the app’s attribute updates to trigger CSP but there must be a reason they are allowed.
Here is one of the things triggering a modification that gets picked up by the rrweb mutation.