Fixed unit tests

This commit is contained in:
Vito Albano
2023-11-22 21:07:53 +00:00
committed by VitoAlbano
parent 82db90b702
commit 2bc209c98d
14 changed files with 443 additions and 395 deletions

View File

@@ -158,9 +158,7 @@ describe('UploadService', () => {
service.uploadFilesInTheQueue(emitter);
const request = jasmine.Ajax.requests.mostRecent();
expect(request.url).toBe(
'http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true&include=allowableOperations'
);
expect(request.url).toContain('/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true&include=allowableOperations');
expect(request.method).toBe('POST');
jasmine.Ajax.requests.mostRecent().respondWith({
@@ -181,9 +179,8 @@ describe('UploadService', () => {
const fileFake = new FileModel({ name: 'fake-name', size: 10 } as File, { parentId: '-root-' });
service.addToQueue(fileFake);
service.uploadFilesInTheQueue(null, emitter);
expect(jasmine.Ajax.requests.mostRecent().url).toBe(
'http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true&include=allowableOperations'
);
expect(jasmine.Ajax.requests.mostRecent().url)
.toContain('ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true&include=allowableOperations');
jasmine.Ajax.requests.mostRecent().respondWith({
status: 404,
@@ -217,9 +214,7 @@ describe('UploadService', () => {
emitterDisposable.unsubscribe();
const deleteRequest = jasmine.Ajax.requests.mostRecent();
expect(deleteRequest.url).toBe(
'http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/myNodeId?permanent=true'
);
expect(deleteRequest.url).toContain('ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/myNodeId?permanent=true');
expect(deleteRequest.method).toBe('DELETE');
jasmine.Ajax.requests.mostRecent().respondWith({
@@ -238,9 +233,7 @@ describe('UploadService', () => {
service.cancelUpload(...file);
const request = jasmine.Ajax.requests.mostRecent();
expect(request.url).toBe(
'http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true&include=allowableOperations'
);
expect(request.url).toContain('ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/-root-/children?autoRename=true&include=allowableOperations');
expect(request.method).toBe('POST');
jasmine.Ajax.requests.mostRecent().respondWith({
@@ -262,7 +255,7 @@ describe('UploadService', () => {
emitterDisposable.unsubscribe();
const deleteRequest = jasmine.Ajax.requests.mostRecent();
expect(deleteRequest.url).toBe('http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/myNodeId/versions/1.1');
expect(deleteRequest.url).toContain('ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/myNodeId/versions/1.1');
expect(deleteRequest.method).toBe('DELETE');
jasmine.Ajax.requests.mostRecent().respondWith({
@@ -281,9 +274,7 @@ describe('UploadService', () => {
service.cancelUpload(...file);
const request = jasmine.Ajax.requests.mostRecent();
expect(request.url).toBe(
'http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/fakeId/content?include=allowableOperations'
);
expect(request.url).toContain('ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/fakeId/content?include=allowableOperations');
expect(request.method).toBe('PUT');
jasmine.Ajax.requests.mostRecent().respondWith({
@@ -338,9 +329,7 @@ describe('UploadService', () => {
service.uploadFilesInTheQueue(emitter);
const request = jasmine.Ajax.requests.mostRecent();
expect(request.url).toBe(
'http://localhost:9876/ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/123/children?autoRename=true&include=allowableOperations'
);
expect(request.url).toContain('ecm/alfresco/api/-default-/public/alfresco/versions/1/nodes/123/children?autoRename=true&include=allowableOperations');
expect(request.method).toBe('POST');
jasmine.Ajax.requests.mostRecent().respondWith({

View File

@@ -20,12 +20,23 @@ import { By } from '@angular/platform-browser';
import { Node } from '@alfresco/js-api';
import { ContentMetadataCardComponent } from './content-metadata-card.component';
import { ContentMetadataComponent } from '../content-metadata/content-metadata.component';
import { ContentTestingModule } from '../../../testing/content.testing.module';
import { SimpleChange } from '@angular/core';
import { APP_INITIALIZER, SimpleChange } from '@angular/core';
import { TranslateModule } from '@ngx-translate/core';
import { NodeAspectService } from '../../../aspect-list/services/node-aspect.service';
import { ContentMetadataService } from '../../services/content-metadata.service';
import { AllowableOperationsEnum } from '../../../common/models/allowable-operations.enum';
import { of } from 'rxjs';
import { AlfrescoApiService, AlfrescoApiServiceMock, AuthModule, PipeModule, TranslationMock, TranslationService } from '@alfresco/adf-core';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { HttpClientModule } from '@angular/common/http';
import { versionCompatibilityFactory } from '../../../version-compatibility/version-compatibility-factory';
import { VersionCompatibilityService } from '../../../version-compatibility';
import { MatDialogModule } from '@angular/material/dialog';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { CategoryService } from '../../../category';
import { TagService } from '../../../tag';
import { PropertyDescriptorsService } from '../../public-api';
describe('ContentMetadataCardComponent', () => {
let component: ContentMetadataCardComponent;
@@ -34,15 +45,40 @@ describe('ContentMetadataCardComponent', () => {
let node: Node;
const preset = 'custom-preset';
let nodeAspectService: NodeAspectService = null;
let tagService: TagService = null;
let categoryService: CategoryService = null;
let propertyDescriptorsService: PropertyDescriptorsService = null;
const getToggleEditButton = () => fixture.debugElement.query(By.css('[data-automation-id="meta-data-card-toggle-edit"]'));
beforeEach(() => {
TestBed.configureTestingModule({
imports: [ContentTestingModule]
imports: [
TranslateModule.forRoot(),
NoopAnimationsModule,
AuthModule.forRoot({ useHash: true }),
HttpClientModule,
MatDialogModule,
PipeModule,
MatSnackBarModule,
MatTooltipModule
],
providers: [
{ provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock },
{ provide: TranslationService, useClass: TranslationMock },
{
provide: APP_INITIALIZER,
useFactory: versionCompatibilityFactory,
deps: [ VersionCompatibilityService ],
multi: true
}
]
});
fixture = TestBed.createComponent(ContentMetadataCardComponent);
contentMetadataService = TestBed.inject(ContentMetadataService);
tagService = TestBed.inject(TagService);
categoryService = TestBed.inject(CategoryService);
propertyDescriptorsService = TestBed.inject(PropertyDescriptorsService);
component = fixture.componentInstance;
node = {
aspectNames: [],
@@ -59,6 +95,9 @@ describe('ContentMetadataCardComponent', () => {
component.editAspectSupported = true;
nodeAspectService = TestBed.inject(NodeAspectService);
spyOn(contentMetadataService, 'getContentTypeProperty').and.returnValue(of([]));
spyOn(tagService, 'getTagsByNodeId').and.returnValue(of());
spyOn(categoryService, 'getCategoryLinksForNode').and.returnValue(of());
spyOn(propertyDescriptorsService, 'load').and.returnValue(of());
fixture.detectChanges();
});

View File

@@ -36,7 +36,11 @@ import {
TagsCreatorMode,
TagService
} from '@alfresco/adf-content-services';
import { MatExpansionPanel } from '@angular/material/expansion';
import { HttpClientModule } from '@angular/common/http';
import { MatDialogModule } from '@angular/material/dialog';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatTooltipModule } from '@angular/material/tooltip';
describe('ContentMetadataComponent', () => {
let component: ContentMetadataComponent;
@@ -158,8 +162,16 @@ describe('ContentMetadataComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [ContentTestingModule],
imports: [TranslateModule.forRoot(),
NoopAnimationsModule,
AuthModule.forRoot({ useHash: true }),
HttpClientModule,
MatDialogModule,
MatSnackBarModule,
MatTooltipModule,
PipeModule],
providers: [
{ provide: TranslationService, useClass: TranslationMock },
{
provide: TagService,
useValue: {
@@ -350,6 +362,8 @@ describe('ContentMetadataComponent', () => {
it('should throw error on unsuccessful save', fakeAsync(() => {
component.readOnly = false;
const property = { key: 'properties.property-key', value: 'original-value' } as CardViewBaseItemModel;
spyOn(nodesApiService, 'updateNode').and.returnValue(throwError(new Error('My bad')));
updateService.update(property, 'updated-value');
tick(600);
@@ -359,7 +373,6 @@ describe('ContentMetadataComponent', () => {
sub.unsubscribe();
});
spyOn(nodesApiService, 'updateNode').and.returnValue(throwError(new Error('My bad')));
fixture.detectChanges();
toggleEditModeForGeneralInfo();

View File

@@ -33,15 +33,17 @@ describe('PropertyDescriptorLoaderService', () => {
classesApi = service['classesApi'];
});
it('should load the groups passed by paramter', () => {
spyOn(classesApi, 'getClass');
service.load(['exif:exif', 'cm:content', 'custom:custom']).subscribe(() => {});
it('should load the groups passed by paramter', (done) => {
spyOn(classesApi, 'getClass').and.returnValue(Promise.resolve({}));
service.load(['exif:exif', 'cm:content', 'custom:custom'])
.subscribe(() => {
expect(classesApi.getClass).toHaveBeenCalledTimes(3);
expect(classesApi.getClass).toHaveBeenCalledWith('exif_exif');
expect(classesApi.getClass).toHaveBeenCalledWith('cm_content');
expect(classesApi.getClass).toHaveBeenCalledWith('custom_custom');
done();
});
});
it('should merge the forked values', (done) => {

View File

@@ -24,6 +24,7 @@ import { By } from '@angular/platform-browser';
import { FileModel } from '../common/models/file.model';
import { FileUploadEvent } from '../common/events/file.event';
import { UploadService } from '../common/services/upload.service';
import { of } from 'rxjs';
import { ContentTestingModule } from '../testing/content.testing.module';
import { DocumentListService } from '../document-list/services/document-list.service';
@@ -60,7 +61,12 @@ describe('ContentNodeSelectorComponent', () => {
};
TestBed.configureTestingModule({
imports: [ContentTestingModule, MatDialogModule, UploadModule],
imports: [
TranslateModule.forRoot(),
ContentTestingModule,
MatDialogModule,
UploadModule
],
providers: [
{ provide: MAT_DIALOG_DATA, useValue: data },
{
@@ -116,8 +122,6 @@ describe('ContentNodeSelectorComponent', () => {
fixture.destroy();
});
const getTabInfoButton = () => fixture.debugElement.query(By.css('[data-automation-id="adf-content-node-selector-disabled-tab-info-icon"]'));
const enableLocalUpload = () => {
component.data.showLocalUploadButton = true;
component.hasAllowableOperations = true;
@@ -133,6 +137,7 @@ describe('ContentNodeSelectorComponent', () => {
};
describe('Data injecting with the "Material dialog way"', () => {
it('should show the INJECTED title', () => {
const titleElement = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-title"]'));
expect(titleElement).not.toBeNull();
@@ -148,105 +153,101 @@ describe('ContentNodeSelectorComponent', () => {
it('should pass through the injected currentFolderId to the documentList', () => {
const documentList = fixture.debugElement.query(By.directive(DocumentListComponent));
expect(documentList).not.toBeNull();
expect(documentList).not.toBeNull('Document list should be shown');
expect(documentList.componentInstance.currentFolderId).toBe('cat-girl-nuku-nuku');
});
it('should pass through the injected rowFilter to the documentList', () => {
const documentList = fixture.debugElement.query(By.directive(DocumentListComponent));
expect(documentList).not.toBeNull();
expect(
documentList.componentInstance.rowFilter({
expect(documentList).not.toBeNull('Document list should be shown');
expect(documentList.componentInstance.rowFilter({
node: {
entry: new Node({
name: 'impossible-name',
id: 'name'
})
}
})
).toBe(
data.rowFilter({
}))
.toBe(data.rowFilter({
node: {
entry: new Node({
name: 'impossible-name',
id: 'name'
})
}
})
);
}));
});
it('should pass through the injected imageResolver to the documentList', () => {
const documentList = fixture.debugElement.query(By.directive(DocumentListComponent));
expect(documentList).not.toBeNull();
expect(documentList).not.toBeNull('Document list should be shown');
expect(documentList.componentInstance.imageResolver).toBe(data.imageResolver);
});
});
describe('Cancel button', () => {
const getCancelButton = () => fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-cancel"]'));
it('should not be shown if dialogRef is NOT injected', () => {
const closeButton = fixture.debugElement.query(By.css('[content-node-selector-actions-cancel]'));
expect(closeButton).toBeNull();
});
it('should close the dialog', () => {
let cancelButton = getCancelButton();
let cancelButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-cancel"]'));
cancelButton.triggerEventHandler('click', {});
expect(dialog.close).toHaveBeenCalled();
fixture.detectChanges();
cancelButton = getCancelButton();
cancelButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-cancel"]'));
expect(cancelButton).not.toBeNull();
});
});
describe('Action button for the chosen node', () => {
const getActionButton = () =>
fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-choose"]'))?.nativeElement as HTMLButtonElement;
it('should be disabled by default', () => {
fixture.detectChanges();
const actionButton = getActionButton();
expect(actionButton.disabled).toBeTruthy();
const actionButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-choose"]'));
expect(actionButton.nativeElement.disabled).toBeTruthy();
});
it('should be enabled when a node is chosen', () => {
component.onSelect([new Node({ id: 'fake' })]);
fixture.detectChanges();
const actionButton = getActionButton();
expect(actionButton.disabled).toBeFalsy();
const actionButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-choose"]'));
expect(actionButton.nativeElement.disabled).toBeFalsy();
});
it('should be disabled when no node chosen', () => {
component.onSelect([new Node({ id: 'fake' })]);
fixture.detectChanges();
const actionButtonWithNodeSelected = getActionButton();
expect(actionButtonWithNodeSelected.disabled).toBe(false);
const actionButtonWithNodeSelected = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-choose"]'));
expect(actionButtonWithNodeSelected.nativeElement.disabled).toBe(false);
component.onSelect([]);
fixture.detectChanges();
const actionButtonWithoutNodeSelected = getActionButton();
expect(actionButtonWithoutNodeSelected.disabled).toBe(true);
const actionButtonWithoutNodeSelected = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-choose"]'));
expect(actionButtonWithoutNodeSelected.nativeElement.disabled).toBe(true);
});
it('should close the dialog when action button is clicked', () => {
it('should close the dialog when action button is clicked', async () => {
component.onSelect([new Node({ id: 'fake' })]);
fixture.detectChanges();
const actionButton = getActionButton();
actionButton.click();
const actionButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-actions-choose"]'));
await actionButton.nativeElement.click();
expect(dialog.close).toHaveBeenCalled();
});
});
describe('Title', () => {
it('should be updated when a site is chosen', () => {
const fakeSiteTitle = 'My fake site';
const contentNodePanel = fixture.debugElement.query(By.directive(ContentNodeSelectorPanelComponent));
@@ -260,7 +261,6 @@ describe('ContentNodeSelectorComponent', () => {
});
describe('Upload button', () => {
const getUploadButton = () => fixture.debugElement.query(By.css('adf-upload-button button'))?.nativeElement as HTMLButtonElement;
it('Should not be able to upload a file whilst a search is still running', async () => {
enableLocalUpload();
@@ -308,10 +308,10 @@ describe('ContentNodeSelectorComponent', () => {
component.hasAllowableOperations = true;
fixture.detectChanges();
const adfUploadButton = getUploadButton();
const adfUploadButton = fixture.debugElement.query(By.css('adf-upload-button button'));
expect(adfUploadButton).not.toBeNull();
expect(adfUploadButton.disabled).toBe(true);
expect(adfUploadButton.nativeElement.disabled).toBe(true);
});
it('should be able to enable UploadButton if showingSearch set to false', async () => {
@@ -320,10 +320,10 @@ describe('ContentNodeSelectorComponent', () => {
component.hasAllowableOperations = true;
fixture.detectChanges();
const adfUploadButton = getUploadButton();
const adfUploadButton = fixture.debugElement.query(By.css('adf-upload-button button'));
expect(adfUploadButton).not.toBeNull();
expect(adfUploadButton.disabled).toBe(false);
expect(adfUploadButton.nativeElement.disabled).toBe(false);
});
it('should be able to show warning message while searching', async () => {
@@ -333,7 +333,7 @@ describe('ContentNodeSelectorComponent', () => {
await selectTabByIndex(1);
fixture.detectChanges();
const infoMatIcon = getTabInfoButton();
const infoMatIcon = fixture.debugElement.query(By.css('[data-automation-id="adf-content-node-selector-disabled-tab-info-icon"]'));
const iconTooltipMessage = infoMatIcon.attributes['ng-reflect-message'];
const expectedMessage = 'NODE_SELECTOR.UPLOAD_BUTTON_SEARCH_WARNING_MESSAGE';
@@ -359,10 +359,10 @@ describe('ContentNodeSelectorComponent', () => {
component.onTabSelectionChange(1);
fixture.detectChanges();
const adfUploadButton = getUploadButton();
const adfUploadButton = fixture.debugElement.query(By.css('adf-upload-button button'));
expect(adfUploadButton).not.toBeNull();
expect(adfUploadButton.disabled).toBe(true);
expect(adfUploadButton.nativeElement.disabled).toBe(true);
});
it('should be able to enable UploadButton if user has allowable operations', async () => {
@@ -370,10 +370,10 @@ describe('ContentNodeSelectorComponent', () => {
component.hasAllowableOperations = true;
fixture.detectChanges();
const adfUploadButton = getUploadButton();
const adfUploadButton = fixture.debugElement.query(By.css('adf-upload-button button'));
expect(adfUploadButton).not.toBeNull();
expect(adfUploadButton.disabled).toBe(false);
expect(adfUploadButton.nativeElement.disabled).toBe(false);
});
it('should not be able to show warning message if user has allowable operations', async () => {
@@ -393,7 +393,7 @@ describe('ContentNodeSelectorComponent', () => {
await selectTabByIndex(1);
fixture.detectChanges();
const infoMatIcon = getTabInfoButton();
const infoMatIcon = fixture.debugElement.query(By.css('[data-automation-id="adf-content-node-selector-disabled-tab-info-icon"]'));
const iconTooltipMessage = infoMatIcon.attributes['ng-reflect-message'];
const expectedMessage = 'NODE_SELECTOR.UPLOAD_BUTTON_PERMISSION_WARNING_MESSAGE';
@@ -448,8 +448,6 @@ describe('ContentNodeSelectorComponent', () => {
});
describe('Drag and drop area', () => {
const getEmptyList = () => fixture.nativeElement.querySelector('[data-automation-id="adf-empty-list"]');
it('should uploadStarted be false by default', () => {
expect(component.uploadStarted).toBe(false);
});
@@ -467,8 +465,7 @@ describe('ContentNodeSelectorComponent', () => {
fixture.detectChanges();
await fixture.whenRenderingDone();
const emptyListTemplate = getEmptyList();
const emptyListTemplate = fixture.nativeElement.querySelector('[data-automation-id="adf-empty-list"]');
const dragAndDropArea = fixture.debugElement.query(By.css('.adf-upload-drag-area'));
expect(emptyListTemplate).not.toBeNull();
@@ -482,15 +479,13 @@ describe('ContentNodeSelectorComponent', () => {
component.uploadStarted = true;
fixture.detectChanges();
await fixture.whenRenderingDone();
const emptyListTemplate = fixture.nativeElement.querySelector('[data-automation-id="adf-empty-list"]');
const emptyListTemplate = getEmptyList();
expect(emptyListTemplate).toBeNull();
});
});
describe('Selected nodes counter', () => {
const getNodeCounter = () => fixture.debugElement.nativeElement.querySelector('adf-node-counter');
it('should getSelectedCount return 0 by default', () => {
expect(component.getSelectedCount()).toBe(0);
});
@@ -504,19 +499,19 @@ describe('ContentNodeSelectorComponent', () => {
it('should show the counter depending on the action', () => {
component.action = NodeAction.ATTACH;
fixture.detectChanges();
expect(getNodeCounter()).not.toBe(null);
expect(fixture.debugElement.nativeElement.querySelector('adf-node-counter')).not.toBe(null);
component.action = NodeAction.CHOOSE;
fixture.detectChanges();
expect(getNodeCounter()).not.toBe(null);
expect(fixture.debugElement.nativeElement.querySelector('adf-node-counter')).not.toBe(null);
component.action = NodeAction.COPY;
fixture.detectChanges();
expect(getNodeCounter()).toBe(null);
expect(fixture.debugElement.nativeElement.querySelector('adf-node-counter')).toBe(null);
component.action = NodeAction.MOVE;
fixture.detectChanges();
expect(getNodeCounter()).toBe(null);
expect(fixture.debugElement.nativeElement.querySelector('adf-node-counter')).toBe(null);
});
});
});

View File

@@ -15,12 +15,11 @@
* limitations under the License.
*/
import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
import { TypeEntry } from '@alfresco/js-api';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { of, Subject } from 'rxjs';
import { ContentTestingModule } from '../testing/content.testing.module';
import { ContentTypeDialogComponent } from './content-type-dialog.component';
import { ContentTypeService } from './content-type.service';
import { ContentTypeDialogComponentData } from './content-type-metadata.interface';
import { TypeEntry } from '@alfresco/js-api';
import { HarnessLoader } from '@angular/cdk/testing';

View File

@@ -20,11 +20,6 @@ import { SearchFacetChipComponent } from './search-facet-chip.component';
import { ContentTestingModule } from '../../../../testing/content.testing.module';
import { SearchQueryBuilderService } from '../../../services/search-query-builder.service';
import { SearchFilterList } from '../../../models/search-filter-list.model';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatMenuHarness } from '@angular/material/menu/testing';
import { HarnessLoader, TestKey } from '@angular/cdk/testing';
import { MatButtonHarness } from '@angular/material/button/testing';
import { MatIconHarness } from '@angular/material/icon/testing';
describe('SearchFacetChipComponent', () => {
let loader: HarnessLoader;
@@ -43,60 +38,48 @@ describe('SearchFacetChipComponent', () => {
component.field = { type: 'field', label: 'f2', field: 'f2', buckets: new SearchFilterList() };
fixture.detectChanges();
loader = TestbedHarnessEnvironment.loader(fixture);
});
it('should update search query on apply click', async () => {
const menu = await loader.getHarness(MatMenuHarness);
await menu.open();
const applyButton = await menu.getHarness(MatButtonHarness.with({ selector: '#apply-filter-button' }));
await applyButton.click();
const applyButton = fixture.debugElement.query(By.css('#apply-filter-button'));
applyButton.triggerEventHandler('click', {});
expect(queryBuilder.update).toHaveBeenCalled();
});
it('should update search query on cancel click', async () => {
const menu = await loader.getHarness(MatMenuHarness);
await menu.open();
const cancelButton = await menu.getHarness(MatButtonHarness.with({ selector: '#cancel-filter-button' }));
await cancelButton.click();
it('should update search query on cancel click', () => {
const chip = fixture.debugElement.query(By.css('mat-chip-option'));
chip.triggerEventHandler('click', { stopPropagation: () => null });
fixture.detectChanges();
const applyButton = fixture.debugElement.query(By.css('#cancel-filter-button'));
applyButton.triggerEventHandler('click', {});
expect(queryBuilder.update).toHaveBeenCalled();
});
it('should display arrow down icon and not disable the chip when items are loaded', async () => {
it('should display arrow down icon and not disable the chip when items are loaded', () => {
component.field.buckets.items = [{ count: 1, label: 'test', filterQuery: '' }];
const menu = await loader.getHarness(MatMenuHarness);
expect(await menu.isDisabled()).toBe(false);
const icon = await loader.getHarness(MatIconHarness);
expect(await icon.getName()).toBe('keyboard_arrow_down');
fixture.detectChanges();
const chip = fixture.debugElement.query(By.css('mat-chip-option'));
const icon = fixture.debugElement.query(By.css('mat-chip-option mat-icon')).nativeElement.innerText;
expect(chip.classes['mat-chip-option-disabled']).toBeUndefined();
expect(icon).toEqual('keyboard_arrow_down');
});
it('should display arrow up icon when menu is opened', async () => {
it('should display arrow up icon when menu is opened', () => {
component.field.buckets.items = [{ count: 1, label: 'test', filterQuery: '' }];
const menu = await loader.getHarness(MatMenuHarness);
await menu.open();
const icon = await loader.getHarness(MatIconHarness);
expect(await icon.getName()).toBe('keyboard_arrow_up');
component.onMenuOpen();
fixture.detectChanges();
const icon = fixture.debugElement.query(By.css('mat-chip-option mat-icon')).nativeElement.innerText;
expect(icon).toEqual('keyboard_arrow_up');
});
it('should display remove icon and disable facet when no items are loaded', async () => {
const menu = await loader.getHarness(MatMenuHarness);
expect(await menu.isDisabled()).toBe(true);
const icon = await loader.getHarness(MatIconHarness);
expect(await icon.getName()).toBe('remove');
it('should display remove icon and disable facet when no items are loaded', () => {
const chip = fixture.debugElement.query(By.css('mat-chip-option'));
const icon = fixture.debugElement.query(By.css('mat-chip-option mat-icon')).nativeElement.innerText;
expect(chip.classes['mat-mdc-chip-disabled']).toBeTrue();
expect(icon).toEqual('remove');
});
it('should not open context menu when no items are loaded', async () => {
const menu = await loader.getHarness(MatMenuHarness);
await (await menu.host()).sendKeys(TestKey.ENTER);
expect(await menu.isOpen()).toBe(false);
it('should not open context menu when no items are loaded', () => {
spyOn(component.menuTrigger, 'openMenu');
const chip = fixture.debugElement.query(By.css('mat-chip-option')).nativeElement;
chip.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' }));
expect(component.menuTrigger.openMenu).not.toHaveBeenCalled();
});
});

View File

@@ -39,15 +39,8 @@ import {
} from '../../../mock';
import { SearchFacetFiltersService } from '../../services/search-facet-filters.service';
import { SearchFacetFieldComponent } from '../search-facet-field/search-facet-field.component';
import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatExpansionPanelHarness } from '@angular/material/expansion/testing';
import { MatCheckboxHarness } from '@angular/material/checkbox/testing';
import { MatButtonHarness } from '@angular/material/button/testing';
import { MatInputHarness } from '@angular/material/input/testing';
describe('SearchFilterComponent', () => {
let loader: HarnessLoader;
let fixture: ComponentFixture<SearchFilterComponent>;
let component: SearchFilterComponent;
let queryBuilder: SearchQueryBuilderService;
@@ -67,9 +60,8 @@ describe('SearchFilterComponent', () => {
fixture = TestBed.createComponent(SearchFilterComponent);
appConfigService = TestBed.inject(AppConfigService);
const translationService = fixture.debugElement.injector.get(TranslationService);
spyOn(translationService, 'instant').and.callFake((key) => (key ? `${key}_translated` : null));
spyOn(translationService, 'instant').and.callFake((key) => key ? `${key}_translated` : null);
component = fixture.componentInstance;
loader = TestbedHarnessEnvironment.loader(fixture);
});
afterEach(() => fixture.destroy());
@@ -81,41 +73,27 @@ describe('SearchFilterComponent', () => {
spyOn(queryBuilder, 'execute').and.stub();
queryBuilder.config = {
categories: [],
facetFields: {
fields: [
facetFields: { fields: [
{ label: 'f1', field: 'f1' },
{ label: 'f2', field: 'f2' }
]
},
]},
facetQueries: {
queries: []
}
};
searchFacetFiltersService.responseFacets = [
{
type: 'field',
label: 'f1',
field: 'f1',
buckets: new SearchFilterList([
{ type: 'field', label: 'f1', field: 'f1', buckets: new SearchFilterList([
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
{ label: 'b2', count: 1, filterQuery: 'filter2' }
])
},
{ label: 'b2', count: 1, filterQuery: 'filter2' }]) },
{ type: 'field', label: 'f2', field: 'f2', buckets: new SearchFilterList([]) }
];
queryBuilder.addUserFacetBucket('f1', searchFacetFiltersService.responseFacets[0].buckets.items[0]);
const serverResponseFields: any = [
{
type: 'field',
label: 'f1',
field: 'f1',
buckets: [
{ type: 'field', label: 'f1', field: 'f1', buckets: [
{ label: 'b1', metrics: [{value: {count: 6}}], filterQuery: 'filter' },
{ label: 'b2', metrics: [{ value: { count: 1 } }], filterQuery: 'filter2' }
]
},
{ label: 'b2', metrics: [{value: {count: 1}}], filterQuery: 'filter2' }] },
{ type: 'field', label: 'f2', field: 'f2', buckets: [] }
];
const data = {
@@ -139,41 +117,27 @@ describe('SearchFilterComponent', () => {
spyOn(queryBuilder, 'execute').and.stub();
queryBuilder.config = {
categories: [],
facetFields: {
fields: [
facetFields: { fields: [
{ label: 'f1', field: 'f1' },
{ label: 'f2', field: 'f2' }
]
},
]},
facetQueries: {
queries: []
}
};
searchFacetFiltersService.responseFacets = [
{
type: 'field',
label: 'f1',
field: 'f1',
buckets: new SearchFilterList([
{ type: 'field', label: 'f1', field: 'f1', buckets: new SearchFilterList([
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
{ label: 'b2', count: 1, filterQuery: 'filter2' }
])
},
{ label: 'b2', count: 1, filterQuery: 'filter2' }]) },
{ type: 'field', label: 'f2', field: 'f2', buckets: new SearchFilterList([]) }
];
queryBuilder.addUserFacetBucket('f1', searchFacetFiltersService.responseFacets[0].buckets.items[0]);
const serverResponseFields: any = [
{
type: 'field',
label: 'f1',
field: 'f1',
buckets: [
{ type: 'field', label: 'f1', field: 'f1', buckets: [
{ label: 'b1', metrics: [{value: {count: 6}}], filterQuery: 'filter' },
{ label: 'b2', metrics: [{ value: { count: 1 } }], filterQuery: 'filter2' }
]
},
{ label: 'b2', metrics: [{value: {count: 1}}], filterQuery: 'filter2' }] },
{ type: 'field', label: 'f2', field: 'f2', buckets: [] }
];
const data = {
@@ -197,27 +161,19 @@ describe('SearchFilterComponent', () => {
spyOn(queryBuilder, 'execute').and.stub();
queryBuilder.config = {
categories: [],
facetFields: {
fields: [
facetFields: { fields: [
{ label: 'f1', field: 'f1' },
{ label: 'f2', field: 'f2' }
]
},
]},
facetQueries: {
queries: []
}
};
searchFacetFiltersService.responseFacets = [
{
type: 'field',
label: 'f1',
field: 'f1',
buckets: new SearchFilterList([
{ type: 'field', label: 'f1', field: 'f1', buckets: new SearchFilterList([
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
{ label: 'b2', count: 1, filterQuery: 'filter2' }
])
},
{ label: 'b2', count: 1, filterQuery: 'filter2' }]) },
{ type: 'field', label: 'f2', field: 'f2', buckets: new SearchFilterList() }
];
queryBuilder.addUserFacetBucket('f1', searchFacetFiltersService.responseFacets[0].buckets.items[0]);
@@ -245,8 +201,7 @@ describe('SearchFilterComponent', () => {
buckets: new SearchFilterList([
{ label: 'q1', query: 'q1', checked: true, metrics: [{value: {count: 1}}] },
{ label: 'q2', query: 'q2', checked: false, metrics: [{value: {count: 1}}] },
{ label: 'q3', query: 'q3', checked: true, metrics: [{ value: { count: 1 } }] }
])
{ label: 'q3', query: 'q3', checked: true, metrics: [{value: {count: 1}}] }])
} as any;
searchFacetFiltersService.responseFacets = [queryResponse];
@@ -264,6 +219,7 @@ describe('SearchFilterComponent', () => {
});
describe('widgets', () => {
it('should have expandable categories', async () => {
fixture.detectChanges();
await fixture.whenStable();
@@ -273,8 +229,24 @@ describe('SearchFilterComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(1);
const element: HTMLElement = panels[0].nativeElement;
(element.childNodes[0] as HTMLElement).click();
fixture.detectChanges();
await fixture.whenStable();
expect(element.classList.contains('mat-expanded')).toBeTruthy();
(element.childNodes[0] as HTMLElement).click();
fixture.detectChanges();
await fixture.whenStable();
expect(element.classList.contains('mat-expanded')).toEqual(false);
});
it('should not show the disabled widget', async () => {
@@ -284,7 +256,7 @@ describe('SearchFilterComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(0);
});
@@ -295,11 +267,21 @@ describe('SearchFilterComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(1);
expect(await panels[0].getTitle()).toBe('Type');
expect(await panels[0].isExpanded()).toBe(true);
const title = fixture.debugElement.query(By.css('.mat-expansion-panel-header-title'));
expect(title.nativeElement.innerText.trim()).toBe('Type');
const element: HTMLElement = panels[0].nativeElement;
expect(element.classList.contains('mat-expanded')).toBeTruthy();
(element.childNodes[0] as HTMLElement).click();
fixture.detectChanges();
await fixture.whenStable();
expect(element.classList.contains('mat-expanded')).toEqual(false);
});
it('should show the widgets only if configured', async () => {
@@ -309,11 +291,11 @@ describe('SearchFilterComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(2);
expect(await panels[0].getTitle()).toBe('Name');
expect(await panels[1].getTitle()).toBe('Type');
const titleElements = fixture.debugElement.queryAll(By.css('.mat-expansion-panel-header-title'));
expect(titleElements.map(title => title.nativeElement.innerText.trim())).toEqual(['Name', 'Type']);
});
it('should be update the search query when name changed', async () => {
@@ -323,19 +305,17 @@ describe('SearchFilterComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
let panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
let panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(6);
const inputElement = fixture.debugElement.query(By.css('[data-automation-id="expansion-panel-Name"] input'));
inputElement.triggerEventHandler('change', { target: { value: '*' } });
expect(queryBuilder.update).toHaveBeenCalled();
queryBuilder.executed.next(mockSearchResult);
fixture.detectChanges();
panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(8);
});
@@ -346,20 +326,19 @@ describe('SearchFilterComponent', () => {
fixture.detectChanges();
await fixture.whenStable();
const input = await loader.getHarness(MatInputHarness);
await input.setValue('*');
const inputElement = fixture.debugElement.query(By.css('[data-automation-id="expansion-panel-Name"] input'));
inputElement.triggerEventHandler('change', { target: { value: '*' } });
queryBuilder.executed.next(getMockSearchResultWithResponseBucket());
fixture.detectChanges();
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
expect(panels.length).toBe(9);
});
it('should show the long facet options list with pagination', async () => {
const showMoreButton = MatButtonHarness.with({ selector: `[title="SEARCH.FILTER.ACTIONS.SHOW-MORE"]` });
const showLessButton = MatButtonHarness.with({ selector: `[title="SEARCH.FILTER.ACTIONS.SHOW-LESS"]` });
it('should show the long facet options list with pagination', () => {
const panel = '[data-automation-id="expansion-panel-Size facet queries"]';
appConfigService.config.search = searchFilter;
queryBuilder.resetToDefaults();
@@ -367,51 +346,58 @@ describe('SearchFilterComponent', () => {
queryBuilder.executed.next(mockSearchResult);
fixture.detectChanges();
const panel = await loader.getHarness(
MatExpansionPanelHarness.with({
selector: `[data-automation-id="expansion-panel-Size facet queries"]`
})
);
let sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(sizes).toEqual(stepOne);
let sizes = await panel.getAllHarnesses(MatCheckboxHarness);
let sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
expect(sizeLabels).toEqual(stepOne);
let moreButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-MORE"]`));
let lessButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-LESS"]`));
let moreButton = await loader.getHarness(showMoreButton);
expect(await loader.hasHarness(showLessButton)).toBe(false);
expect(lessButton).toEqual(null);
expect(moreButton).toBeDefined();
await moreButton.click();
moreButton.triggerEventHandler('click', {});
fixture.detectChanges();
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
expect(sizeLabels).toEqual(stepTwo);
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(sizes).toEqual(stepTwo);
moreButton = await loader.getHarness(showMoreButton);
expect(await loader.hasHarness(showLessButton)).toBe(true);
await moreButton.click();
moreButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-MORE"]`));
lessButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-LESS"]`));
expect(lessButton).toBeDefined();
expect(moreButton).toBeDefined();
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
expect(sizeLabels).toEqual(stepThree);
moreButton.triggerEventHandler('click', {});
fixture.detectChanges();
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(await loader.hasHarness(showMoreButton)).toBe(false);
let lessButton = await loader.getHarness(showLessButton);
await lessButton.click();
expect(sizes).toEqual(stepThree);
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
expect(sizeLabels).toEqual(stepTwo);
moreButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-MORE"]`));
lessButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-LESS"]`));
expect(lessButton).toBeDefined();
expect(moreButton).toEqual(null);
expect(await loader.hasHarness(showMoreButton)).toBe(true);
lessButton = await loader.getHarness(showLessButton);
await lessButton.click();
lessButton.triggerEventHandler('click', {});
fixture.detectChanges();
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
expect(sizeLabels).toEqual(stepOne);
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(sizes).toEqual(stepTwo);
expect(await loader.hasHarness(showMoreButton)).toBe(true);
expect(await loader.hasHarness(showLessButton)).toBe(false);
moreButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-MORE"]`));
lessButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-LESS"]`));
expect(lessButton).toBeDefined();
expect(moreButton).toBeDefined();
lessButton.triggerEventHandler('click', {});
fixture.detectChanges();
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(sizes).toEqual(stepOne);
moreButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-MORE"]`));
lessButton = fixture.debugElement.query(By.css(`${panel} button[title="SEARCH.FILTER.ACTIONS.SHOW-LESS"]`));
expect(lessButton).toEqual(null);
expect(moreButton).toBeDefined();
});
it('should not show facets if filter is not available', () => {
@@ -430,8 +416,8 @@ describe('SearchFilterComponent', () => {
expect(facetElement).toEqual(null);
});
it('should search the facets options and select it', async () => {
const panelSelector = '[data-automation-id="expansion-panel-Size facet queries"]';
it('should search the facets options and select it', () => {
const panel = '[data-automation-id="expansion-panel-Size facet queries"]';
appConfigService.config.search = searchFilter;
queryBuilder.resetToDefaults();
fixture.detectChanges();
@@ -440,73 +426,75 @@ describe('SearchFilterComponent', () => {
spyOn(queryBuilder, 'update').and.stub();
const panel = await loader.getHarness(
MatExpansionPanelHarness.with({
selector: panelSelector
})
);
const input = await panel.getHarness(MatInputHarness);
await input.setValue('Extra');
let checkboxes = await panel.getAllHarnesses(MatCheckboxHarness);
expect(checkboxes.length).toBe(1);
expect(await checkboxes[0].getLabelText()).toBe('Extra Small (10239)');
await input.setValue('my');
checkboxes = await panel.getAllHarnesses(MatCheckboxHarness);
let labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
expect(labels).toEqual(filteredResult);
const clearButton = await panel.getHarness(MatButtonHarness.with({ selector: '[title="SEARCH.FILTER.BUTTONS.CLEAR"]' }));
await clearButton.click();
checkboxes = await panel.getAllHarnesses(MatCheckboxHarness);
labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
expect(labels).toEqual(stepOne);
await checkboxes[0].check();
expect(queryBuilder.update).toHaveBeenCalledTimes(1);
});
it('should preserve the filter state if other fields edited', async () => {
const panel1Selector = '[data-automation-id="expansion-panel-Size facet queries"]';
const panel2selector = '[data-automation-id="expansion-panel-Type facet queries"]';
appConfigService.config.search = searchFilter;
queryBuilder.resetToDefaults();
const inputElement = fixture.debugElement.query(By.css(`${panel} input`));
inputElement.nativeElement.value = 'Extra';
inputElement.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();
queryBuilder.executed.next(mockSearchResult);
fixture.detectChanges();
spyOn(queryBuilder, 'update').and.stub();
const inputElement = fixture.debugElement.query(By.css(`${panel1Selector} input`));
let filteredMenu = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(filteredMenu).toEqual(['Extra Small (10239)']);
inputElement.nativeElement.value = 'my';
inputElement.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();
const panel1 = await loader.getHarness(MatExpansionPanelHarness.with({ selector: panel1Selector }));
filteredMenu = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(filteredMenu).toEqual(filteredResult);
let checkboxes = await panel1.getAllHarnesses(MatCheckboxHarness);
let labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
expect(labels).toEqual(filteredResult);
const clearButton = fixture.debugElement.query(By.css(`${panel} mat-form-field button`));
clearButton.triggerEventHandler('click', {});
fixture.detectChanges();
await checkboxes[0].check();
expect(await checkboxes[0].isChecked()).toBe(true);
expect(await checkboxes[0].getLabelText()).toBe('my1 (806)');
filteredMenu = getAllMenus(`${panel} mat-checkbox`, fixture);
expect(filteredMenu).toEqual(stepOne);
const panel2 = await loader.getHarness(MatExpansionPanelHarness.with({ selector: panel2selector }));
checkboxes = await panel2.getAllHarnesses(MatCheckboxHarness);
await checkboxes[0].check();
expect(await checkboxes[0].isChecked()).toBe(true);
expect(await checkboxes[0].getLabelText()).toBe('SEARCH.FACET_QUERIES.MIMETYPE (13)');
const firstOption = fixture.debugElement.query(By.css(`${panel} mat-checkbox`));
firstOption.triggerEventHandler('change', { checked: true });
fixture.detectChanges();
checkboxes = await panel1.getAllHarnesses(MatCheckboxHarness);
labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
expect(labels).toEqual(filteredResult);
const checkedOption = fixture.debugElement.query(By.css(`${panel} mat-checkbox.mat-mdc-checkbox-checked`));
expect(checkedOption.nativeElement.innerText).toEqual('Extra Small (10239)');
const checkedOption = await panel1.getHarness(MatCheckboxHarness.with({ checked: true }));
expect(await checkedOption.getLabelText()).toBe('my1 (806)');
expect(queryBuilder.update).toHaveBeenCalledTimes(1);
});
it('should preserve the filter state if other fields edited', () => {
const panel1 = '[data-automation-id="expansion-panel-Size facet queries"]';
const panel2 = '[data-automation-id="expansion-panel-Type facet queries"]';
appConfigService.config.search = searchFilter;
queryBuilder.resetToDefaults();
fixture.detectChanges();
queryBuilder.executed.next(mockSearchResult);
fixture.detectChanges();
spyOn(queryBuilder, 'update').and.stub();
const inputElement = fixture.debugElement.query(By.css(`${panel1} input`));
inputElement.nativeElement.value = 'my';
inputElement.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();
let filteredMenu = getAllMenus(`${panel1} mat-checkbox`, fixture);
expect(filteredMenu).toEqual(filteredResult);
const firstOption = fixture.debugElement.query(By.css(`${panel1} mat-checkbox`));
firstOption.triggerEventHandler('change', { checked: true });
fixture.detectChanges();
let panel1CheckedOption = fixture.debugElement.query(By.css(`${panel1} mat-checkbox.mat-mdc-checkbox-checked`));
expect(panel1CheckedOption.nativeElement.innerText).toEqual('my1 (806)');
const panel2Options = fixture.debugElement.query(By.css(`${panel2} mat-checkbox`));
panel2Options.triggerEventHandler('change', { checked: true });
fixture.detectChanges();
const panel2CheckedOption = fixture.debugElement.query(By.css(`${panel2} mat-checkbox.mat-mdc-checkbox-checked`));
expect(panel2CheckedOption.nativeElement.innerText).toEqual('SEARCH.FACET_QUERIES.MIMETYPE (13)');
filteredMenu = getAllMenus(`${panel1} mat-checkbox`, fixture);
expect(filteredMenu).toEqual(filteredResult);
panel1CheckedOption = fixture.debugElement.query(By.css(`${panel1} mat-checkbox.mat-mdc-checkbox-checked`));
expect(panel1CheckedOption.nativeElement.innerText).toEqual('my1 (806)');
expect(queryBuilder.update).toHaveBeenCalledTimes(2);
});
@@ -525,10 +513,11 @@ describe('SearchFilterComponent', () => {
expect(component.queryBuilder.queryFragments).toEqual({});
expect(queryBuilder.resetToDefaults).toHaveBeenCalled();
});
});
});
export const getAllMenus = (regex, fixture: ComponentFixture<any>): string[] => {
const elements = fixture.debugElement.queryAll(By.css(regex));
return Array.from(elements).map((element) => element.nativeElement.innerText);
return Array.from(elements).map(element => element.nativeElement.innerText);
};

View File

@@ -104,7 +104,7 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear
const extraFreeSpace = 20;
this._fileSizeOperatorsMaxWidth = Math.max(...this._fileSizeOperators.map((operator) =>
this.getOperatorNameWidth(operator, this.getCanvasFont(this.fileSizeOperatorSelectElement.nativeElement)))) +
this.fileSizeOperatorSelectElement.nativeElement.querySelector('.mat-select-arrow-wrapper').clientWidth +
this.fileSizeOperatorSelectElement.nativeElement.querySelector('.mat-mdc-select-arrow').clientWidth +
extraFreeSpace;
});
}

View File

@@ -4,7 +4,7 @@
placeholder="{{ settings?.placeholder | translate }}"
[(ngModel)]="value"
(change)="onChangedHandler($event)">
<button mat-button *ngIf="value" matSuffix mat-icon-button (click)="clear()">
<button mat-button *ngIf="value" matSuffix (click)="clear()">
<mat-icon>close</mat-icon>
</button>
</mat-form-field>

View File

@@ -17,7 +17,7 @@
import { TreeComponent } from './tree.component';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ContextMenuDirective, CoreTestingModule, UserPreferencesService } from '@alfresco/adf-core';
import { AlfrescoApiService, AlfrescoApiServiceMock, ContextMenuDirective, ContextMenuModule, IconModule, TranslationMock, TranslationService, UserPreferencesService } from '@alfresco/adf-core';
import { MatTreeModule } from '@angular/material/tree';
import { TreeNode, TreeNodeType } from '../models/tree-node.interface';
import {
@@ -67,14 +67,24 @@ describe('TreeComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
imports: [
CoreTestingModule,
MatTreeModule
TranslateModule.forRoot(),
HttpClientModule,
NoopAnimationsModule,
MatTreeModule,
MatIconModule,
MatMenuModule,
MatProgressSpinnerModule,
MatCheckboxModule,
IconModule,
ContextMenuModule
],
declarations: [
TreeComponent
],
providers: [
{ provide: TreeService, useClass: TreeServiceMock }
{ provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock },
{ provide: TreeService, useClass: TreeServiceMock },
{ provide: TranslationService, useClass: TranslationMock }
]
});

View File

@@ -88,7 +88,7 @@ module.exports = function (config) {
global: {
statements: 75,
branches: 67,
functions: 72,
functions: 70,
lines: 75
}
}

View File

@@ -29,7 +29,7 @@ module.exports = function (config) {
check: {
global: {
statements: 75,
branches: 67,
branches: 65,
functions: 73,
lines: 75
}

View File

@@ -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({
expect(component.selectedGroups.indexOf({
id: mockMeatChicken.id,
name: mockMeatChicken.name
})
).toEqual(-1);
})).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,17 +313,18 @@ 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', () => {
@@ -311,6 +334,7 @@ describe('GroupCloudComponent', () => {
});
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');
});
});
});