Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

feat(material): Support CSP, headers with style-src 'self'

See original GitHub issue

Feature Description

Our current CSP implementation contains style-src 'self' which is not compatible with Angular Material. It would be great that Angular Material would support such CSP headers and, for example, as a solution have a possibility to add CSP nonces or would disable such inline injections. There was already an issue created before but was closed due to inactivity.

We have used ‘unsafe-hashes’ for some of the styles attributes but now, according to Dutch government, which we have to comply to, these should be removed.

If you think some workaround is possible or a minor fix in a code would do, it would be great to get that information. We could then maybe provide a pull request ourselves.

Use Case

This would enable use of strict CSP headers regarding styles.

Issue Analytics

State:
Created 2 years ago
Reactions:26
Comments:12 (8 by maintainers)

Top GitHub Comments

1reaction

jelbourncommented, Mar 24, 2022

Angular itself has this problem: https://github.com/angular/angular/issues/6361

That issue being addressed would be a prereq for components to tackle this.

0reactions

angular-automatic-lock-bot[bot]commented, May 28, 2022

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

Top Results From Across the Web

CSP: style-src - HTTP - MDN Web Docs - Mozilla

The HTTP Content-Security-Policy (CSP) style-src directive specifies valid sources for ... as well as styles loaded using the Link header:.

Content-Security-Policy Header CSP Reference & Examples

Defines valid sources of stylesheets or CSS. Example style-src Policy. style-src 'self' css.example.com; CSP Level 1 25+ ...

Content Security Policy (CSP) - Material UI - MUI

This section covers the details of setting up a CSP. ... header('Content-Security-Policy').set( `default-src 'self'; style-src 'self' 'nonce-${nonce}';`, );

Content Security Policy (CSP) Header Not Set - OWASP ZAP

Ensure that your web server, application server, load balancer, etc. is configured to set the Content-Security-Policy header, to achieve optimal browser support ......

Make Angular working with restrictive Content Security Policy ...