angular: TypeError when hydration is enabled (hostElement.hasAttribute is not a function)

Which @angular/* package(s) are the source of the bug?

Don’t known / other

Is this a regression?

No

Description

When adding provideClientHydration() to my app.module.ts, the render()-Method breaks with the error

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

TypeError: hostElement.hasAttribute is not a function
    at annotateForHydration (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:2881506)
    at /Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:3491908
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:3748394)
    at _next (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:3748698)
    at ZoneTask2.callback (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:1902313)
    at _ZoneDelegate2.invokeTask (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:1895862)
    at Zone3.runTask (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:1888322)
    at ZoneTask2.invokeTask (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:1897459)
    at ZoneTask2.invoke (/Users/jko13/GIT/storefront/dist/storefront/server/main.js:1:1897256)

Please provide the environment you discovered this bug in (run ng version)

_                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 16.0.0
Node: 18.10.0
Package Manager: npm 8.19.2
OS: darwin arm64

Angular: 16.0.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, language-service, material, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1600.0
@angular-devkit/build-angular   16.0.0
@angular-devkit/core            16.0.0
@angular-devkit/schematics      16.0.0
@angular/google-maps            15.2.9
@nguniversal/builders           16.0.0
@nguniversal/express-engine     16.0.0
@schematics/angular             16.0.0
ng-packagr                      16.0.0
rxjs                            7.5.7
typescript                      5.0.4
webpack                         5.82.0

Anything else?

I am close to tears since if was looking so much forward for this 😦

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Comments: 26 (13 by maintainers)

Commits related to this issue

Most upvoted comments

@joldibaev the problem should be resolved in the upcoming 16.0.1 next week. Meanwhile, you can try to test the behavior of your app with the fix using information from https://github.com/angular/angular/issues/50133#issuecomment-1534151814. Thank you.

@phihochzwei thanks for the update! Happy to hear that everything works as expected now! 🎉

We will proceed with the fix from PR #50136, it should be available in v16.0.1 release next week.