Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"TypeError: link.prev?.setAttribute is not a function" upon rendering any page with "ngCspNonce" set. #3241

Closed
1 of 3 tasks
majoer opened this issue Aug 16, 2023 · 1 comment · Fixed by #3243
Closed
1 of 3 tasks

Comments

@majoer
Copy link

majoer commented Aug 16, 2023

🐞 Bug report

What modules are related to this issue?

  • builders
  • common
  • express-engine

Is this a regression?

I don't think so, as the CSP feature was added in 16

Description

We started using the "ngCspNonce" attribute when we upgraded to Angular 16. The application builds and starts, but upon sending a request to a SSR page we get an "Internal server error" in the browser. The console also displays an error message:


TypeError: link.prev?.setAttribute is not a function

The same bug was reported in @angular-devkit/build-angular here:

This is the PR where they fixed it: angular/angular-cli#25584
After this fix was released I expected our app to work, but I found angular universal has its own version of "inline-css-processor.ts" here:
https://github.com/angular/universal/blob/5974f8e769e75023cacbf0cc52f7c1a6ae534f45/modules/common/tools/src/inline-css-processor.ts#L157C21-L157C21

I believe the fix should be applied to Angular Universal as well.

🔬 Minimal Reproduction

  1. Add "ngCspNonce" to the app-root as explained in: https://angular.io/guide/security#content-security-policy
  2. Add some external style-sheets as links in index.html.
  3. Set inlineCritical": true in angular.json
  4. build and run with SSR

Here is the repo i made for the issue I reported in angular-cli. The same setup should yield the same problem in angular universal: https://github.com/majoer/angular-csp-link-bug

🔥 Exception or Error


TypeError: link.prev?.setAttribute is not a function

🌍 Your Environment


Angular CLI: 16.2.0
Node: 16.17.0
Package Manager: npm 8.15.0
OS: linux x64

 

Angular: 16.2.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, language-service, localize, material
... material-moment-adapter, platform-browser
... platform-browser-dynamic, platform-server, router

 

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1602.0
@angular-devkit/build-angular   16.2.0
@angular-devkit/core            16.2.0
@angular-devkit/schematics      16.2.0
@nguniversal/builders           16.2.0
@nguniversal/express-engine     16.2.0
@schematics/angular             16.2.0
rxjs                            7.8.1
typescript                      4.9.5
zone.js                         0.13.1
alan-agius4 added a commit to alan-agius4/universal that referenced this issue Aug 17, 2023
…rnal stylesheets

The problem with the previous approach is that it assumes that a `link` tag processed by Critters will be preceded by a `style` tag that was inserted by Critters. This assumption might not necessarily be true if Critters is unable to resolve the content of the linked styles.

Closes: angular#3241
alan-agius4 added a commit that referenced this issue Aug 17, 2023
…rnal stylesheets

The problem with the previous approach is that it assumes that a `link` tag processed by Critters will be preceded by a `style` tag that was inserted by Critters. This assumption might not necessarily be true if Critters is unable to resolve the content of the linked styles.

Closes: #3241
alan-agius4 added a commit that referenced this issue Aug 17, 2023
…rnal stylesheets

The problem with the previous approach is that it assumes that a `link` tag processed by Critters will be preceded by a `style` tag that was inserted by Critters. This assumption might not necessarily be true if Critters is unable to resolve the content of the linked styles.

Closes: #3241
(cherry picked from commit 1aed4b8)
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 17, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
2 participants