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

Fix typehead visibility

Browse Source
This commit is contained in:
Vito Albano
2016-10-20 14:06:44 +01:00
parent 17a175d74e
commit 57baaebb30
3 changed files with 50 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.html
View File

@@ -1,11 +1,10 @@
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label typeahead-widget"
[class.is-dirty]="value"
[class.typeahead-widget__invalid]="!field.isValid">
[class.typeahead-widget__invalid]="!field.isValid" id="typehead-div">
<input class="mdl-textfield__input"
type="text"
[attr.id]="field.id"
[(ngModel)]="value"
(ngModelChange)="checkVisibility(field)"
(keyup)="onKeyUp($event)"
(blur)="onBlur()"
[disabled]="field.readOnly">

61
ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.spec.ts
View File

@@ -21,6 +21,10 @@ import { FormService } from '../../../services/form.service';
import { FormModel } from '../core/form.model';
import { FormFieldModel } from '../core/form-field.model';
import { FormFieldOption } from '../core/form-field-option';
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { FakeFormService } from './assets/formService.service.mock';
import { CoreModule } from 'ng2-alfresco-core';
// import { fakeFormJson } from '../../../services/assets/widget-visibility.service.mock';
describe('TypeaheadWidget', () => {
@@ -152,8 +156,8 @@ describe('TypeaheadWidget', () => {
it('should setup initial value', () => {
spyOn(formService, 'getRestFieldValues').and.returnValue(Observable.create(observer => {
observer.next([
{ id: '1', name: 'One' },
{ id: '2', name: 'Two' }
{id: '1', name: 'One'},
{id: '2', name: 'Two'}
]);
observer.complete();
}));
@@ -168,8 +172,8 @@ describe('TypeaheadWidget', () => {
it('should not setup initial value due to missing option', () => {
spyOn(formService, 'getRestFieldValues').and.returnValue(Observable.create(observer => {
observer.next([
{ id: '1', name: 'One' },
{ id: '2', name: 'Two' }
{id: '1', name: 'One'},
{id: '2', name: 'Two'}
]);
observer.complete();
}));
@@ -183,8 +187,8 @@ describe('TypeaheadWidget', () => {
it('should setup field options on load', () => {
let options: FormFieldOption[] = [
{ id: '1', name: 'One' },
{ id: '2', name: 'Two' }
{id: '1', name: 'One'},
{id: '2', name: 'Two'}
];
spyOn(formService, 'getRestFieldValues').and.returnValue(Observable.create(observer => {
@@ -209,8 +213,8 @@ describe('TypeaheadWidget', () => {
it('should get filtered options', () => {
let options: FormFieldOption[] = [
{ id: '1', name: 'Item one' },
{ id: '2', name: 'Item two'}
{id: '1', name: 'Item one'},
{id: '2', name: 'Item two'}
];
widget.field.options = options;
widget.value = 'tw';
@@ -222,8 +226,8 @@ describe('TypeaheadWidget', () => {
it('should be case insensitive when filtering options', () => {
let options: FormFieldOption[] = [
{ id: '1', name: 'Item one' },
{ id: '2', name: 'iTEM TWo' }
{id: '1', name: 'Item one'},
{id: '2', name: 'iTEM TWo'}
];
widget.field.options = options;
widget.value = 'tW';
@@ -247,8 +251,8 @@ describe('TypeaheadWidget', () => {
it('should flush selected value', () => {
let options: FormFieldOption[] = [
{ id: '1', name: 'Item one' },
{ id: '2', name: 'Item Two' }
{id: '1', name: 'Item one'},
{id: '2', name: 'Item Two'}
];
widget.field.options = options;
@@ -261,8 +265,8 @@ describe('TypeaheadWidget', () => {
it('should be case insensitive when flushing value', () => {
let options: FormFieldOption[] = [
{ id: '1', name: 'Item one' },
{ id: '2', name: 'iTEM TWo' }
{id: '1', name: 'Item one'},
{id: '2', name: 'iTEM TWo'}
];
widget.field.options = options;
@@ -308,4 +312,33 @@ describe('TypeaheadWidget', () => {
expect(widget.field.value).toBeNull();
});
it('should emit field change event on item click', () => {
let event = jasmine.createSpyObj('event', ['preventDefault']);
let fakeField = new FormFieldModel(new FormModel(), {id: 'fakeField', value: 'fakeValue'});
widget.field = fakeField;
let item = {id: 'fake-id-opt', name: 'fake-name-opt'};
widget.onItemClick(item, event);
widget.fieldChanged.subscribe((field) => {
expect(field).toBeDefined();
expect(field.id).toEqual('fakeField');
expect(field.value).toEqual('fake-id-opt');
});
});
it('should emit field change event on blur', (done) => {
spyOn(widget, 'flushValue').and.stub();
let fakeField = new FormFieldModel(new FormModel(), {id: 'fakeField', value: 'fakeValue'});
widget.field = fakeField;
widget.onBlur();
setTimeout(() => {
widget.fieldChanged.subscribe((field) => {
expect(field).toBeDefined();
expect(field.id).toEqual('field-id');
expect(field.value).toEqual('field-value');
});
done();
}, 200);
});
});

2
ng2-components/ng2-activiti-form/src/components/widgets/typeahead/typeahead.widget.ts
View File

@@ -81,6 +81,7 @@ export class TypeaheadWidget extends WidgetComponent implements OnInit {
onBlur() {
setTimeout(() => {
this.flushValue();
this.checkVisibility(this.field);
}, 200);
}
@@ -108,6 +109,7 @@ export class TypeaheadWidget extends WidgetComponent implements OnInit {
if (item) {
this.field.value = item.id;
this.value = item.name;
this.checkVisibility(this.field);
}
if (event) {
event.preventDefault();