mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
Fixed unit tests
This commit is contained in:
@@ -25,29 +25,39 @@ import { CoreTestingModule } from '@alfresco/adf-core';
|
||||
import { DebugElement, SimpleChange } from '@angular/core';
|
||||
import { IdentityGroupService } from '../services/identity-group.service';
|
||||
import { mockFoodGroups, mockMeatChicken, mockVegetableAubergine } from '../mock/group-cloud.mock';
|
||||
import { HarnessLoader } from '@angular/cdk/testing';
|
||||
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
|
||||
import { MatChipHarness, MatChipListboxHarness } from '@angular/material/chips/testing';
|
||||
import { MatIconHarness } from '@angular/material/icon/testing';
|
||||
import { MatInputHarness } from '@angular/material/input/testing';
|
||||
|
||||
describe('GroupCloudComponent', () => {
|
||||
let loader: HarnessLoader;
|
||||
let component: GroupCloudComponent;
|
||||
let fixture: ComponentFixture<GroupCloudComponent>;
|
||||
let element: HTMLElement;
|
||||
let identityGroupService: IdentityGroupService;
|
||||
let findGroupsByNameSpy: jasmine.Spy;
|
||||
|
||||
// eslint-disable-next-line prefer-arrow/prefer-arrow-functions
|
||||
/**
|
||||
* get the native element for the selector
|
||||
*
|
||||
* @param selector selector
|
||||
* @returns native element
|
||||
*/
|
||||
function getElement<T = HTMLElement>(selector: string): T {
|
||||
return fixture.nativeElement.querySelector(selector);
|
||||
}
|
||||
|
||||
/**
|
||||
* search group by value
|
||||
*
|
||||
* @param value element input value
|
||||
*/
|
||||
async function searchGroup(value: string) {
|
||||
const input = await loader.getHarness(MatInputHarness);
|
||||
await input.focus();
|
||||
await input.setValue(value);
|
||||
const input = getElement<HTMLInputElement>('input');
|
||||
input.focus();
|
||||
input.value = value;
|
||||
input.dispatchEvent(new Event('keyup'));
|
||||
input.dispatchEvent(new Event('input'));
|
||||
|
||||
await fixture.whenStable();
|
||||
fixture.detectChanges();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -56,10 +66,17 @@ describe('GroupCloudComponent', () => {
|
||||
* @param value value
|
||||
*/
|
||||
async function searchGroupsAndBlur(value: string) {
|
||||
const input = await loader.getHarness(MatInputHarness);
|
||||
await input.focus();
|
||||
await input.setValue(value);
|
||||
await input.blur();
|
||||
const input = getElement<HTMLInputElement>('input');
|
||||
input.focus();
|
||||
input.value = value;
|
||||
input.dispatchEvent(new Event('keyup'));
|
||||
input.dispatchEvent(new Event('input'));
|
||||
|
||||
await fixture.whenStable();
|
||||
fixture.detectChanges();
|
||||
|
||||
input.blur();
|
||||
fixture.detectChanges();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -73,14 +90,18 @@ describe('GroupCloudComponent', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({
|
||||
imports: [CoreTestingModule, ProcessServiceCloudTestingModule, GroupCloudModule]
|
||||
imports: [
|
||||
TranslateModule.forRoot(),
|
||||
CoreTestingModule,
|
||||
ProcessServiceCloudTestingModule,
|
||||
GroupCloudModule
|
||||
]
|
||||
});
|
||||
fixture = TestBed.createComponent(GroupCloudComponent);
|
||||
component = fixture.componentInstance;
|
||||
element = fixture.nativeElement;
|
||||
|
||||
identityGroupService = TestBed.inject(IdentityGroupService);
|
||||
loader = TestbedHarnessEnvironment.loader(fixture);
|
||||
});
|
||||
|
||||
it('should populate placeholder when title is present', () => {
|
||||
@@ -93,6 +114,7 @@ describe('GroupCloudComponent', () => {
|
||||
});
|
||||
|
||||
describe('Search group', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
fixture.detectChanges();
|
||||
findGroupsByNameSpy = spyOn(identityGroupService, 'search').and.returnValue(of(mockFoodGroups));
|
||||
@@ -185,19 +207,19 @@ describe('GroupCloudComponent', () => {
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should not pre-select any group when preSelectGroups is empty - single mode', async () => {
|
||||
it('should not pre-select any group when preSelectGroups is empty - single mode', () => {
|
||||
component.mode = 'single';
|
||||
fixture.detectChanges();
|
||||
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
const chips = fixture.debugElement.queryAll(By.css('mat-chip'));
|
||||
expect(chips.length).toEqual(0);
|
||||
});
|
||||
|
||||
it('should not pre-select any group when preSelectGroups is empty - multiple mode', async () => {
|
||||
it('should not pre-select any group when preSelectGroups is empty - multiple mode', () => {
|
||||
component.mode = 'multiple';
|
||||
fixture.detectChanges();
|
||||
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
const chips = fixture.debugElement.queryAll(By.css('mat-chip'));
|
||||
expect(chips.length).toEqual(0);
|
||||
});
|
||||
});
|
||||
@@ -212,11 +234,10 @@ describe('GroupCloudComponent', () => {
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should show only one mat chip with the first preSelectedGroup', async () => {
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
it('should show only one mat chip with the first preSelectedGroup', () => {
|
||||
const chips = fixture.debugElement.queryAll(By.css('mat-chip-row'));
|
||||
expect(chips.length).toEqual(1);
|
||||
const testId = await (await chips[0].host()).getAttribute('data-automation-id');
|
||||
expect(testId).toEqual(`adf-cloud-group-chip-${mockVegetableAubergine.name}`);
|
||||
expect(chips[0].attributes['data-automation-id']).toEqual(`adf-cloud-group-chip-${mockVegetableAubergine.name}`);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -230,13 +251,12 @@ describe('GroupCloudComponent', () => {
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should render all preselected groups', async () => {
|
||||
it('should render all preselected groups', () => {
|
||||
component.mode = 'multiple';
|
||||
fixture.detectChanges();
|
||||
component.ngOnChanges({ preSelectGroups: change });
|
||||
fixture.detectChanges();
|
||||
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
const chips = fixture.debugElement.queryAll(By.css('mat-chip-row'));
|
||||
expect(chips.length).toBe(2);
|
||||
});
|
||||
|
||||
@@ -245,40 +265,42 @@ describe('GroupCloudComponent', () => {
|
||||
const changedGroupsEmitterSpy = spyOn(component.changedGroups, 'emit');
|
||||
component.mode = 'multiple';
|
||||
|
||||
const chip = await loader.getHarness(MatChipHarness);
|
||||
const icon = await chip.getHarness(MatIconHarness);
|
||||
await (await icon.host()).click();
|
||||
const removeIcon = fixture.debugElement.query(By.css('mat-chip-row mat-icon'));
|
||||
removeIcon.nativeElement.click();
|
||||
fixture.detectChanges();
|
||||
|
||||
await fixture.whenStable();
|
||||
expect(removeGroupEmitterSpy).toHaveBeenCalledWith(mockVegetableAubergine);
|
||||
expect(changedGroupsEmitterSpy).toHaveBeenCalledWith([mockMeatChicken]);
|
||||
expect(
|
||||
component.selectedGroups.indexOf({
|
||||
id: mockMeatChicken.id,
|
||||
name: mockMeatChicken.name
|
||||
})
|
||||
).toEqual(-1);
|
||||
expect(component.selectedGroups.indexOf({
|
||||
id: mockMeatChicken.id,
|
||||
name: mockMeatChicken.name
|
||||
})).toEqual(-1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Multiple Mode with read-only', () => {
|
||||
|
||||
it('Should not show remove icon for pre-selected groups if readonly property set to true', async () => {
|
||||
component.mode = 'multiple';
|
||||
component.preSelectGroups = [{ id: mockVegetableAubergine.id, name: mockVegetableAubergine.name, readonly: true }, mockMeatChicken];
|
||||
component.preSelectGroups = [
|
||||
{ id: mockVegetableAubergine.id, name: mockVegetableAubergine.name, readonly: true },
|
||||
mockMeatChicken
|
||||
];
|
||||
const changes = new SimpleChange(null, [{ name: mockVegetableAubergine.name }], false);
|
||||
component.ngOnChanges({ preSelectGroups: changes });
|
||||
fixture.detectChanges();
|
||||
|
||||
await fixture.whenStable();
|
||||
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
expect(chips.length).toBe(2);
|
||||
const chipList = fixture.nativeElement.querySelectorAll('mat-chip-grid mat-chip-row');
|
||||
|
||||
const removeIconAubergine = element.querySelector(
|
||||
`[data-automation-id="adf-cloud-group-chip-remove-icon-${mockVegetableAubergine.name}"]`
|
||||
);
|
||||
expect(chipList.length).toBe(2);
|
||||
const removeIconAubergine = getElement(`[data-automation-id="adf-cloud-group-chip-remove-icon-${mockVegetableAubergine.name}"]`);
|
||||
expect(removeIconAubergine).toBeNull();
|
||||
const removeIconPepper = element.querySelector(`[data-automation-id="adf-cloud-group-chip-remove-icon-${mockMeatChicken.name}"]`);
|
||||
const removeIconPepper = getElement(`[data-automation-id="adf-cloud-group-chip-remove-icon-${mockMeatChicken.name}"]`);
|
||||
expect(removeIconPepper).not.toBeNull();
|
||||
|
||||
});
|
||||
|
||||
it('Should be able to remove preselected groups if readonly property set to false', async () => {
|
||||
@@ -291,26 +313,28 @@ describe('GroupCloudComponent', () => {
|
||||
const removeGroupSpy = spyOn(component.removeGroup, 'emit');
|
||||
fixture.detectChanges();
|
||||
|
||||
let chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
expect(chips.length).toBe(2);
|
||||
fixture.whenStable();
|
||||
fixture.detectChanges();
|
||||
|
||||
const removeIcon = element.querySelector<HTMLElement>(`[data-automation-id="adf-cloud-group-chip-remove-icon-${mockMeatChicken.name}"]`);
|
||||
const chipList = fixture.nativeElement.querySelectorAll('mat-chip-grid mat-chip-row');
|
||||
expect(chipList.length).toBe(2);
|
||||
|
||||
const removeIcon = getElement(`[data-automation-id="adf-cloud-group-chip-remove-icon-${mockMeatChicken.name}"]`);
|
||||
removeIcon.click();
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(removeGroupSpy).toHaveBeenCalled();
|
||||
|
||||
chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
expect(chips.length).toBe(1);
|
||||
expect(fixture.nativeElement.querySelectorAll('mat-chip-grid mat-chip-row').length).toBe(1);
|
||||
});
|
||||
|
||||
it('should removeDuplicatedGroups return only unique groups', () => {
|
||||
const duplicatedGroups = [mockMeatChicken, mockMeatChicken];
|
||||
const duplicatedGroups = [ mockMeatChicken, mockMeatChicken];
|
||||
expect(component.removeDuplicatedGroups(duplicatedGroups)).toEqual([mockMeatChicken]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Preselected groups and validation enabled', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
spyOn(identityGroupService, 'search').and.throwError('Invalid group');
|
||||
component.validate = true;
|
||||
@@ -339,7 +363,7 @@ describe('GroupCloudComponent', () => {
|
||||
describe('Component readonly mode', () => {
|
||||
const change = new SimpleChange(null, mockFoodGroups, false);
|
||||
|
||||
it('should chip list be disabled and show one single chip - single mode', async () => {
|
||||
it('should chip list be disabled and show one single chip - single mode', () => {
|
||||
component.mode = 'single';
|
||||
component.readOnly = true;
|
||||
component.preSelectGroups = mockFoodGroups;
|
||||
@@ -347,14 +371,16 @@ describe('GroupCloudComponent', () => {
|
||||
|
||||
fixture.detectChanges();
|
||||
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
expect(chips.length).toBe(1);
|
||||
const chips = fixture.debugElement.queryAll(By.css('mat-chip-row'));
|
||||
const chipList = getElement('mat-chip-grid');
|
||||
|
||||
const chipList = await loader.getHarness(MatChipListboxHarness);
|
||||
expect(await chipList.isDisabled()).toBe(true);
|
||||
expect(chips).toBeDefined();
|
||||
expect(chipList).toBeDefined();
|
||||
expect(chips.length).toBe(1);
|
||||
expect(chipList.attributes['ng-reflect-disabled']?.value).toEqual('true');
|
||||
});
|
||||
|
||||
it('should chip list be disabled and show all the chips - multiple mode', async () => {
|
||||
it('should chip list be disabled and show all the chips - multiple mode', () => {
|
||||
component.mode = 'multiple';
|
||||
component.readOnly = true;
|
||||
component.preSelectGroups = mockFoodGroups;
|
||||
@@ -362,11 +388,14 @@ describe('GroupCloudComponent', () => {
|
||||
|
||||
fixture.detectChanges();
|
||||
|
||||
const chips = await loader.getAllHarnesses(MatChipHarness);
|
||||
expect(chips.length).toBe(2);
|
||||
const chips = fixture.debugElement.queryAll(By.css('mat-chip-row'));
|
||||
const chipList = getElement('mat-chip-grid');
|
||||
|
||||
const chipList = await loader.getHarness(MatChipListboxHarness);
|
||||
expect(await chipList.isDisabled()).toBe(true);
|
||||
expect(chips).toBeDefined();
|
||||
expect(chipList).toBeDefined();
|
||||
expect(chips.length).toBe(2);
|
||||
expect(chipList.attributes['ng-reflect-disabled']?.value).toEqual('true');
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
Reference in New Issue
Block a user