inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-2010] Move/copy, when searching for folder multiple results are returned (#2727)

Browse Source 
* adding debounce time in object picker
unify search api
fix multiples duplicate result
remove limit of 4 character to search

* remove three.min.js

* remove unused import

* tlsint fix and remove file

* rename sitesApiService to sitesService as all the other services

* fix test timeout async
This commit is contained in:
Eugenio Romano
2017-11-26 22:06:05 +00:00
committed by GitHub
parent 4549dbf1f5
commit 197fab4da8
23 changed files with 380 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

388
lib/content-services/content-node-selector/content-node-selector.component.spec.ts
View File

@@ -16,19 +16,29 @@
*/
import { CUSTOM_ELEMENTS_SCHEMA, EventEmitter } from '@angular/core';
import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { By } from '@angular/platform-browser';
import { MinimalNodeEntryEntity } from 'alfresco-js-api';
import { AlfrescoApiService, ContentService, TranslationService, SearchService, SiteModel, SitesApiService, UserPreferencesService } from '@alfresco/adf-core';
import {
AlfrescoApiService,
ContentService,
TranslationService,
SearchService,
SiteModel,
SitesService,
UserPreferencesService
} from '@alfresco/adf-core';
import { DataTableModule } from '@alfresco/adf-core';
import { Observable } from 'rxjs/Observable';
import { Observer } from 'rxjs/Observer';
import { MaterialModule } from '../material.module';
import { EmptyFolderContentDirective, DocumentListComponent, DocumentListService } from '../document-list';
import { DropdownSitesComponent } from '../site-dropdown';
import { DropdownBreadcrumbComponent } from '../breadcrumb';
import { ContentNodeSelectorComponent } from './content-node-selector.component';
import { ContentNodeSelectorService } from './content-node-selector.service';
import { NodePaging } from 'alfresco-js-api';
const ONE_FOLDER_RESULT = {
list: {
@@ -56,17 +66,17 @@ describe('ContentNodeSelectorComponent', () => {
let apiService: AlfrescoApiService;
let nodesApi;
let _resolve: Function;
let _observer: Observer<NodePaging>;
function typeToSearchBox(searchTerm = 'string-to-search') {
let searchInput = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-input"]'));
searchInput.nativeElement.value = searchTerm;
searchInput.triggerEventHandler('input', {});
component.searchInput.setValue(searchTerm);
fixture.detectChanges();
}
function respondWithSearchResults(result) {
_resolve(result);
_observer.next(result);
}
function setupTestbed(plusProviders) {
@@ -85,10 +95,10 @@ describe('ContentNodeSelectorComponent', () => {
providers: [
AlfrescoApiService,
ContentService,
SitesApiService,
SearchService,
TranslationService,
DocumentListService,
SearchService,
SitesService,
ContentNodeSelectorService,
UserPreferencesService,
...plusProviders
@@ -109,7 +119,8 @@ describe('ContentNodeSelectorComponent', () => {
title: 'Move along citizen...',
actionName: 'move',
select: new EventEmitter<MinimalNodeEntryEntity>(),
rowFilter: () => {},
rowFilter: () => {
},
imageResolver: () => 'piccolo',
currentFolderId: 'cat-girl-nuku-nuku'
};
@@ -176,7 +187,10 @@ describe('ContentNodeSelectorComponent', () => {
fakePreference.paginationSize = 10;
beforeEach(() => {
dummyMdDialogRef = <MatDialogRef<ContentNodeSelectorComponent>> { close: () => {} };
dummyMdDialogRef = <MatDialogRef<ContentNodeSelectorComponent>> {
close: () => {
}
};
});
it('should be shown if dialogRef is injected', () => {
@@ -205,12 +219,13 @@ describe('ContentNodeSelectorComponent', () => {
beforeEach(() => {
fixture = TestBed.createComponent(ContentNodeSelectorComponent);
component = fixture.componentInstance;
component.debounceSearch = 0;
searchService = TestBed.get(SearchService);
searchSpy = spyOn(searchService, 'getQueryNodesPromise').and.callFake(() => {
return new Promise((resolve, reject) => {
_resolve = resolve;
});
searchSpy = spyOn(searchService, 'search').and.callFake(() => {
return Observable.create((observer: Observer<NodePaging>) => {
_observer = observer;
});
});
apiService = TestBed.get(AlfrescoApiService);
@@ -245,16 +260,16 @@ describe('ContentNodeSelectorComponent', () => {
describe('Breadcrumbs', () => {
let documentListService,
sitesApiService,
sitesService,
expectedDefaultFolderNode;
beforeEach(() => {
expectedDefaultFolderNode = <MinimalNodeEntryEntity> { path: { elements: [] } };
documentListService = TestBed.get(DocumentListService);
sitesApiService = TestBed.get(SitesApiService);
sitesService = TestBed.get(SitesService);
spyOn(documentListService, 'getFolderNode').and.returnValue(Promise.resolve(expectedDefaultFolderNode));
spyOn(documentListService, 'getFolder').and.returnValue(Observable.throw('No results for test'));
spyOn(sitesApiService, 'getSites').and.returnValue(Observable.of([]));
spyOn(sitesService, 'getSites').and.returnValue(Observable.of([]));
spyOn(component.documentList, 'loadFolderNodesByFolderNodeId').and.returnValue(Promise.resolve());
component.currentFolderId = 'cat-girl-nuku-nuku';
fixture.detectChanges();
@@ -274,28 +289,37 @@ describe('ContentNodeSelectorComponent', () => {
it('should not show the breadcrumb if search was performed as last action', (done) => {
typeToSearchBox();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.detectChanges();
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).toBeNull();
done();
});
}, 300);
fixture.whenStable().then(() => {
fixture.detectChanges();
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).toBeNull();
done();
});
});
it('should show the breadcrumb again on folder navigation in the results list', (done) => {
typeToSearchBox();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.detectChanges();
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
component.onFolderChange();
fixture.detectChanges();
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).not.toBeNull();
done();
});
}, 300);
fixture.whenStable().then(() => {
fixture.detectChanges();
component.onFolderChange();
fixture.detectChanges();
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).not.toBeNull();
done();
});
});
it('should show the breadcrumb for the selected node when search results are displayed', (done) => {
@@ -303,20 +327,22 @@ describe('ContentNodeSelectorComponent', () => {
spyOn(alfrescoContentService, 'hasPermission').and.returnValue(true);
typeToSearchBox();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
const chosenNode = <MinimalNodeEntryEntity> { path: { elements: [] } };
component.onNodeSelect({ detail: { node: { entry: chosenNode} } });
fixture.detectChanges();
const chosenNode = <MinimalNodeEntryEntity> { path: { elements: ['one'] } };
component.onNodeSelect({ detail: { node: { entry: chosenNode } } });
fixture.detectChanges();
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).not.toBeNull();
expect(breadcrumb.componentInstance.folderNode).toBe(chosenNode);
done();
});
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).not.toBeNull();
expect(breadcrumb.componentInstance.folderNode.path).toBe(chosenNode.path);
done();
});
}, 300);
});
it('should NOT show the breadcrumb for the selected node when not on search results list', (done) => {
@@ -324,36 +350,48 @@ describe('ContentNodeSelectorComponent', () => {
spyOn(alfrescoContentService, 'hasPermission').and.returnValue(true);
typeToSearchBox();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.detectChanges();
component.onFolderChange();
fixture.detectChanges();
const chosenNode = <MinimalNodeEntryEntity> { path: { elements: [] } };
component.onNodeSelect({ detail: { node: { entry: chosenNode} } });
component.onNodeSelect({ detail: { node: { entry: chosenNode } } });
fixture.detectChanges();
const breadcrumb = fixture.debugElement.query(By.directive(DropdownBreadcrumbComponent));
expect(breadcrumb).not.toBeNull();
expect(breadcrumb.componentInstance.folderNode).toBe(expectedDefaultFolderNode);
done();
});
}, 300);
});
});
describe('Search functionality', () => {
function defaultSearchOptions(rootNodeId = undefined, skipCount = 0) {
return {
function defaultSearchOptions(searchTerm, rootNodeId = undefined, skipCount = 0) {
let defaultSearchNode: any = {
query: {
query: searchTerm ? `${searchTerm}* OR name:${searchTerm}*` : searchTerm
},
include: ['path', 'allowableOperations'],
skipCount,
rootNodeId,
nodeType: 'cm:folder',
maxItems: 25,
orderBy: null
paging: {
maxItems: '25',
skipCount: skipCount.toString()
},
filterQueries: [
{ query: "TYPE:'cm:folder'" },
{ query: 'NOT cm:creator:System' }]
};
if (rootNodeId) {
defaultSearchNode.scope = rootNodeId;
}
return defaultSearchNode;
}
beforeEach(() => {
@@ -367,66 +405,75 @@ describe('ContentNodeSelectorComponent', () => {
fixture.detectChanges();
});
it('should load the results by calling the search api on search change', () => {
it('should load the results by calling the search api on search change', (done) => {
typeToSearchBox('kakarot');
expect(searchSpy).toHaveBeenCalledWith('kakarot*', defaultSearchOptions());
setTimeout(() => {
expect(searchSpy).toHaveBeenCalledWith(defaultSearchOptions('kakarot'));
done();
}, 300);
});
it('should reset the currently chosen node in case of starting a new search', () => {
it('should reset the currently chosen node in case of starting a new search', (done) => {
component.chosenNode = <MinimalNodeEntryEntity> {};
typeToSearchBox('kakarot');
expect(component.chosenNode).toBeNull();
setTimeout(() => {
expect(component.chosenNode).toBeNull();
done();
}, 300);
});
it('should NOT call the search api if the searchTerm length is less than 4 characters', () => {
typeToSearchBox('1');
typeToSearchBox('12');
typeToSearchBox('123');
expect(searchSpy).not.toHaveBeenCalled();
});
xit('should debounce the search call by 500 ms', () => {
});
it('should call the search api on changing the site selectbox\'s value', () => {
it('should call the search api on changing the site selectbox\'s value', (done) => {
typeToSearchBox('vegeta');
expect(searchSpy.calls.count()).toBe(1, 'Search count should be one after only one search');
component.siteChanged(<SiteModel> { guid: 'namek' });
setTimeout(() => {
expect(searchSpy.calls.count()).toBe(1, 'Search count should be one after only one search');
expect(searchSpy.calls.count()).toBe(2, 'Search count should be two after the site change');
expect(searchSpy.calls.argsFor(1)).toEqual(['vegeta*', defaultSearchOptions('namek') ]);
component.siteChanged(<SiteModel> { guid: 'namek' });
expect(searchSpy.calls.count()).toBe(2, 'Search count should be two after the site change');
expect(searchSpy.calls.argsFor(1)).toEqual([defaultSearchOptions('vegeta', 'namek')]);
done();
}, 300);
});
it('should show the search icon by default without the X (clear) icon', () => {
it('should show the search icon by default without the X (clear) icon', (done) => {
fixture.detectChanges();
let searchIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-icon"]'));
let clearIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-clear"]'));
setTimeout(() => {
expect(searchIcon).not.toBeNull('Search icon should be in the DOM');
expect(clearIcon).toBeNull('Clear icon should NOT be in the DOM');
let searchIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-icon"]'));
let clearIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-clear"]'));
expect(searchIcon).not.toBeNull('Search icon should be in the DOM');
expect(clearIcon).toBeNull('Clear icon should NOT be in the DOM');
done();
}, 300);
});
it('should show the X (clear) icon without the search icon when the search contains at least one character', () => {
it('should show the X (clear) icon without the search icon when the search contains at least one character', (done) => {
fixture.detectChanges();
typeToSearchBox('123');
let searchIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-icon"]'));
let clearIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-clear"]'));
setTimeout(() => {
fixture.detectChanges();
expect(searchIcon).toBeNull('Search icon should NOT be in the DOM');
expect(clearIcon).not.toBeNull('Clear icon should be in the DOM');
let searchIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-icon"]'));
let clearIcon = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-clear"]'));
expect(searchIcon).toBeNull('Search icon should NOT be in the DOM');
expect(clearIcon).not.toBeNull('Clear icon should be in the DOM');
done();
}, 300);
});
it('should clear the search field, nodes and chosenNode when clicking on the X (clear) icon', () => {
component.chosenNode = <MinimalNodeEntryEntity> {};
component.nodes = { list: {
entries: [ { entry: component.chosenNode } ]
} };
component.nodes = {
list: {
entries: [{ entry: component.chosenNode }]
}
};
component.searchTerm = 'piccolo';
component.showingSearchResults = true;
@@ -445,7 +492,8 @@ describe('ContentNodeSelectorComponent', () => {
});
it('should pass through the rowFilter to the documentList', () => {
const filter = () => {};
const filter = () => {
};
component.rowFilter = filter;
fixture.detectChanges();
@@ -466,59 +514,79 @@ describe('ContentNodeSelectorComponent', () => {
expect(documentList.componentInstance.imageResolver).toBe(resolver);
});
it('should show the result list when search was performed', async(() => {
it('should show the result list when search was performed', (done) => {
typeToSearchBox();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.detectChanges();
let documentList = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-document-list"]'));
expect(documentList).not.toBeNull('Document list should be shown');
expect(documentList.componentInstance.currentFolderId).toBeUndefined();
});
}));
expect(documentList.componentInstance.currentFolderId).toBeNull();
done();
}, 300);
});
it('should highlight the results when search was performed in the next timeframe', fakeAsync(() => {
xit('should highlight the results when search was performed in the next timeframe', (done) => {
spyOn(component.highlighter, 'highlight');
typeToSearchBox('shenron');
respondWithSearchResults(ONE_FOLDER_RESULT);
expect(component.highlighter.highlight).not.toHaveBeenCalled();
tick();
expect(component.highlighter.highlight).toHaveBeenCalledWith('shenron');
}));
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.detectChanges();
it('should show the default text instead of result list if search was cleared', async(() => {
expect(component.highlighter.highlight).not.toHaveBeenCalled();
setTimeout(() => {
expect(component.highlighter.highlight).toHaveBeenCalledWith('shenron');
}, 300);
done();
}, 300);
});
it('should show the default text instead of result list if search was cleared', (done) => {
typeToSearchBox();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
let clearButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-clear"]'));
expect(clearButton).not.toBeNull('Clear button should be in DOM');
clearButton.triggerEventHandler('click', {});
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.detectChanges();
let documentList = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-document-list"]'));
expect(documentList).not.toBeNull('Document list should be shown');
expect(documentList.componentInstance.currentFolderId).toBe('cat-girl-nuku-nuku');
});
}));
fixture.whenStable().then(() => {
let clearButton = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-clear"]'));
expect(clearButton).not.toBeNull('Clear button should be in DOM');
clearButton.triggerEventHandler('click', {});
fixture.detectChanges();
it('should reload the original documentlist when clearing the search input', async(() => {
let documentList = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-document-list"]'));
expect(documentList).not.toBeNull('Document list should be shown');
expect(documentList.componentInstance.currentFolderId).toBe('cat-girl-nuku-nuku');
done();
});
}, 300);
});
xit('should reload the original documentlist when clearing the search input', (done) => {
typeToSearchBox('shenron');
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
typeToSearchBox('');
fixture.detectChanges();
let documentList = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-document-list"]'));
expect(documentList.componentInstance.currentFolderId).toBe('cat-girl-nuku-nuku');
});
}));
setTimeout(() => {
let documentList = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-document-list"]'));
expect(documentList.componentInstance.currentFolderId).toBe('cat-girl-nuku-nuku');
}, 300);
it('should set the folderIdToShow to the default "currentFolderId" if siteId is undefined', () => {
done();
}, 300);
});
it('should set the folderIdToShow to the default "currentFolderId" if siteId is undefined', (done) => {
component.siteChanged(<SiteModel> { guid: 'Kame-Sennin Muten Roshi' });
fixture.detectChanges();
@@ -530,6 +598,8 @@ describe('ContentNodeSelectorComponent', () => {
documentList = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-document-list"]'));
expect(documentList.componentInstance.currentFolderId).toBe('cat-girl-nuku-nuku');
done();
});
describe('Pagination "Load more" button', () => {
@@ -540,57 +610,65 @@ describe('ContentNodeSelectorComponent', () => {
expect(pagination).toBeNull();
});
it('should be shown when diplaying search results', async(() => {
it('should be shown when diplaying search results', (done) => {
typeToSearchBox('shenron');
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
const pagination = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-pagination"]'));
expect(pagination).not.toBeNull();
});
}));
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
const pagination = fixture.debugElement.query(By.css('[data-automation-id="content-node-selector-search-pagination"]'));
expect(pagination).not.toBeNull();
done();
});
}, 300);
});
it('button\'s callback should load the next batch of results by calling the search api', () => {
const skipCount = 8;
component.searchTerm = 'kakarot';
component.getNextPageOfSearch({skipCount});
component.getNextPageOfSearch({ skipCount });
expect(searchSpy).toHaveBeenCalledWith('kakarot*', defaultSearchOptions(undefined, skipCount));
expect(searchSpy).toHaveBeenCalledWith(defaultSearchOptions('kakarot', undefined, skipCount));
});
it('should set its loading state to true after search was started', () => {
it('should set its loading state to true after search was started', (done) => {
component.showingSearchResults = true;
component.pagination = { hasMoreItems: true };
typeToSearchBox('shenron');
fixture.detectChanges();
const spinnerSelector = By.css('[data-automation-id="content-node-selector-search-pagination"] [data-automation-id="adf-infinite-pagination-spinner"]');
const paginationLoading = fixture.debugElement.query(spinnerSelector);
expect(paginationLoading).not.toBeNull();
});
it('should set its loading state to true after search was performed', async(() => {
component.showingSearchResults = true;
component.pagination = { hasMoreItems: true };
typeToSearchBox('shenron');
fixture.detectChanges();
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
setTimeout(() => {
fixture.detectChanges();
const spinnerSelector = By.css('[data-automation-id="content-node-selector-search-pagination"] [data-automation-id="adf-infinite-pagination-spinner"]');
const paginationLoading = fixture.debugElement.query(spinnerSelector);
expect(paginationLoading).toBeNull();
});
}));
});
expect(paginationLoading).not.toBeNull();
done();
}, 300);
});
xit('should trigger some kind of error when error happened during search', () => {
it('should set its loading state to true after search was performed', (done) => {
component.showingSearchResults = true;
component.pagination = { hasMoreItems: true };
typeToSearchBox('shenron');
fixture.detectChanges();
setTimeout(() => {
respondWithSearchResults(ONE_FOLDER_RESULT);
fixture.whenStable().then(() => {
fixture.detectChanges();
const spinnerSelector = By.css('[data-automation-id="content-node-selector-search-pagination"] [data-automation-id="adf-infinite-pagination-spinner"]');
const paginationLoading = fixture.debugElement.query(spinnerSelector);
expect(paginationLoading).toBeNull();
done();
});
}, 300);
});
});
});
@@ -687,12 +765,12 @@ describe('ContentNodeSelectorComponent', () => {
it('should make the call to get the corresponding node entry to emit when a site node is selected as destination', () => {
spyOn(nodesApi, 'getNode').and.callFake((nodeId) => {
return new Promise(resolve => {
resolve({entry: {id: nodeId}});
resolve({ entry: { id: nodeId } });
});
});
const siteNode1 = {title: 'my files', guid: '-my-'};
const siteNode2 = {title: 'my sites', guid: '-mysites-'};
const siteNode1 = { title: 'my files', guid: '-my-' };
const siteNode2 = { title: 'my sites', guid: '-mysites-' };
component.dropdownSiteList = [siteNode1, siteNode2];
fixture.detectChanges();