From 3eb74384aed76a31b481f07c5ff3bdbe6a6f4fd6 Mon Sep 17 00:00:00 2001 From: arditdomi <32884230+arditdomi@users.noreply.github.com> Date: Wed, 13 Oct 2021 14:38:26 +0100 Subject: [PATCH] =?UTF-8?q?[AAE-5872]=20-=20Viewer=20responds=20as=20we=20?= =?UTF-8?q?type=20in=20the=20form=20fields.=20Apply=20the=E2=80=A6=20(#729?= =?UTF-8?q?8)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * [AAE-5872] - Viewer responds as we type in the form fields. Apply the fix on start process also * Remove comments Co-authored-by: Ardit Domi --- .../src/lib/form/components/form-cloud.component.spec.ts | 8 ++++++++ .../src/lib/form/components/form-cloud.component.ts | 7 ++++++- .../components/start-process-cloud.component.spec.ts | 8 ++++++++ .../components/start-process-cloud.component.ts | 7 ++++++- .../components/task-form-cloud.component.spec.ts | 9 --------- .../task-form/components/task-form-cloud.component.ts | 7 +------ 6 files changed, 29 insertions(+), 17 deletions(-) diff --git a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts index 8ba8ae4327..7b0c87223e 100644 --- a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts @@ -52,6 +52,7 @@ import { TranslateService, TranslateModule } from '@ngx-translate/core'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { CloudFormRenderingService } from './cloud-form-rendering.service'; import { Node } from '@alfresco/js-api'; +import { ESCAPE } from '@angular/cdk/keycodes'; const mockOauth2Auth: any = { oauth2Auth: { @@ -1221,4 +1222,11 @@ describe('retrieve metadata on submit', () => { expect(formDataRefreshed).not.toHaveBeenCalled(); expect(formContentClicked).toHaveBeenCalledWith(contentLinkModel); }); + + it('should cancel bubbling a keydown event', () => { + const escapeKeyboardEvent = new KeyboardEvent('keydown', { 'keyCode': ESCAPE } as any); + fixture.debugElement.triggerEventHandler('keydown', escapeKeyboardEvent); + + expect(escapeKeyboardEvent.cancelBubble).toBe(true); + }); }); diff --git a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts index d4a24f6bca..32a63b0500 100644 --- a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts +++ b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts @@ -17,7 +17,7 @@ import { Component, EventEmitter, Input, OnChanges, - Output, SimpleChanges, OnDestroy + Output, SimpleChanges, OnDestroy, HostListener } from '@angular/core'; import { Observable, of, forkJoin, Subject, Subscription } from 'rxjs'; import { switchMap, takeUntil, map } from 'rxjs/operators'; @@ -127,6 +127,11 @@ export class FormCloudComponent extends FormBaseComponent implements OnChanges, }); } + @HostListener('keydown', ['$event']) + onKeyDown(event: KeyboardEvent) { + event.cancelBubble = true; + } + ngOnChanges(changes: SimpleChanges) { const appName = changes['appName']; diff --git a/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.spec.ts index 26e30442e7..3b88404619 100755 --- a/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.spec.ts @@ -43,6 +43,7 @@ import { ProcessServiceCloudTestingModule } from '../../../testing/process-servi import { TranslateModule } from '@ngx-translate/core'; import { ProcessNameCloudPipe } from '../../../pipes/process-name-cloud.pipe'; import { ProcessInstanceCloud } from '../models/process-instance-cloud.model'; +import { ESCAPE } from '@angular/cdk/keycodes'; describe('StartProcessCloudComponent', () => { @@ -825,5 +826,12 @@ describe('StartProcessCloudComponent', () => { expect(component.processInstanceName.touched).toBe(true); expect(component.processInstanceName.value).toEqual('fake-transformed-name'); }); + + it('should cancel bubbling a keydown event ()', () => { + const escapeKeyboardEvent = new KeyboardEvent('keydown', { 'keyCode': ESCAPE } as any); + fixture.debugElement.triggerEventHandler('keydown', escapeKeyboardEvent); + + expect(escapeKeyboardEvent.cancelBubble).toBe(true); + }); }); }); diff --git a/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.ts b/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.ts index 7cec2e49ea..14ecd04dc1 100755 --- a/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.ts +++ b/lib/process-services-cloud/src/lib/process/start-process/components/start-process-cloud.component.ts @@ -17,7 +17,7 @@ import { Component, EventEmitter, Input, OnChanges, OnInit, - Output, SimpleChanges, ViewChild, ViewEncapsulation, OnDestroy + Output, SimpleChanges, ViewChild, ViewEncapsulation, OnDestroy, HostListener } from '@angular/core'; import { ProcessInstanceCloud } from '../models/process-instance-cloud.model'; @@ -157,6 +157,11 @@ export class StartProcessCloudComponent implements OnChanges, OnInit, OnDestroy } } + @HostListener('keydown', ['$event']) + onKeyDown(event: KeyboardEvent) { + event.cancelBubble = true; + } + hasForm(): boolean { return this.processDefinitionCurrent && !!this.processDefinitionCurrent.formKey; } diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.spec.ts index 3f177e771a..56b0aadddd 100644 --- a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.spec.ts @@ -25,7 +25,6 @@ import { TaskFormCloudComponent } from './task-form-cloud.component'; import { TaskDetailsCloudModel } from '../../start-task/models/task-details-cloud.model'; import { TaskCloudService } from '../../services/task-cloud.service'; import { TranslateModule } from '@ngx-translate/core'; -import { ESCAPE } from '@angular/cdk/keycodes'; const taskDetails: TaskDetailsCloudModel = { appName: 'simple-app', @@ -457,12 +456,4 @@ describe('TaskFormCloudComponent', () => { expect(noFormTemplateTitle).toBeNull(); }); - - // For widgets like File Viewer bubbling the keydown events of the form needs to be cancelled - it('should cancel bubbling a keydown event ()', () => { - const escapeKeyboardEvent = new KeyboardEvent('keydown', { 'keyCode': ESCAPE } as any); - fixture.debugElement.triggerEventHandler('keydown', escapeKeyboardEvent); - - expect(escapeKeyboardEvent.cancelBubble).toBe(true); - }); }); diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts index 17379c7afa..fda9604442 100644 --- a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts +++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts @@ -17,7 +17,7 @@ import { Component, EventEmitter, Input, OnChanges, - Output, SimpleChanges, OnInit, HostListener, ViewEncapsulation + Output, SimpleChanges, OnInit, ViewEncapsulation } from '@angular/core'; import { TaskDetailsCloudModel } from '../../start-task/models/task-details-cloud.model'; import { TaskCloudService } from '../../services/task-cloud.service'; @@ -113,11 +113,6 @@ export class TaskFormCloudComponent implements OnInit, OnChanges { this.formRenderingService.setComponentTypeResolver('date', () => DateCloudWidgetComponent, true); } - @HostListener('keydown', ['$event']) - onKeyDown(event: KeyboardEvent) { - event.cancelBubble = true; - } - ngOnInit() { if (this.appName === '' && this.taskId) { this.loadTask();