Support TrustedTypes / Sanitization

[raphael-inglin-ergon]

Hi

For our app, we require trusted types via our CSP policy (https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types). Ngx-Editor currently has a few direct assignments to innerHtml without sanitization or trustedTypes, which violates our policy.

I would like to add an optional flag to turn on sanitization (via DOMPurify) for these assignments while keeping the current behavior if not active. This would allow me to use the "dompurify" trusted types and satisfy the policy.

I'd be happy to provide a PR. Any objections or ideas?

[sibiraj-s]

I'd be happy to provide a PR. Any objections or ideas?

Hi, can you share some ideas here on how you would like to implement it? before raise a PR, typically we don't handle html, prosemirror does don't want to to drag by directly jumping into the PR.

you can explore the code and let me know if you still think the implementation is possible?

[raphael-inglin-ergon]

I took the liberty to create a small PR: #481 . I hope it aligns more or less with what you had in mind. Otherwise please let me know.

[sibiraj-s]

Thanks. I'll check that out. it is still a breaking change correct?

[raphael-inglin-ergon]

It should not be a breaking change unless I missed something somewhere. No changes are made to the incoming data, it only extends the existing code to accept TrustedHTML values and handle them correctly. If strings are passed, they should be handled exactly like before.

[sibiraj-s]

Ah got it. I didn't yet check the PR. I'll check shortly. Thanks for the explanation

[sibiraj-s]

Merged the PR. Will release soon. Thanks

[vonox7]

Fyi, to use trusted types in ngx-editor, the Content-Security-Policy header must have trusted-types angular#unsafe-bypass.

With only trusted-types angular you would get the following errors:

language.service.ts:267 Refused to create a TrustedTypePolicy named 'angular#unsafe-bypass' because it violates the following Content Security Policy directive: "trusted-types angular 'allow-duplicates'".

This document requires 'TrustedHTML' assignment.Understand this errorAI
language.service.ts:267 TypeError: Failed to set the 'innerHTML' property on 'Element': This document requires 'TrustedHTML' assignment.
    at EmulatedEncapsulationDomRenderer2.setProperty (platform-browser.mjs:645:17)
    at BaseAnimationRenderer.setProperty (browser.mjs:4632:27)
    at elementPropertyInternal (core.mjs:11711:18)
    at ɵɵproperty (core.mjs:21289:9)
    at ToggleCommandComponent_Template (ngx-editor.mjs:1342:408)
    at executeTemplate (core.mjs:11268:9)
    at refreshView (core.mjs:12791:13)
    at detectChangesInView$1 (core.mjs:13015:9)
    at detectChangesInViewIfAttached (core.mjs:12978:5)
    at detectChangesInComponent (core.mjs:12967:5)