mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
Fixing unit test after last rebase + lint
This commit is contained in:
Vito Albano
VitoAlbano
@@ -18,7 +18,7 @@
|
||||
import { SearchFilterComponent } from './search-filter.component';
|
||||
import { SearchQueryBuilderService } from '../../services/search-query-builder.service';
|
||||
import { AppConfigService, TranslationService } from '@alfresco/adf-core';
|
||||
import { SearchService } from '../../services/search.service';
|
||||
import { SearchService } from '../../services/search.service';
|
||||
import { Subject } from 'rxjs';
|
||||
import { SearchFilterList } from '../../models/search-filter-list.model';
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
@@ -39,8 +39,15 @@ 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;
|
||||
@@ -60,8 +67,9 @@ 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());
|
||||
@@ -73,27 +81,41 @@ 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([
|
||||
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
|
||||
{ label: 'b2', count: 1, filterQuery: 'filter2' }]) },
|
||||
{
|
||||
type: 'field',
|
||||
label: 'f1',
|
||||
field: 'f1',
|
||||
buckets: new SearchFilterList([
|
||||
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
|
||||
{ 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: [
|
||||
{ label: 'b1', metrics: [{value: {count: 6}}], filterQuery: 'filter' },
|
||||
{ label: 'b2', metrics: [{value: {count: 1}}], filterQuery: 'filter2' }] },
|
||||
{
|
||||
type: 'field',
|
||||
label: 'f1',
|
||||
field: 'f1',
|
||||
buckets: [
|
||||
{ label: 'b1', metrics: [{ value: { count: 6 } }], filterQuery: 'filter' },
|
||||
{ label: 'b2', metrics: [{ value: { count: 1 } }], filterQuery: 'filter2' }
|
||||
]
|
||||
},
|
||||
{ type: 'field', label: 'f2', field: 'f2', buckets: [] }
|
||||
];
|
||||
const data = {
|
||||
@@ -117,27 +139,41 @@ 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([
|
||||
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
|
||||
{ label: 'b2', count: 1, filterQuery: 'filter2' }]) },
|
||||
{
|
||||
type: 'field',
|
||||
label: 'f1',
|
||||
field: 'f1',
|
||||
buckets: new SearchFilterList([
|
||||
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
|
||||
{ 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: [
|
||||
{ label: 'b1', metrics: [{value: {count: 6}}], filterQuery: 'filter' },
|
||||
{ label: 'b2', metrics: [{value: {count: 1}}], filterQuery: 'filter2' }] },
|
||||
{
|
||||
type: 'field',
|
||||
label: 'f1',
|
||||
field: 'f1',
|
||||
buckets: [
|
||||
{ label: 'b1', metrics: [{ value: { count: 6 } }], filterQuery: 'filter' },
|
||||
{ label: 'b2', metrics: [{ value: { count: 1 } }], filterQuery: 'filter2' }
|
||||
]
|
||||
},
|
||||
{ type: 'field', label: 'f2', field: 'f2', buckets: [] }
|
||||
];
|
||||
const data = {
|
||||
@@ -161,19 +197,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([
|
||||
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
|
||||
{ label: 'b2', count: 1, filterQuery: 'filter2' }]) },
|
||||
{
|
||||
type: 'field',
|
||||
label: 'f1',
|
||||
field: 'f1',
|
||||
buckets: new SearchFilterList([
|
||||
{ label: 'b1', count: 10, filterQuery: 'filter', checked: true },
|
||||
{ label: 'b2', count: 1, filterQuery: 'filter2' }
|
||||
])
|
||||
},
|
||||
{ type: 'field', label: 'f2', field: 'f2', buckets: new SearchFilterList() }
|
||||
];
|
||||
queryBuilder.addUserFacetBucket('f1', searchFacetFiltersService.responseFacets[0].buckets.items[0]);
|
||||
@@ -199,9 +243,10 @@ describe('SearchFilterComponent', () => {
|
||||
const queryResponse = {
|
||||
label: 'query response',
|
||||
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: '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 } }] }
|
||||
])
|
||||
} as any;
|
||||
searchFacetFiltersService.responseFacets = [queryResponse];
|
||||
|
||||
@@ -216,10 +261,9 @@ describe('SearchFilterComponent', () => {
|
||||
expect(entry.checked).toEqual(false);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('widgets', () => {
|
||||
|
||||
it('should have expandable categories', async () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
@@ -229,24 +273,8 @@ describe('SearchFilterComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
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 () => {
|
||||
@@ -256,7 +284,7 @@ describe('SearchFilterComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
expect(panels.length).toBe(0);
|
||||
});
|
||||
|
||||
@@ -267,21 +295,11 @@ describe('SearchFilterComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
expect(panels.length).toBe(1);
|
||||
|
||||
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);
|
||||
expect(await panels[0].getTitle()).toBe('Type');
|
||||
expect(await panels[0].isExpanded()).toBe(true);
|
||||
});
|
||||
|
||||
it('should show the widgets only if configured', async () => {
|
||||
@@ -291,11 +309,11 @@ describe('SearchFilterComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
expect(panels.length).toBe(2);
|
||||
|
||||
const titleElements = fixture.debugElement.queryAll(By.css('.mat-expansion-panel-header-title'));
|
||||
expect(titleElements.map(title => title.nativeElement.innerText.trim())).toEqual(['Name', 'Type']);
|
||||
expect(await panels[0].getTitle()).toBe('Name');
|
||||
expect(await panels[1].getTitle()).toBe('Type');
|
||||
});
|
||||
|
||||
it('should be update the search query when name changed', async () => {
|
||||
@@ -305,17 +323,19 @@ describe('SearchFilterComponent', () => {
|
||||
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
let panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
|
||||
let panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
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 = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
expect(panels.length).toBe(8);
|
||||
});
|
||||
|
||||
@@ -326,19 +346,20 @@ describe('SearchFilterComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const inputElement = fixture.debugElement.query(By.css('[data-automation-id="expansion-panel-Name"] input'));
|
||||
inputElement.triggerEventHandler('change', { target: { value: '*' } });
|
||||
const input = await loader.getHarness(MatInputHarness);
|
||||
await input.setValue('*');
|
||||
|
||||
queryBuilder.executed.next(getMockSearchResultWithResponseBucket());
|
||||
fixture.detectChanges();
|
||||
|
||||
const panels = fixture.debugElement.queryAll(By.css('.mat-expansion-panel'));
|
||||
|
||||
const panels = await loader.getAllHarnesses(MatExpansionPanelHarness);
|
||||
expect(panels.length).toBe(9);
|
||||
});
|
||||
|
||||
it('should show the long facet options list with pagination', () => {
|
||||
const panel = '[data-automation-id="expansion-panel-Size facet queries"]';
|
||||
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"]` });
|
||||
|
||||
appConfigService.config.search = searchFilter;
|
||||
queryBuilder.resetToDefaults();
|
||||
|
||||
@@ -346,58 +367,51 @@ describe('SearchFilterComponent', () => {
|
||||
queryBuilder.executed.next(mockSearchResult);
|
||||
fixture.detectChanges();
|
||||
|
||||
let sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
expect(sizes).toEqual(stepOne);
|
||||
const panel = await loader.getHarness(
|
||||
MatExpansionPanelHarness.with({
|
||||
selector: `[data-automation-id="expansion-panel-Size facet queries"]`
|
||||
})
|
||||
);
|
||||
|
||||
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 sizes = await panel.getAllHarnesses(MatCheckboxHarness);
|
||||
let sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
|
||||
expect(sizeLabels).toEqual(stepOne);
|
||||
|
||||
expect(lessButton).toEqual(null);
|
||||
expect(moreButton).toBeDefined();
|
||||
let moreButton = await loader.getHarness(showMoreButton);
|
||||
expect(await loader.hasHarness(showLessButton)).toBe(false);
|
||||
|
||||
moreButton.triggerEventHandler('click', {});
|
||||
fixture.detectChanges();
|
||||
await moreButton.click();
|
||||
|
||||
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
expect(sizes).toEqual(stepTwo);
|
||||
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).toBeDefined();
|
||||
moreButton = await loader.getHarness(showMoreButton);
|
||||
expect(await loader.hasHarness(showLessButton)).toBe(true);
|
||||
await moreButton.click();
|
||||
|
||||
moreButton.triggerEventHandler('click', {});
|
||||
fixture.detectChanges();
|
||||
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
|
||||
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
|
||||
expect(sizeLabels).toEqual(stepThree);
|
||||
|
||||
expect(sizes).toEqual(stepThree);
|
||||
expect(await loader.hasHarness(showMoreButton)).toBe(false);
|
||||
let lessButton = await loader.getHarness(showLessButton);
|
||||
await lessButton.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).toEqual(null);
|
||||
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
|
||||
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
|
||||
expect(sizeLabels).toEqual(stepTwo);
|
||||
|
||||
lessButton.triggerEventHandler('click', {});
|
||||
fixture.detectChanges();
|
||||
expect(await loader.hasHarness(showMoreButton)).toBe(true);
|
||||
lessButton = await loader.getHarness(showLessButton);
|
||||
await lessButton.click();
|
||||
|
||||
sizes = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
expect(sizes).toEqual(stepTwo);
|
||||
sizes = await panel.getAllHarnesses(MatCheckboxHarness);
|
||||
sizeLabels = await Promise.all(sizes.map((element) => element.getLabelText()));
|
||||
expect(sizeLabels).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).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();
|
||||
expect(await loader.hasHarness(showMoreButton)).toBe(true);
|
||||
expect(await loader.hasHarness(showLessButton)).toBe(false);
|
||||
});
|
||||
|
||||
it('should not show facets if filter is not available', () => {
|
||||
@@ -416,8 +430,8 @@ describe('SearchFilterComponent', () => {
|
||||
expect(facetElement).toEqual(null);
|
||||
});
|
||||
|
||||
it('should search the facets options and select it', () => {
|
||||
const panel = '[data-automation-id="expansion-panel-Size facet queries"]';
|
||||
it('should search the facets options and select it', async () => {
|
||||
const panelSelector = '[data-automation-id="expansion-panel-Size facet queries"]';
|
||||
appConfigService.config.search = searchFilter;
|
||||
queryBuilder.resetToDefaults();
|
||||
fixture.detectChanges();
|
||||
@@ -426,41 +440,39 @@ describe('SearchFilterComponent', () => {
|
||||
|
||||
spyOn(queryBuilder, 'update').and.stub();
|
||||
|
||||
const inputElement = fixture.debugElement.query(By.css(`${panel} input`));
|
||||
inputElement.nativeElement.value = 'Extra';
|
||||
inputElement.nativeElement.dispatchEvent(new Event('input'));
|
||||
fixture.detectChanges();
|
||||
const panel = await loader.getHarness(
|
||||
MatExpansionPanelHarness.with({
|
||||
selector: panelSelector
|
||||
})
|
||||
);
|
||||
|
||||
let filteredMenu = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
expect(filteredMenu).toEqual(['Extra Small (10239)']);
|
||||
const input = await panel.getHarness(MatInputHarness);
|
||||
await input.setValue('Extra');
|
||||
|
||||
inputElement.nativeElement.value = 'my';
|
||||
inputElement.nativeElement.dispatchEvent(new Event('input'));
|
||||
fixture.detectChanges();
|
||||
let checkboxes = await panel.getAllHarnesses(MatCheckboxHarness);
|
||||
expect(checkboxes.length).toBe(1);
|
||||
expect(await checkboxes[0].getLabelText()).toBe('Extra Small (10239)');
|
||||
|
||||
filteredMenu = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
expect(filteredMenu).toEqual(filteredResult);
|
||||
await input.setValue('my');
|
||||
|
||||
const clearButton = fixture.debugElement.query(By.css(`${panel} mat-form-field button`));
|
||||
clearButton.triggerEventHandler('click', {});
|
||||
fixture.detectChanges();
|
||||
checkboxes = await panel.getAllHarnesses(MatCheckboxHarness);
|
||||
let labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
|
||||
expect(labels).toEqual(filteredResult);
|
||||
|
||||
filteredMenu = getAllMenus(`${panel} mat-checkbox`, fixture);
|
||||
expect(filteredMenu).toEqual(stepOne);
|
||||
const clearButton = await panel.getHarness(MatButtonHarness.with({ selector: '[title="SEARCH.FILTER.BUTTONS.CLEAR"]' }));
|
||||
await clearButton.click();
|
||||
|
||||
const firstOption = fixture.debugElement.query(By.css(`${panel} mat-checkbox`));
|
||||
firstOption.triggerEventHandler('change', { checked: true });
|
||||
fixture.detectChanges();
|
||||
|
||||
const checkedOption = fixture.debugElement.query(By.css(`${panel} mat-checkbox.mat-mdc-checkbox-checked`));
|
||||
expect(checkedOption.nativeElement.innerText).toEqual('Extra Small (10239)');
|
||||
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', () => {
|
||||
const panel1 = '[data-automation-id="expansion-panel-Size facet queries"]';
|
||||
const panel2 = '[data-automation-id="expansion-panel-Type facet queries"]';
|
||||
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();
|
||||
fixture.detectChanges();
|
||||
@@ -468,39 +480,39 @@ describe('SearchFilterComponent', () => {
|
||||
fixture.detectChanges();
|
||||
spyOn(queryBuilder, 'update').and.stub();
|
||||
|
||||
const inputElement = fixture.debugElement.query(By.css(`${panel1} input`));
|
||||
const inputElement = fixture.debugElement.query(By.css(`${panel1Selector} 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 panel1 = await loader.getHarness(MatExpansionPanelHarness.with({ selector: panel1Selector }));
|
||||
|
||||
const firstOption = fixture.debugElement.query(By.css(`${panel1} mat-checkbox`));
|
||||
firstOption.triggerEventHandler('change', { checked: true });
|
||||
fixture.detectChanges();
|
||||
let checkboxes = await panel1.getAllHarnesses(MatCheckboxHarness);
|
||||
let labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
|
||||
expect(labels).toEqual(filteredResult);
|
||||
|
||||
let panel1CheckedOption = fixture.debugElement.query(By.css(`${panel1} mat-checkbox.mat-mdc-checkbox-checked`));
|
||||
expect(panel1CheckedOption.nativeElement.innerText).toEqual('my1 (806)');
|
||||
await checkboxes[0].check();
|
||||
expect(await checkboxes[0].isChecked()).toBe(true);
|
||||
expect(await checkboxes[0].getLabelText()).toBe('my1 (806)');
|
||||
|
||||
const panel2Options = fixture.debugElement.query(By.css(`${panel2} mat-checkbox`));
|
||||
panel2Options.triggerEventHandler('change', { checked: true });
|
||||
fixture.detectChanges();
|
||||
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 panel2CheckedOption = fixture.debugElement.query(By.css(`${panel2} mat-checkbox.mat-mdc-checkbox-checked`));
|
||||
expect(panel2CheckedOption.nativeElement.innerText).toEqual('SEARCH.FACET_QUERIES.MIMETYPE (13)');
|
||||
checkboxes = await panel1.getAllHarnesses(MatCheckboxHarness);
|
||||
labels = await Promise.all(checkboxes.map((element) => element.getLabelText()));
|
||||
expect(labels).toEqual(filteredResult);
|
||||
|
||||
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)');
|
||||
const checkedOption = await panel1.getHarness(MatCheckboxHarness.with({ checked: true }));
|
||||
expect(await checkedOption.getLabelText()).toBe('my1 (806)');
|
||||
|
||||
expect(queryBuilder.update).toHaveBeenCalledTimes(2);
|
||||
});
|
||||
|
||||
it('should reset the query fragments when reset All is clicked', () => {
|
||||
component.queryBuilder.queryFragments = { fragment1 : 'value1'};
|
||||
component.queryBuilder.queryFragments = { fragment1: 'value1' };
|
||||
appConfigService.config.search = searchFilter;
|
||||
searchFacetFiltersService.responseFacets = [];
|
||||
component.displayResetButton = true;
|
||||
@@ -513,11 +525,10 @@ 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);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user