Content Security Policy interaction with Forms

Hi bensom0,

The issue you are facing is likely caused by the fact that the Forms iframe is attempting to load resources that are not explicitly allowed by the Content Security Policy (CSP). The CSP is a security feature that helps to protect your website from malicious code by restricting the types of resources that can be loaded.

When you declare the CSP through the frame-src tag, you are explicitly allowing the Forms iframe to load resources from the Forms domain. However, once the site triggers the media query for the mobile version, the Forms iframe may attempt to load resources from other domains, such as the Microsoft Office domain. If these domains are not explicitly allowed in the CSP, then the Forms iframe will not be able to load the resources and will not be displayed properly.

To fix this issue, you need to explicitly allow the Forms iframe to load resources from all of the domains that it needs to access. You can do this by adding the following domains to the frame-src tag in your CSP:

frame-src https://*.microsoft.com https://*.forms.office.com

This will allow the Forms iframe to load resources from all of the domains that it needs to access, regardless of whether the site is in desktop or mobile mode.

Here are some links to resources on CSP:

• Content Security Policy (CSP) Reference: https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP)
• Content Security Policy (CSP) Cheat Sheet: https://scotthelme.co.uk/csp-cheat-sheet/)
• How to Use Content Security Policy (CSP) to Protect Your Website: https://m.youtube.com/watch?v=pBKB4wsQK48)