asked on September 28, 2023
My project uses Content-Security-Policies (CSP) for extra security.
One policy which is set is the following: `require-trusted-types-for 'script'`
As a result, the Flexmonster component stays empty and cannot display anything.
The error-message in the browser-console is
"ERROR TypeError: Failed to execute 'parseFromString' on 'DOMParser': This document requires 'TrustedHTML' assignment."
Apparently, Flexmonster parses strings as HTML without using the "newish" TrustedHTML feature. See https://developer.mozilla.org/en-US/docs/Web/API/TrustedHTML for details.
Is there any chance that the use of TrustedHTML will be added soon?
⋅ September 28, 2023
Hello, Florian!
Thank you for reaching out to us.
We have passed the described issue to our Development team to research possible solutions for this case. We will get back to you with the research results with the ETA October 16th.
Our team will notify you about any updates on the matter.
Do not hesitate to contact us in case of any other questions.
Kind regards,
Solomiia
⋅ October 17, 2023
Hello, Florian!
Hope you are doing well.
Our team is glad to inform you that compatibility with Content Security Policy (CSP) was improved.
The mentioned improvements are included in the 2.9.62 version of Flexmonster: https://www.flexmonster.com/release-notes/version-2-9-62/.
You are welcome to update the component: https://www.flexmonster.com/doc/updating-to-the-latest-version/.
Please let us know if everything works well after the update.
Looking forward to hearing from you.
Kind regards,
Solomiia
⋅ October 17, 2023
Hi Solomiia
Thanks a lot for the update :-). This is very helpful.
If I understand correctly, I need to then allow the following two security-policies: "xml" and "fmHtmlPolicy".
When adding them, I am getting one more error-message: "Refused to create a TrustedTypePolicy named 'fmHtmlPolicy' because a policy with that name already exists and the Content Security Policy directive does not 'allow-duplicates'."
Could it be that the library is trying to create the same policy twice, by accident?
(my version is "ngx-flexmonster": "^2.9.62")
Apart from that, it seems to be working fine.
Kind regards,
Florian
⋅ October 18, 2023
Hello, Florian!
Thank you for your swift response.
We are glad to hear the update works well for you.
Could you please provide us with all the policies used in your project? With this information, we'll be able to continue the research and test Flexomnster's behavior with all necessary policies on our side.
Looking forward to hearing from you.
Kind regards,
Solomiia
⋅ October 18, 2023
Hello Solomiia
Thank you very much.
The original content of the the CSP header is as follows:
```
default-src 'self' ws:; style-src 'self' 'unsafe-inline'; img-src 'self' data:; script-src 'self'; object-src 'none'; trusted-types angular dompurify webpack-dev-server#overlay; require-trusted-types-for 'script'
```
To make flexmonster work in my tests, I had to change it to the following:
```
default-src 'self' ws:; style-src 'self' 'unsafe-inline'; img-src 'self' data:; script-src 'self'; object-src 'none'; trusted-types angular dompurify xml fmHtmlPolicy webpack-dev-server#overlay 'allow-duplicates'; require-trusted-types-for 'script'
```
There are 3 changes between the two
Thanks again for your great work and kind support.
Kind regards,
Florian
⋅ October 18, 2023
Hello, Florian!
Thank you for the provided details about your case.
Our Development team will assign a more descriptive name to the "xml" policy and eliminate the duplicates.
We'll get back to you with the update with the ETA October 30th.
Feel free to contact us in case of any other questions.
Kind regards,
Solomiia
⋅ October 31, 2023
Hello, Florian!
Hope you are having a great week.
Our team is happy to inform you that we have updated the support of the Content Security Policy. Now, there is a single 'flexmonster' policy.
The described fix is included in the 2.9.63 version of Flexmonster: https://www.flexmonster.com/release-notes/version-2-9-63/.
You are welcome to update the component: https://www.flexmonster.com/doc/updating-to-the-latest-version/.
We also want to mention some limitations while working with the CSP - we are using a couple of 3rd party libraries, for example, for exporting. While we can add support of CSP to Flexmonster, we can't impact other products. You can find the full list of such dependencies here: https://www.flexmonster.com/faq/#flexmonster-dependencies.
Please let us know if the fix works well for you.
Kind regards,
Solomiia
⋅ October 31, 2023
Hi Solomiia
Thank you very much for the good news.
And thank you very much for that change. It does indeed work very well for us.
Kind regards,
Florian
⋅ November 1, 2023
Hello, Florian!
Thank you for your feedback.
We are glad to hear that our fix was helpful.
Do not hesitate to contact us in case of any other questions.
Kind regards,
Solomiia
