Tarea #583 Refactorizar textfield y front unit test

This commit is contained in:
gerard 2018-08-06 14:09:55 +02:00
parent 084896c69a
commit b2d12b709b
2 changed files with 72 additions and 15 deletions

View File

@ -23,19 +23,30 @@ export default class Textfield extends Input {
}, null, 'rightIcons');
}
this.input.addEventListener('keyup', e => {
if (e.key == "Escape") {
this.input.blur();
this.input.addEventListener('keydown', () => {
if (!this.oldValue) {
this.saveOldValue();
}
});
this.input.addEventListener('change', e => {
if (this.onChange) {
this.onChange();
this.input.addEventListener('keyup', e => {
if (e.key == "Escape") {
this.value = this.oldValue;
this.cancelled = true;
e.stopPropagation();
}
if (e.key == "Escape" || e.key == "Enter")
this.input.blur();
});
this.input.addEventListener('blur', () => {
if (this.onChange && !this.cancelled &&
(this.oldValue && this.oldValue != this.value))
this.onChange();
else
this.cancelled = false;
});
}
saveOldValue() {
this.oldValue = this.input.value;
this.oldValue = this.value;
}
set leftIcons(value) {
for (let i = 0; i < value.children.length; i++) {
@ -54,7 +65,6 @@ export default class Textfield extends Input {
if (this.hasValue) this.element.classList.add('not-empty');
else this.element.classList.remove('not-empty');
this.mdlUpdate();
}
get value() {
return this._value;
@ -68,10 +78,6 @@ export default class Textfield extends Input {
set vnTabIndex(value) {
this.input.tabindex = value;
}
mdlUpdate() {
let mdlElement = this.element.firstChild.MaterialTextfield;
if (mdlElement) mdlElement.updateClasses_();
}
clear() {
this.value = null;
this.input.focus();
@ -95,7 +101,6 @@ ngModule.component('vnTextfield', {
rule: '@?',
type: '@?',
vnTabIndex: '@?',
unclearable: '<?',
onChange: '&'
}
});

View File

@ -17,10 +17,47 @@ describe('Component vnTextfield', () => {
$scope = $rootScope.$new();
$attrs = {};
$timeout = _$timeout_;
$element = angular.element('<div><input></div>');
controller = $componentController('vnTextfield', {$scope, $element, $attrs, $timeout, $transclude: null});
$element = angular.element('<div><input><div class="leftIcons"><div class="rightIcons"></div></div>');
controller = $componentController('vnTextfield', {$scope, $element, $attrs, $timeout, $transclude: () => {}});
}));
describe('saveOldValue()', () => {
it(`should equal oldValue property to the actual input value`, () => {
controller.value = 'pepino';
controller.saveOldValue();
expect(controller.oldValue).toEqual('pepino');
});
});
describe('leftIcons() setter', () => {
it(`should append childs of a given element to div.leftIcons`, () => {
let div = document.createElement("div");
let p = document.createElement("p");
let text = document.createTextNode("Mariano");
p.appendChild(text);
div.appendChild(p);
controller.leftIcons = div;
expect(controller.element.innerHTML).toContain(p.innerHTML);
});
});
describe('rightIcons() setter', () => {
it(`should append childs of a given element to div.rightIcons`, () => {
let div = document.createElement("div");
let p = document.createElement("p");
let text = document.createTextNode("Mariano");
p.appendChild(text);
div.appendChild(p);
controller.rightIcons = div;
expect(controller.element.innerHTML).toContain(p.innerHTML);
});
});
describe('value() setter', () => {
it(`should set _value, input.value and hasValue properties to null, '' and false`, () => {
let testValue = '';
@ -39,6 +76,13 @@ describe('Component vnTextfield', () => {
expect(controller.input.value).toEqual(testValue);
expect(controller.hasValue).toEqual(Boolean(testValue));
});
it(`should add the class not-empty to the div`, () => {
let testValue = 'test';
controller.value = testValue;
expect(controller.element.classList).toContain('not-empty');
});
});
describe('type() setter', () => {
@ -49,6 +93,14 @@ describe('Component vnTextfield', () => {
});
});
describe('vnTabIndex() setter', () => {
it(`should set input.tabindex to a given value`, () => {
controller.vnTabIndex = 9;
expect(controller.input.tabindex).toEqual(9);
});
});
describe('clear()', () => {
it(`should set value property to null and call focus`, () => {
spyOn(controller.input, 'focus');