-
-
Notifications
You must be signed in to change notification settings - Fork 6.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Vite breaks when using require-trusted-types-for
CSP in dev
#10553
Comments
I think we still can't make it work with vite/packages/vite/src/client/overlay.ts Line 142 in 57916a4
That said, I created a PR as I don't find a reason to use |
There is still the line that @sapphi-red pointed out above. |
I think what can fix this is using sanitized input internally, rather than setting it with innerHTML. |
This could be fixed by using this.root.innerHTML = DOMPurify.sanitize(template, {RETURN_TRUSTED_TYPE: true}); the cost would be to add an extra dependency DOMPurify (which is probably the most known JS lib for XSS sanitizing). The proposed code change is what I use in my own projects to get over |
Describe the bug
I'm setting up CSP for my site, and I'd like to keep mostly the same rules in dev as I do in prod, to catch potential errors early before deploying.
I turned on
require-trusted-types-for 'script'
, which prevents using.innerHTML = <string>
(https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/require-trusted-types-for). But, this breaks vite, which usesinnerHTML
inside updateStyle.Reproduction
https:/IanVS/vite-csp-require-trusted-types-for-reproduction
Steps to reproduce
Clone the repo above,
npm install
,npm run dev
, and view the error in the console.System Info
Used Package Manager
npm
Logs
No response
Validations
The text was updated successfully, but these errors were encountered: