[ACS-4128] Undo functionality added for input in Perform Actions after selecting an action and it works after destnation folder change in Create/Edit a rule in Manage Rules (#8402)

* undo functionality added for input after selecting destination folder for Create and Edit a rule

* review comments addressed and added 3 more test cases

* used built in type KeyboardEvent instead of interface and combining 2 if conditions - shorten the code

* removed duplicate line of code

* removed duplicate code from test cases

* redundant code removed for render chips for multivalue properties test cases using resuable function

* code smell reduction
This commit is contained in:
Jatin Chugh
2023-03-27 17:41:29 +05:30
committed by GitHub
parent 1dcdc99c2e
commit 735e581932
3 changed files with 75 additions and 40 deletions

View File

@@ -18,7 +18,8 @@
matTooltipShowDelay="1000"
[matTooltip]="'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate"
[matTooltipDisabled]="isEditable"
[attr.data-automation-id]="'card-textitem-value-' + property.key">
[attr.data-automation-id]="'card-textitem-value-' + property.key"
(keydown)="undoText($event)">
<textarea matInput
*ngIf="property.multiline"
title="{{property.label | translate }}"

View File

@@ -58,6 +58,37 @@ describe('CardViewTextItemComponent', () => {
return textItemInputError.nativeElement.innerText;
};
const checkCtrlZActions = (ctrlKeyValue: boolean, codeValue: string, metaKeyValue: boolean, mockTestValue: string, flag: boolean) => {
component.textInput.setValue(mockTestValue);
const event = new KeyboardEvent('keydown', {
ctrlKey: ctrlKeyValue,
code: codeValue,
metaKey: metaKeyValue
} as KeyboardEventInit );
component.undoText(event);
if (flag) {
expect(component.textInput.value).toBe('');
} else {
expect(component.textInput.value).not.toBe('');
}
};
const renderChipsForMultiValuedProperties = async (cardViewTextItemObject, flag: boolean, length: number,
param1: string, param2: string, param3: string) => {
component.property = new CardViewTextItemModel(cardViewTextItemObject);
component.useChipsForMultiValueProperty = flag;
component.ngOnChanges({ property: new SimpleChange(null, null, true) });
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(length);
expect(valueChips[0].nativeElement.innerText.trim()).toBe(param1);
expect(valueChips[1].nativeElement.innerText.trim()).toBe(param2);
expect(valueChips[2].nativeElement.innerText.trim()).toBe(param3);
};
setupTestBed({
imports: [
TranslateModule.forRoot(),
@@ -186,67 +217,40 @@ describe('CardViewTextItemComponent', () => {
});
it('should render chips for multivalue properties when chips are enabled', async () => {
component.property = new CardViewTextItemModel({
label: 'Text label',
const cardViewTextItemObject = {
label: 'Text label 1',
value: ['item1', 'item2', 'item3'],
key: 'textkey',
default: ['FAKE-DEFAULT-KEY'],
editable: true,
multivalued: true
});
component.useChipsForMultiValueProperty = true;
component.ngOnChanges({ property: new SimpleChange(null, null, true) });
};
renderChipsForMultiValuedProperties(cardViewTextItemObject, true, 3, 'item1', 'item2', 'item3');
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('item1');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('item2');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('item3');
});
it('should render chips for multivalue integers when chips are enabled', async () => {
component.property = new CardViewIntItemModel({
label: 'Text label',
const cardViewTextItemObject = {
label: 'Text label 2',
value: [1, 2, 3],
key: 'textkey',
editable: true,
multivalued: true
});
component.useChipsForMultiValueProperty = true;
component.ngOnChanges({ property: new SimpleChange(null, null, true) });
};
renderChipsForMultiValuedProperties(cardViewTextItemObject, true, 3, '1', '2', '3');
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('1');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('2');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('3');
});
it('should render chips for multivalue decimal numbers when chips are enabled', async () => {
component.property = new CardViewFloatItemModel({
label: 'Text label',
const cardViewTextItemObject = {
label: 'Text label 3',
value: [1.1, 2.2, 3.3],
key: 'textkey',
editable: true,
multivalued: true
});
component.useChipsForMultiValueProperty = true;
component.ngOnChanges({ property: new SimpleChange(null, null, true) });
};
renderChipsForMultiValuedProperties(cardViewTextItemObject, true, 3, '1.1', '2.2', '3.3');
fixture.detectChanges();
await fixture.whenStable();
const valueChips = fixture.debugElement.queryAll(By.css(`mat-chip`));
expect(valueChips).not.toBeNull();
expect(valueChips.length).toBe(3);
expect(valueChips[0].nativeElement.innerText.trim()).toBe('1.1');
expect(valueChips[1].nativeElement.innerText.trim()).toBe('2.2');
expect(valueChips[2].nativeElement.innerText.trim()).toBe('3.3');
});
it('should render string for multivalue properties when chips are disabled', async () => {
@@ -818,4 +822,28 @@ describe('CardViewTextItemComponent', () => {
expect(component.property.value).toBe(expectedNumber.toString());
});
});
describe('events', () => {
it('should perform undo action by clearing the text that we enter in the text field using undo keyboard shortcut', async () => {
checkCtrlZActions(true, 'KeyZ', false, 'UNDO TEST', true);
});
it('should not perform undo action when we hit any other shortcut instead of using undo keyboard shortcut', async () => {
checkCtrlZActions(true, 'KeyH', false, 'DO NOT DO UNDO', false);
});
it('should not perform undo action when control key is not pressed even if the keycode is correct', async () => {
checkCtrlZActions(false, 'KeyZ', false, 'DO NOT DO UNDO', false);
});
it('should perform undo action in MacOS by clearing the text that we enter in the text field using undo keyboard shortcut', async () => {
checkCtrlZActions(false, 'KeyZ', true, 'UNDO TEST FOR MACOS', true);
});
});
});

View File

@@ -192,6 +192,12 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
}
}
undoText(event: KeyboardEvent) {
if ((event.ctrlKey || event.metaKey) && event.code === 'KeyZ' && this.textInput.value) {
this.textInput.setValue('');
}
}
ngOnDestroy() {
this.onDestroy$.next(true);
this.onDestroy$.complete();