refactor: since inputs are signals, removes EventEmitter

.gitignore

@@ -2,4 +2,5 @@
 node_modules
 dist
 coverage
-*.xml
+*.xml
+*/update_angular.sh

ider/src/ider.component.spec.ts

@@ -20,6 +20,9 @@ describe('IderComponent', () => {
     }).compileComponents()
     fixture = TestBed.createComponent(IDERComponent)
     component = fixture.componentInstance
+
+    // Initialize with deviceConnection = false to avoid triggering effect during setup
+    fixture.componentRef.setInput('deviceConnection', false)
     fixture.detectChanges()
   })
 
@@ -51,15 +54,27 @@ describe('IderComponent', () => {
     expect(component.deviceStatus.emit).toHaveBeenCalledWith(1)
   })
 
-  it('should call instantiate when deviceConnection emits true', () => {
-    spyOn(component, 'instantiate')
-    component.deviceConnection().emit(true)
-    expect(component.instantiate).toHaveBeenCalled()
+  it('should call init when deviceConnection is true', () => {
+    spyOn(component, 'init')
+    fixture.componentRef.setInput('deviceConnection', true)
+    fixture.detectChanges()
+    expect(component.init).toHaveBeenCalled()
   })
 
-  it('should call stopIder when deviceConnection emits false', () => {
+  it('should call stopIder when deviceConnection is false', () => {
     spyOn(component, 'stopIder')
-    component.deviceConnection().emit(false)
+
+    // First set deviceConnection to true to initialize
+    fixture.componentRef.setInput('deviceConnection', true)
+    fixture.detectChanges()
+
+    // Set up a mock redirector so the effect will call stopIder
+    component.redirector = {} as any
+
+    // Then set deviceConnection to false
+    fixture.componentRef.setInput('deviceConnection', false)
+    fixture.detectChanges()
+
     expect(component.stopIder).toHaveBeenCalled()
   })
 

ider/src/ider.component.ts

@@ -1,4 +1,4 @@
-import { EventEmitter, Component, OnInit, OnDestroy, input, output } from '@angular/core'
+import { Component, OnDestroy, input, output, inject, DestroyRef, effect } from '@angular/core'
 import { AMTRedirector, Protocol, AMTIDER, RedirectorConfig } from '@device-management-toolkit/ui-toolkit/core'
 
 export interface IDERData {
@@ -13,7 +13,9 @@ export interface IDERData {
   template: '',
   styles: []
 })
-export class IDERComponent implements OnInit, OnDestroy {
+export class IDERComponent implements OnDestroy {
+  private readonly destroyRef = inject(DestroyRef)
+
   redirector: AMTRedirector | null
   ider: AMTIDER | null
   data: IDERData | null
@@ -22,17 +24,21 @@ export class IDERComponent implements OnInit, OnDestroy {
   readonly deviceStatus = output<number>()
   readonly iderData = output<IDERData>()
 
-  readonly deviceConnection = input<EventEmitter<boolean>>(new EventEmitter<boolean>())
+  readonly deviceConnection = input<boolean>(false)
   public readonly cdrom = input<File | null>(null)
   public readonly floppy = input<File | null>(null)
   public mpsServer = input('')
   public authToken = input('')
   public deviceId = input('')
 
-  ngOnInit(): void {
-    this.deviceConnection().subscribe((data: boolean) => {
-      if (data) {
-        this.init()
+  constructor() {
+    // React to deviceConnection changes
+    effect(() => {
+      const connected = this.deviceConnection()
+      if (connected) {
+        if (this.redirector == null) {
+          this.init()
+        }
       } else {
         this.stopIder()
       }
@@ -108,7 +114,7 @@ export class IDERComponent implements OnInit, OnDestroy {
   }
 
   stopIder(): void {
-    if (this.redirector !== null) {
+    if (this.redirector != null) {
       this.redirector.stop()
       this.cleanup()
     }

kvm/src/kvm.component.spec.ts

@@ -27,19 +27,28 @@ describe('KvmComponent', () => {
   const setup = (): void => {
     fixture = TestBed.createComponent(KVMComponent)
     component = fixture.componentInstance
-    // Set initial inputs via setInput
+    // Set initial inputs via setInput to prevent effect from triggering during setup
+    fixture.componentRef.setInput('deviceConnection', false)
     fixture.componentRef.setInput('mpsServer', '')
-    fixture.componentRef.setInput('authToken', '')
+    fixture.componentRef.setInput('authToken', 'authToken')
     fixture.componentRef.setInput('deviceId', '')
     fixture.detectChanges()
+
+    // Now enable connection to trigger init
+    fixture.componentRef.setInput('deviceConnection', true)
+    fixture.detectChanges()
   }
 
   const asyncSetup = fakeAsync(() => {
     fixture = TestBed.createComponent(KVMComponent)
     component = fixture.componentInstance
+    fixture.componentRef.setInput('deviceConnection', false)
     fixture.componentRef.setInput('mpsServer', 'wss://localhost')
     fixture.componentRef.setInput('authToken', 'authToken')
-    fixture.componentRef.setInput('deviceId', '')
+    fixture.detectChanges()
+
+    fixture.componentRef.setInput('deviceConnection', true) // Enable connection to trigger init
+    fixture.detectChanges()
     tick(4500)
     fixture.detectChanges()
     flush()
@@ -53,17 +62,17 @@ describe('KvmComponent', () => {
     expect(component.mouseHelper).toBeInstanceOf(MouseHelper)
     expect(component.keyboardHelper).toBeInstanceOf(KeyBoardHelper)
     expect(component.dataProcessor).toBeInstanceOf(DataProcessor)
-    expect(component.selected).toEqual(1)
+    expect(component.selected()).toEqual(1)
     expect(component.encodings.length).toEqual(2)
     expect(component.mpsServer()).toBe('')
     expect(component.deviceId()).toBe('')
-    expect(component.authToken()).toBe('')
+    expect(component.authToken()).toBe('authToken')
   })
 
   it('should autoconnect on pageload', () => {
     asyncSetup()
     spyOn<any>(component.redirector, 'start')
-    spyOn(component.keyboardHelper, 'GrabKeyInput')
+    spyOn(component.keyboardHelper!, 'GrabKeyInput')
     expect(component.redirector).not.toBeNull()
     expect(component.mpsServer()).toEqual('wss://localhost')
     expect(component.authToken()).toEqual('authToken')
@@ -72,22 +81,30 @@ describe('KvmComponent', () => {
   it('should reset all the objects once kvm is stopped', () => {
     setup()
     spyOn<any>(component.redirector, 'stop')
-    spyOn(component.keyboardHelper, 'UnGrabKeyInput')
+    spyOn(component.keyboardHelper!, 'UnGrabKeyInput')
     const resetSpy = spyOn(component, 'reset')
     component.stopKvm()
     expect(component.redirector?.stop).toHaveBeenCalled()
-    expect(component.keyboardHelper.UnGrabKeyInput).toHaveBeenCalled()
+    expect(component.keyboardHelper!.UnGrabKeyInput).toHaveBeenCalled()
     expect(resetSpy).toHaveBeenCalled()
   })
 
   it('should disconnect the active KVM session if there is an encoding change', fakeAsync(() => {
     setup()
     const stopKvmSpy = spyOn(component, 'stopKvm')
     const autoConnectSpy = spyOn(component, 'autoConnect')
-    component.selectedEncoding().emit(1)
-    tick(1100)
+
+    // First set deviceConnection to true and ensure component is connected
+    fixture.componentRef.setInput('deviceConnection', true)
     fixture.detectChanges()
-    expect(component.selected).toEqual(1)
+    tick()
+
+    // Then change the encoding
+    fixture.componentRef.setInput('selectedEncoding', 2) // Change from default 1 to 2
+    fixture.detectChanges()
+    tick(1100) // Wait for the timer in onEncodingChange
+
+    expect(component.selected()).toEqual(2)
     expect(stopKvmSpy).toHaveBeenCalled()
     expect(autoConnectSpy).toHaveBeenCalled()
     flush()
@@ -103,9 +120,9 @@ describe('KvmComponent', () => {
 
   it('should trigger the core components method on mouse interactions', () => {
     setup()
-    spyOn(component.mouseHelper, 'mousedown')
-    spyOn(component.mouseHelper, 'mouseup')
-    spyOn(component.mouseHelper, 'mousemove')
+    spyOn(component.mouseHelper!, 'mousedown')
+    spyOn(component.mouseHelper!, 'mouseup')
+    spyOn(component.mouseHelper!, 'mousemove')
 
     const event: any = {
       button: 1,
@@ -114,14 +131,14 @@ describe('KvmComponent', () => {
     }
     component.onMousedown(event as MouseEvent)
     expect(component.mouseHelper).not.toBeNull()
-    expect(component.mouseHelper.mousedown).toHaveBeenCalled()
+    expect(component.mouseHelper!.mousedown).toHaveBeenCalled()
 
     component.onMouseup(event as MouseEvent)
     expect(component.mouseHelper).not.toBeNull()
-    expect(component.mouseHelper.mouseup).toHaveBeenCalled()
+    expect(component.mouseHelper!.mouseup).toHaveBeenCalled()
 
     component.onMousemove(event as MouseEvent)
     expect(component.mouseHelper).not.toBeNull()
-    expect(component.mouseHelper.mousemove).toHaveBeenCalled()
+    expect(component.mouseHelper!.mousemove).toHaveBeenCalled()
   })
 })