Skip to content

EventReplay throws with a Directive HostListener on a ng-container #60070

@JeanMeche

Description

@JeanMeche

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

core

Is this a regression?

No

Description

The eventReplay code erroneously assumes that any node it will receive is an Element.
But with the following repro, the listener passes a CommentNode instead.

Also the event target can be the document which isn't an Element either.

Repro:

@Directive({
  selector: '[add-global-listener]',
})
class AddGlobalListener {
  @HostListener('document:click')
  handleClick() {
    console.log('click');
  }
}

@Component({
  selector: 'app-root',
  template: `<ng-container add-global-listener>
      <button>Click me!</button>
    </ng-container>`,
  imports: [AddGlobalListener],
})
export class AppComponent {
}

Stacktrace:

main.ts:6 TypeError: rEl.getAttribute is not a function
    at sharedMapFunction (event_delegation_utils.ts:70:23)
    at event_replay.ts:111:17
    at listenerInternal (listener.ts:220:7)
    at Module.ɵɵlistener (listener.ts:69:3)
    at Object.AddGlobalListener_HostBindings [as hostBindings] (app.component.ts:8:7)
    at invokeHostBindingsInCreationMode (shared.ts:413:9)
    at invokeDirectivesHostBindings (shared.ts:396:9)
    at createDirectivesInstances (shared.ts:131:5)
    at createDirectivesInstancesInInstruction (shared.ts:122:3)
    at Module.ɵɵelementContainerStart (element_container.ts:134:5)

Metadata

Metadata

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions