Fix CSP nonce support to resolve browser console warnings

[tjementum]

Summary & Motivation

Fix browser console warnings about Content Security Policy violations for dynamically created style elements by adding nonce support.

The application already had CSP headers blocking malicious scripts and styles. However, dynamically created style elements (used by UI components for positioning and styling) triggered CSP violations in the browser console because they lacked nonce attributes. This change generates unique nonces per request and configures the frontend to automatically apply them to legitimate dynamic styles.

• Generate cryptographically random nonce per request using RandomNumberGenerator
• Add nonce directives to CSP headers for script-src, script-src-elem, style-src, and style-src-elem
• Inject nonce into HTML via meta tag for client-side access
• Configure Rsbuild security nonce for webpack bundle loading
• Intercept document.createElement to automatically add nonce attribute to dynamically created style elements
• Add e2e test validating CSP blocks malicious inline scripts and styles

Downstream projects

1. Add CSP nonce configuration to your-self-contained-system/WebApp/rsbuild.config.ts:

    export default defineConfig({
   +  security: {
   +    nonce: "{{cspNonce}}"
   +  },
      tools: {

2. Add CSP nonce meta tag and interception script to your-self-contained-system/WebApp/public/index.html:

   +    <meta name="csp-nonce" content="%CSP_NONCE%" />
        <title>Your Application Title</title>
   +    <script nonce="{{cspNonce}}">
   +      window.__webpack_nonce__=document.querySelector('meta[name="csp-nonce"]').content;
   +      const o=document.createElement;
   +      document.createElement=t=>{const e=o.call(document,t);return t.toLowerCase()==='style'&&e.setAttribute('nonce',window.__webpack_nonce__),e};
   +    </script>

Checklist

• I have added tests, or done manual regression tests
• I have updated the documentation, if necessary

[linear]

PP-621 Fix CSP nonce support to resolve browser console warnings

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
55.6% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud