From 06bc0931a1c196d3bacaa8f188469d7d291ac20e Mon Sep 17 00:00:00 2001
From: Artur <arthurandrosovich@gmail.com>
Date: Thu, 12 Sep 2024 06:43:30 +0100
Subject: [PATCH] feat: allow `OutputEmitterRef` keys in `triggerEventHandler`
 (#672)

---
 .../spectator/src/lib/base/dom-spectator.ts   |  2 +-
 ...hild-custom-event-parent.component.spec.ts | 32 ++++++++++++++-----
 .../child-custom-event-parent.component.ts    | 11 +++++--
 .../child-custom-event.component.ts           |  5 +--
 4 files changed, 37 insertions(+), 13 deletions(-)

diff --git a/projects/spectator/src/lib/base/dom-spectator.ts b/projects/spectator/src/lib/base/dom-spectator.ts
index e8420569..706b1297 100644
--- a/projects/spectator/src/lib/base/dom-spectator.ts
+++ b/projects/spectator/src/lib/base/dom-spectator.ts
@@ -265,7 +265,7 @@ export abstract class DomSpectator<I> extends BaseSpectator {
     return event;
   }
 
-  public triggerEventHandler<C = any, K extends KeysMatching<C, EventEmitter<any>> = any>(
+  public triggerEventHandler<C = any, K extends KeysMatching<C, EventEmitter<any> | OutputEmitterRef<any>> = any>(
     directiveOrSelector: Type<C> | string | DebugElement,
     eventName: K,
     eventObj: OutputType<C[K]>,
diff --git a/projects/spectator/test/child-custom-event/child-custom-event-parent.component.spec.ts b/projects/spectator/test/child-custom-event/child-custom-event-parent.component.spec.ts
index f679d9e7..f9577dac 100644
--- a/projects/spectator/test/child-custom-event/child-custom-event-parent.component.spec.ts
+++ b/projects/spectator/test/child-custom-event/child-custom-event-parent.component.spec.ts
@@ -13,15 +13,31 @@ describe('ChildCustomEventParentComponent', () => {
     declareComponent: false,
   });
 
-  it('should trigger custom event with directive selector', () => {
-    spectator = createComponent();
-    spectator.triggerEventHandler(ChildCustomEventComponent, 'customEvent', 'hello');
-    expect(spectator.query(byText('hello'))).toExist();
+  describe('new EventEmitter()', () => {
+    it('should trigger custom event with directive selector', () => {
+      spectator = createComponent();
+      spectator.triggerEventHandler(ChildCustomEventComponent, 'customEventUsingEventEmitter', 'hello');
+      expect(spectator.query(byText('hello'))).toExist();
+    });
+
+    it('should trigger custom event with string selector', () => {
+      spectator = createComponent();
+      spectator.triggerEventHandler('app-child-custom-event', 'customEventUsingEventEmitter', 'hello');
+      expect(spectator.query(byText('hello'))).toExist();
+    });
   });
 
-  it('should trigger custom event with string selector', () => {
-    spectator = createComponent();
-    spectator.triggerEventHandler('app-child-custom-event', 'customEvent', 'hello');
-    expect(spectator.query(byText('hello'))).toExist();
+  describe('output()', () => {
+    it('should trigger custom event with directive selector', () => {
+      spectator = createComponent();
+      spectator.triggerEventHandler(ChildCustomEventComponent, 'customEventUsingOutputEmitter', 'hello');
+      expect(spectator.query(byText('hello'))).toExist();
+    });
+
+    it('should trigger custom event with string selector', () => {
+      spectator = createComponent();
+      spectator.triggerEventHandler('app-child-custom-event', 'customEventUsingOutputEmitter', 'hello');
+      expect(spectator.query(byText('hello'))).toExist();
+    });
   });
 });
diff --git a/projects/spectator/test/child-custom-event/child-custom-event-parent.component.ts b/projects/spectator/test/child-custom-event/child-custom-event-parent.component.ts
index d0e3781e..e5818b88 100644
--- a/projects/spectator/test/child-custom-event/child-custom-event-parent.component.ts
+++ b/projects/spectator/test/child-custom-event/child-custom-event-parent.component.ts
@@ -3,14 +3,21 @@ import { Component } from '@angular/core';
 @Component({
   selector: 'app-child-custom-event-parent',
   template: `
-    <app-child-custom-event (customEvent)="onCustomEvent($event)"></app-child-custom-event>
+    <app-child-custom-event
+      (customEventUsingEventEmitter)="onCustomEventUsingEventEmitter($event)"
+      (customEventUsingOutputEmitter)="onCustomEventUsingOutputEmitter($event)"
+    />
     <p>{{ eventValue }}</p>
   `,
 })
 export class ChildCustomEventParentComponent {
   public eventValue = '';
 
-  public onCustomEvent(eventValue: string): void {
+  public onCustomEventUsingEventEmitter(eventValue: string): void {
+    this.eventValue = eventValue;
+  }
+
+  public onCustomEventUsingOutputEmitter(eventValue: string): void {
     this.eventValue = eventValue;
   }
 }
diff --git a/projects/spectator/test/child-custom-event/child-custom-event.component.ts b/projects/spectator/test/child-custom-event/child-custom-event.component.ts
index dba8e70a..f86d16e5 100644
--- a/projects/spectator/test/child-custom-event/child-custom-event.component.ts
+++ b/projects/spectator/test/child-custom-event/child-custom-event.component.ts
@@ -1,9 +1,10 @@
-import { Component, Output, EventEmitter } from '@angular/core';
+import { Component, Output, output, EventEmitter } from '@angular/core';
 
 @Component({
   selector: 'app-child-custom-event',
   template: ` <p>Custom child</p> `,
 })
 export class ChildCustomEventComponent {
-  @Output() customEvent = new EventEmitter<string>();
+  @Output() customEventUsingEventEmitter = new EventEmitter<string>();
+  customEventUsingOutputEmitter = output<string>();
 }