From 4ce2d9a8b0d8f00278cdd2c37090196ea950a607 Mon Sep 17 00:00:00 2001 From: "swapnil.verma" Date: Thu, 5 Oct 2023 13:04:33 +0530 Subject: [PATCH] [ACS-4130] Added unit tests for new autocomplete functionality --- .../folder-rules/src/mock/conditions.mock.ts | 4 +- .../rule-simple-condition.ui-component.html | 3 + ...rule-simple-condition.ui-component.spec.ts | 169 +++++++++++++++++- 3 files changed, 171 insertions(+), 5 deletions(-) diff --git a/projects/aca-content/folder-rules/src/mock/conditions.mock.ts b/projects/aca-content/folder-rules/src/mock/conditions.mock.ts index e471e49d27..73276f519e 100644 --- a/projects/aca-content/folder-rules/src/mock/conditions.mock.ts +++ b/projects/aca-content/folder-rules/src/mock/conditions.mock.ts @@ -37,8 +37,8 @@ export const mimeTypeMock: RuleSimpleCondition = { parameter: '' }; -export const categoryMock: RuleSimpleCondition = { - field: 'category', +export const tagMock: RuleSimpleCondition = { + field: 'tag', comparator: 'equals', parameter: '' }; diff --git a/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.html b/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.html index e8f4b54c3c..918311c79e 100644 --- a/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.html +++ b/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.html @@ -33,15 +33,18 @@ matInput [matAutocomplete]="auto" formControlName="parameter" + data-automation-id="auto-complete-input-field" /> diff --git a/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.spec.ts b/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.spec.ts index 5185027c09..3ca42f3610 100644 --- a/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.spec.ts +++ b/projects/aca-content/folder-rules/src/rule-details/conditions/rule-simple-condition.ui-component.spec.ts @@ -22,16 +22,89 @@ * from Hyland Software. If not, see . */ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, discardPeriodicTasks, fakeAsync, TestBed, tick } from '@angular/core/testing'; import { RuleSimpleConditionUiComponent } from './rule-simple-condition.ui-component'; import { CoreTestingModule } from '@alfresco/adf-core'; import { By } from '@angular/platform-browser'; import { DebugElement } from '@angular/core'; -import { categoryMock, mimeTypeMock, simpleConditionUnknownFieldMock } from '../../mock/conditions.mock'; +import { tagMock, mimeTypeMock, simpleConditionUnknownFieldMock } from '../../mock/conditions.mock'; import { MimeType } from './rule-mime-types'; +import { CategoryService } from '@alfresco/adf-content-services'; +import { of } from 'rxjs'; +import { RuleSimpleCondition } from '../../model/rule-simple-condition.model'; +import { delay } from 'rxjs/operators'; describe('RuleSimpleConditionUiComponent', () => { let fixture: ComponentFixture; + let categoryService: CategoryService; + + const savedCategoryMock: RuleSimpleCondition = { + field: 'category', + comparator: 'equals', + parameter: 'a-fake-category-id' + }; + + const fakeCategory = { + entry: { + path: '/a/fake/category/path', + hasChildren: false, + name: 'FakeCategory', + id: 'fake-category-id-1' + } + }; + + const fakeCategoriesList = { + list: { + pagination: { + count: 3, + hasMoreItems: false, + totalItems: 0, + skipCount: 0, + maxItems: 25 + }, + entries: [ + { + entry: { + path: { + name: '/a/fake/category/path/1' + }, + hasChildren: false, + name: 'FakeCategory1', + id: 'fake-category-id-1', + nodeType: 'cm:category', + isFile: false, + isFolder: false + } + }, + { + entry: { + path: { + name: '/a/fake/category/path/2' + }, + hasChildren: false, + name: 'FakeCategory2', + id: 'fake-category-id-2', + nodeType: 'cm:category', + isFile: false, + isFolder: false + } + }, + { + entry: { + path: { + name: '/a/fake/category/path/3' + }, + hasChildren: false, + name: 'FakeCategory3', + id: 'fake-category-id-3', + nodeType: 'cm:category', + isFile: false, + isFolder: false + } + } + ] + } + }; const getByDataAutomationId = (dataAutomationId: string): DebugElement => fixture.debugElement.query(By.css(`[data-automation-id="${dataAutomationId}"]`)); @@ -45,12 +118,20 @@ describe('RuleSimpleConditionUiComponent', () => { fixture.detectChanges(); }; + const setValueInInputField = (inputFieldDataAutomationId, value) => { + const inputField = fixture.debugElement.query(By.css(`[data-automation-id="${inputFieldDataAutomationId}"]`)).nativeElement; + inputField.value = value; + inputField.dispatchEvent(new Event('input')); + fixture.detectChanges(); + }; + beforeEach(() => { TestBed.configureTestingModule({ imports: [CoreTestingModule, RuleSimpleConditionUiComponent] }); fixture = TestBed.createComponent(RuleSimpleConditionUiComponent); + categoryService = TestBed.inject(CategoryService); }); it('should default the field to the name, the comparator to equals and the value empty', () => { @@ -87,6 +168,20 @@ describe('RuleSimpleConditionUiComponent', () => { expect(getComputedStyle(comparatorFormField).display).toBe('none'); }); + it('should hide the comparator select box if the type of the field is autoComplete', () => { + const autoCompleteField = 'category'; + fixture.detectChanges(); + const comparatorFormField = getByDataAutomationId('comparator-form-field').nativeElement; + + expect(fixture.componentInstance.isComparatorHidden).toBeFalsy(); + expect(getComputedStyle(comparatorFormField).display).not.toBe('none'); + + changeMatSelectValue('field-select', autoCompleteField); + + expect(fixture.componentInstance.isComparatorHidden).toBeTruthy(); + expect(getComputedStyle(comparatorFormField).display).toBe('none'); + }); + it('should set the comparator to equals if the field is set to a type with different comparators', () => { const onChangeFieldSpy = spyOn(fixture.componentInstance, 'onChangeField').and.callThrough(); fixture.detectChanges(); @@ -165,9 +260,77 @@ describe('RuleSimpleConditionUiComponent', () => { expect(getByDataAutomationId('simple-condition-value-select')).toBeTruthy(); - fixture.componentInstance.writeValue(categoryMock); + fixture.componentInstance.writeValue(tagMock); fixture.detectChanges(); expect(getByDataAutomationId('value-input').nativeElement.value).toBe(''); }); + + it('should provide autocomplete option when category is selected', () => { + fixture.detectChanges(); + changeMatSelectValue('field-select', 'category'); + + expect(getByDataAutomationId('auto-complete-input-field')).toBeTruthy(); + expect(fixture.componentInstance.form.get('parameter').value).toEqual(''); + }); + + it('should fetch category list when category option is selected', fakeAsync(() => { + spyOn(categoryService, 'searchCategories').and.returnValue(of(fakeCategoriesList)); + + fixture.detectChanges(); + changeMatSelectValue('field-select', 'category'); + tick(500); + + expect(categoryService.searchCategories).toHaveBeenCalledWith(''); + })); + + it('should fetch new category list with user input when user types into parameter field after category option is select', fakeAsync(() => { + const categoryValue = 'a new category'; + spyOn(categoryService, 'searchCategories').and.returnValue(of(fakeCategoriesList)); + + fixture.detectChanges(); + changeMatSelectValue('field-select', 'category'); + tick(500); + expect(categoryService.searchCategories).toHaveBeenCalledWith(''); + + setValueInInputField('auto-complete-input-field', categoryValue); + tick(500); + expect(categoryService.searchCategories).toHaveBeenCalledWith(categoryValue); + })); + + it('should fetch category details when a saved rule with category condition is edited', () => { + spyOn(categoryService, 'getCategory').and.returnValue(of(fakeCategory)); + + fixture.componentInstance.writeValue(savedCategoryMock); + fixture.detectChanges(); + + expect(categoryService.getCategory).toHaveBeenCalledWith(savedCategoryMock.parameter, { include: ['path'] }); + }); + + it('should show loading spinner while autocomplete options are fetched, and then remove it once it is received', fakeAsync(() => { + spyOn(categoryService, 'searchCategories').and.returnValue(of(fakeCategoriesList).pipe(delay(1000))); + fixture.detectChanges(); + changeMatSelectValue('field-select', 'category'); + tick(500); + getByDataAutomationId('auto-complete-input-field')?.nativeElement?.click(); + let loadingSpinner = getByDataAutomationId('autocomplete-loading-spinner'); + expect(loadingSpinner).not.toBeNull(); + tick(1000); + fixture.detectChanges(); + loadingSpinner = getByDataAutomationId('autocomplete-loading-spinner'); + expect(loadingSpinner).toBeNull(); + discardPeriodicTasks(); + })); + + it('should display correct label for category when user selects a category from autocomplete dropdown', fakeAsync(() => { + spyOn(categoryService, 'searchCategories').and.returnValue(of(fakeCategoriesList)); + fixture.detectChanges(); + changeMatSelectValue('field-select', 'category'); + tick(500); + getByDataAutomationId('auto-complete-input-field')?.nativeElement?.click(); + changeMatSelectValue('folder-rule-autocomplete', fakeCategoriesList.list.entries[0].entry.id); + const displayValue = getByDataAutomationId('auto-complete-input-field')?.nativeElement?.value; + expect(displayValue).toBe('category/path/1/FakeCategory1'); + discardPeriodicTasks(); + })); });