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.

Sign up for GitHub

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

Jump to bottom

setJSActionAttribute: Cannot read properties of null (reading 'type') #56073

Closed
zip-fa opened this issue May 24, 2024 · 2 comments
Closed

setJSActionAttribute: Cannot read properties of null (reading 'type') #56073

zip-fa opened this issue May 24, 2024 · 2 comments
Assignees
@AndrewKushnir
Labels
area: core Issues related to the framework runtime core: event dispatch core: hydration P2 The issue is important to a large percentage of users, with a workaround state: confirmed state: has PR
Milestone
Backlog

Comments

@zip-fa
Copy link

zip-fa commented May 24, 2024

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

core

Is this a regression?

No

Description

withEventReplay() feature does not work on fresh angular project.

This is my app.config.ts:

import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
import { provideRouter } from '@angular/router';

import { routes } from './app.routes';
import {
  provideClientHydration,
  withEventReplay,
  withI18nSupport,
  withNoHttpTransferCache
} from '@angular/platform-browser';

export const appConfig: ApplicationConfig = {
  providers: [
    provideZoneChangeDetection({ eventCoalescing: true }),
    provideRouter(routes),
    provideClientHydration(withNoHttpTransferCache(), withI18nSupport(), withEventReplay()),
  ]
};

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

8:47:57 PM [vite] Internal server error: Cannot read properties of null (reading 'type')
      at setJSActionAttribute (/jsaction-bug/node_modules/@angular/core/fesm2022/core.mjs:36686:15)
      at serializeLView (/jsaction-bug/node_modules/@angular/core/fesm2022/core.mjs:36972:13)
      at annotateHostElementForHydration (/jsaction-bug/node_modules/@angular/core/fesm2022/core.mjs:37174:21)
      at annotateComponentLViewForHydration (/jsaction-bug/node_modules/@angular/core/fesm2022/core.mjs:36776:16)
      at annotateForHydration (/jsaction-bug/node_modules/@angular/core/fesm2022/core.mjs:36841:17)
      at prepareForHydration (/jsaction-bug/node_modules/@angular/platform-server/fesm2022/platform-server.mjs:16982:34)
      at eval (/jsaction-bug/node_modules/@angular/platform-server/fesm2022/platform-server.mjs:17042:3)
      at Generator.next (<anonymous>)
      at fulfilled (/jsaction-bug/.angular/vite-root/jsaction-bug/chunk-QDHZVCWX.mjs:50:24)
      at _ZoneDelegate.invoke (/jsaction-bug/node_modules/zone.js/fesm2015/zone-node.js:365:28)

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

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

Angular CLI: 18.0.1
Node: 21.7.3 (Unsupported)
Package Manager: npm 10.5.0
OS: darwin arm64

Angular: 18.0.0
... animations, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic
... platform-server, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1800.1
@angular-devkit/build-angular   18.0.1
@angular-devkit/core            18.0.1
@angular-devkit/schematics      18.0.1
@angular/cli                    18.0.1
@angular/ssr                    18.0.1
@schematics/angular             18.0.1
rxjs                            7.8.1
typescript                      5.4.5
zone.js                         0.14.6

Anything else?

No response
@JeanMeche
Copy link
Member

Fwiw the issue occurs when there is a @for block in the template.

@JeanMeche JeanMeche added core: hydration area: core Issues related to the framework runtime labels May 24, 2024
@ngbot ngbot bot added this to the needsTriage milestone May 24, 2024
@AndrewKushnir AndrewKushnir added core: event dispatch P2 The issue is important to a large percentage of users, with a workaround labels May 24, 2024
@ngbot ngbot bot modified the milestones: needsTriage, Backlog May 24, 2024
@AndrewKushnir AndrewKushnir self-assigned this May 24, 2024
AndrewKushnir added a commit to AndrewKushnir/angular that referenced this issue May 24, 2024
@AndrewKushnir
fix(core): handle elements with local refs in event replay serializat…
2ca7773 
…ion logic

Previously, the event replay serialization logic was located before we verify that a `TNode` exists. `TNode`s may not exist in `tView.data` array in several cases, including cases when there is a local ref used on an element: in this case an extra slot in `LView` contains a reference to the same element and `TNode` is not needed. This commit moves the event replay serialization logic a bit lower, after we check for TNode presence.

Resolves angular#56073.
@AndrewKushnir AndrewKushnir mentioned this issue May 24, 2024
Closed
3 tasks
@AndrewKushnir
Copy link
Contributor

@zip-fa thanks for the repro and thanks @JeanMeche for the investigation. I've created a fix, see PR #56076. The problem was caused by the fact that we've invoked event replay serialization logic before we check that all the necessary info is available (see PR description for additional info).

pkozlowski-opensource pushed a commit that referenced this issue May 27, 2024
@AndrewKushnir @pkozlowski-opensource
fix(core): handle elements with local refs in event replay serializat…
4e6ea0e 
…ion logic (#56076)

Previously, the event replay serialization logic was located before we verify that a `TNode` exists. `TNode`s may not exist in `tView.data` array in several cases, including cases when there is a local ref used on an element: in this case an extra slot in `LView` contains a reference to the same element and `TNode` is not needed. This commit moves the event replay serialization logic a bit lower, after we check for TNode presence.

Resolves #56073.

PR Close #56076
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@AndrewKushnir AndrewKushnir

Labels
area: core Issues related to the framework runtime core: event dispatch core: hydration P2 The issue is important to a large percentage of users, with a workaround state: confirmed state: has PR
Projects
None yet
Milestone
Backlog
Development

Successfully merging a pull request may close this issue.

fix(core): handle elements with local refs in event replay serialization logic AndrewKushnir/angular
3 participants
@JeanMeche @AndrewKushnir @zip-fa