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

Find-as-you-type improvements

Browse Source 
- Add autocompleteEnabled input property for find-as-you-type
- Support escape and down arrow keys for hiding/showing FAYT results
- Add tests for find-as-you-type

Refs #737
This commit is contained in:
Will Abson
2016-10-04 15:31:25 +01:00
parent b29adeb699
commit ba710dc816
4 changed files with 90 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
ng2-components/ng2-alfresco-search/src/components/alfresco-search-control.component.spec.ts
View File

@@ -131,6 +131,80 @@ describe('AlfrescoSearchControlComponent', () => {
});
});
describe('Find as you type', () => {
let inputEl: HTMLInputElement;
beforeEach(() => {
inputEl = element.querySelector('input');
});
it('should display a find-as-you-type control by default', () => {
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete).not.toBeNull();
});
it('should make find-as-you-type control hidden initially', () => {
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete.classList.contains('active')).toBe(false);
});
it('should make find-as-you-type control visible when search box has focus', () => {
alfrescoSearchControlComponentFixture.detectChanges();
inputEl.dispatchEvent(new Event('focus'));
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete.classList.contains('active')).toBe(true);
});
it('should hide find-as-you-type results when the search box loses focus', (done) => {
alfrescoSearchControlComponentFixture.detectChanges();
inputEl.dispatchEvent(new Event('focus'));
inputEl.dispatchEvent(new Event('blur'));
window.setTimeout(() => {
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete.classList.contains('active')).toBe(false);
done();
}, 250);
});
it('should hide find-as-you-type results when escape key pressed', () => {
alfrescoSearchControlComponentFixture.detectChanges();
inputEl.dispatchEvent(new Event('focus'));
inputEl.dispatchEvent(new KeyboardEvent('keyup', {
key: 'Escape'
}));
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete.classList.contains('active')).toBe(false);
});
it('should make find-as-you-type control visible again when down arrow is pressed', () => {
alfrescoSearchControlComponentFixture.detectChanges();
inputEl.dispatchEvent(new Event('focus'));
inputEl.dispatchEvent(new KeyboardEvent('keyup', {
key: 'Escape'
}));
inputEl.dispatchEvent(new KeyboardEvent('keyup', {
key: 'ArrowDown'
}));
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete.classList.contains('active')).toBe(true);
});
it('should NOT display a find-as-you-type control when configured not to', () => {
alfrescoSearchControlComponentFixture.componentInstance.autocompleteEnabled = false;
alfrescoSearchControlComponentFixture.detectChanges();
let autocomplete: Element = element.querySelector('alfresco-search-autocomplete');
expect(autocomplete).toBeNull();
});
});
describe('search submit', () => {
it('should fire a search when a term has been entered', () => {