From 16852991fbab0cb04a674e56ff5bfb793e9aee76 Mon Sep 17 00:00:00 2001
From: "tomek.hanaj" <tomek.hanaj@hyland.com>
Date: Fri, 10 Jan 2025 15:23:01 +0100
Subject: [PATCH] [AAE-29973] added unit tests for input and output

---
 .../screen-cloud.component.spec.ts            | 49 +++++++++++++++----
 .../screen-cloud/screen-cloud.component.ts    | 10 ++--
 2 files changed, 46 insertions(+), 13 deletions(-)

diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts
index 214e5e57c8..f8693b68e7 100644
--- a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts
+++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts
@@ -17,30 +17,46 @@
 
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { CommonModule } from '@angular/common';
-import { Component } from '@angular/core';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { By } from '@angular/platform-browser';
 import { ScreenRenderingService } from '../../../services/public-api';
 import { TaskScreenCloudComponent } from './screen-cloud.component';
 
 @Component({
     selector: 'adf-cloud-test-component',
-    template: `<div class="adf-cloud-test-container">test component</div>`,
+    template: `
+        <div class="adf-cloud-test-container">
+            test component
+            <div class="adf-cloud-test-container-taskId">{{ taskId }}</div>
+            <button class="adf-cloud-test-container-complete-btn" (click)="onComplete()">complete</button>
+        </div>
+    `,
     imports: [CommonModule],
     standalone: true
 })
-class TestComponent {}
+class TestComponent {
+    @Input() taskId = '';
+    @Output() taskCompleted = new EventEmitter();
+    onComplete() {
+        this.taskCompleted.emit();
+    }
+}
 
 @Component({
     selector: 'adf-cloud-test-actions-component',
-    template: `<adf-cloud-task-screen [taskId]="'1'" [appName]="'app-name-test'" [screenId]="'test'">
-        <div buttons class="adf-cloud-test-buttons">
-            <button>Test</button>
-        </div>
-    </adf-cloud-task-screen> `,
+    template: `
+        <adf-cloud-task-screen [taskId]="'1'" [appName]="'app-name-test'" [screenId]="'test'" (taskCompleted)="onTaskCompleted()">
+            <div buttons class="adf-cloud-test-buttons">
+                <button>Test</button>
+            </div>
+        </adf-cloud-task-screen>
+    `,
     imports: [CommonModule, TaskScreenCloudComponent],
     standalone: true
 })
-class TestWrapperComponent {}
+class TestWrapperComponent {
+    onTaskCompleted() {}
+}
 
 describe('TaskScreenCloudComponent', () => {
     let fixture: ComponentFixture<TestWrapperComponent>;
@@ -66,4 +82,19 @@ describe('TaskScreenCloudComponent', () => {
         const projectedContent = fixture.debugElement.query(By.css('.adf-cloud-test-buttons'));
         expect(projectedContent).toBeTruthy();
     });
+
+    it('should set input property for dynamic component', () => {
+        const inputValueFromDynamicComponent = fixture.debugElement.query(By.css('.adf-cloud-test-container-taskId'));
+        expect((inputValueFromDynamicComponent.nativeElement as HTMLElement).textContent).toBe('1');
+    });
+
+    it('should subscribe to the output of dynamic component', () => {
+        const onTaskCompletedSpy = spyOn(fixture.componentInstance, 'onTaskCompleted');
+        const btnComplete = fixture.debugElement.query(By.css('.adf-cloud-test-container-complete-btn'));
+
+        expect(btnComplete).toBeDefined();
+
+        (btnComplete.nativeElement as HTMLButtonElement).click();
+        expect(onTaskCompletedSpy).toHaveBeenCalled();
+    });
 });
diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts
index f090514db3..dbe540a9a4 100644
--- a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts
+++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts
@@ -16,7 +16,7 @@
  */
 
 import { CommonModule } from '@angular/common';
-import { Component, ComponentRef, EventEmitter, inject, Input, OnInit, Output, ViewChild, ViewContainerRef } from '@angular/core';
+import { Component, ComponentRef, DestroyRef, EventEmitter, inject, Input, OnInit, Output, ViewChild, ViewContainerRef } from '@angular/core';
 import { ScreenRenderingService } from '../../../services/public-api';
 import { MatCardModule } from '@angular/material/card';
 import { UserTaskCustomUi } from './screen-cloud.interface';
@@ -59,6 +59,8 @@ export class TaskScreenCloudComponent implements OnInit {
 
     @ViewChild('container', { read: ViewContainerRef, static: true })
     container: ViewContainerRef;
+
+    private destroyRef = inject(DestroyRef);
     componentRef: ComponentRef<UserTaskCustomUi>;
 
     private readonly screenRenderingService = inject(ScreenRenderingService);
@@ -96,13 +98,13 @@ export class TaskScreenCloudComponent implements OnInit {
 
     subscribeToOutputs() {
         if (this.componentRef.instance?.taskSaved) {
-            this.componentRef.instance.taskSaved.pipe(takeUntilDestroyed()).subscribe(() => this.taskSaved.emit());
+            this.componentRef.instance.taskSaved.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this.taskSaved.emit());
         }
         if (this.componentRef.instance?.taskCompleted) {
-            this.componentRef.instance.taskCompleted.pipe(takeUntilDestroyed()).subscribe(() => this.taskCompleted.emit());
+            this.componentRef.instance.taskCompleted.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this.taskCompleted.emit());
         }
         if (this.componentRef.instance?.error) {
-            this.componentRef.instance.error.pipe(takeUntilDestroyed()).subscribe((data) => this.error.emit(data));
+            this.componentRef.instance.error.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((data) => this.error.emit(data));
         }
     }
 }