fixed multi-check karma unit tests
gitea/salix/dev This commit looks good
Details
gitea/salix/dev This commit looks good
Details
This commit is contained in:
parent
a572130b6c
commit
6c3cea56aa
|
@ -10,7 +10,7 @@ import Input from '../../lib/input';
|
||||||
export default class MultiCheck extends Input {
|
export default class MultiCheck extends Input {
|
||||||
constructor($element, $scope) {
|
constructor($element, $scope) {
|
||||||
super($element, $scope);
|
super($element, $scope);
|
||||||
this._checkAll = false;
|
this._checked = false;
|
||||||
this.checkField = 'checked';
|
this.checkField = 'checked';
|
||||||
this.isIntermediate = false;
|
this.isIntermediate = false;
|
||||||
}
|
}
|
||||||
|
@ -36,15 +36,35 @@ export default class MultiCheck extends Input {
|
||||||
|
|
||||||
if (value) {
|
if (value) {
|
||||||
value.on('rowChange', () => {
|
value.on('rowChange', () => {
|
||||||
this.isIntermediate = this.allChecked && !this.areAllChecked();
|
this.isIntermediate = !this.areAllUnchecked() && !this.areAllChecked();
|
||||||
if (this.isIntermediate)
|
|
||||||
this._checked = undefined;
|
if (this.areAllChecked())
|
||||||
else if (this.areAllChecked())
|
|
||||||
this._checked = true;
|
this._checked = true;
|
||||||
|
else if (!this.areAllChecked())
|
||||||
|
this._checked = false;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Gets current check state
|
||||||
|
*/
|
||||||
|
get checked() {
|
||||||
|
return this._checked;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sets current check state
|
||||||
|
*
|
||||||
|
* @param {Boolean} value - Checkbox state [undefined, true, false]
|
||||||
|
*/
|
||||||
|
set checked(value) {
|
||||||
|
this._checked = value;
|
||||||
|
this.checkAll = value;
|
||||||
|
|
||||||
|
this.toggle();
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Returns a bolean result for
|
* Returns a bolean result for
|
||||||
* checked instances
|
* checked instances
|
||||||
|
@ -61,25 +81,29 @@ export default class MultiCheck extends Input {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Gets current check state
|
* Returns a bolean result for
|
||||||
|
* checked instances
|
||||||
|
*
|
||||||
|
* @return {Boolean} - False if all instances are checked
|
||||||
*/
|
*/
|
||||||
get checked() {
|
areAllUnchecked() {
|
||||||
return this._checked;
|
if (!this.model || !this.model.data) return;
|
||||||
|
|
||||||
|
const data = this.model.data;
|
||||||
|
return data.every(item => {
|
||||||
|
return item[this.checkField] === false;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Sets current check state
|
* Toggles checked property on
|
||||||
*
|
* all instances
|
||||||
* @param {Boolean} value - Checkbox state [undefined, true, false]
|
|
||||||
*/
|
*/
|
||||||
set checked(value) {
|
toggle() {
|
||||||
this._checked = value;
|
|
||||||
this.allChecked = value;
|
|
||||||
|
|
||||||
const data = this.model.data;
|
const data = this.model.data;
|
||||||
if (!data) return;
|
if (!data) return;
|
||||||
data.forEach(el => {
|
data.forEach(el => {
|
||||||
el[this.checkField] = value;
|
el[this.checkField] = this.checkAll;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import './multi-check.js';
|
import './multi-check.js';
|
||||||
|
import crudModel from 'core/mocks/crud-model';
|
||||||
|
|
||||||
describe('Component vnMultiCheck', () => {
|
describe('Component vnMultiCheck', () => {
|
||||||
let controller;
|
let controller;
|
||||||
|
@ -9,33 +10,94 @@ describe('Component vnMultiCheck', () => {
|
||||||
beforeEach(angular.mock.inject($componentController => {
|
beforeEach(angular.mock.inject($componentController => {
|
||||||
$element = angular.element(`<div class="shown"></div>`);
|
$element = angular.element(`<div class="shown"></div>`);
|
||||||
controller = $componentController('vnMultiCheck', {$element: $element});
|
controller = $componentController('vnMultiCheck', {$element: $element});
|
||||||
|
controller._model = crudModel;
|
||||||
|
controller._model.data = [
|
||||||
|
{id: 1, name: 'My item 1'},
|
||||||
|
{id: 2, name: 'My item 2'},
|
||||||
|
{id: 3, name: 'My item 3'}
|
||||||
|
];
|
||||||
}));
|
}));
|
||||||
|
|
||||||
describe('checkAll() setter', () => {
|
describe('checked() setter', () => {
|
||||||
it(`should set controller _checkAll property with the argument received then call switchChecks()`, () => {
|
it(`should set controller _checked property with the argument received then call toggle()`, () => {
|
||||||
let argument = 'I am the model';
|
spyOn(controller, 'toggle');
|
||||||
spyOn(controller, 'switchChecks');
|
controller.checked = crudModel;
|
||||||
controller.checkAll = argument;
|
|
||||||
|
|
||||||
expect(controller._checkAll).toEqual(argument);
|
expect(controller._checked).toEqual(crudModel);
|
||||||
expect(controller.switchChecks).toHaveBeenCalledWith();
|
expect(controller.toggle).toHaveBeenCalledWith();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('switchChecks()', () => {
|
describe('toggle()', () => {
|
||||||
it(`should set checked property inside each existing element`, () => {
|
it(`should set checked property inside each existing element`, () => {
|
||||||
controller.data = [
|
const data = controller.model.data;
|
||||||
{name: 'name'},
|
|
||||||
{name: null}
|
|
||||||
];
|
|
||||||
|
|
||||||
expect(controller.data[0].checked).not.toBeDefined();
|
expect(data[0].checked).not.toBeDefined();
|
||||||
expect(controller.data[1].checked).not.toBeDefined();
|
expect(data[1].checked).not.toBeDefined();
|
||||||
controller._checkAll = 1;
|
expect(data[2].checked).not.toBeDefined();
|
||||||
controller.switchChecks();
|
|
||||||
|
|
||||||
expect(controller.data[0].checked).toBeTruthy();
|
controller._checked = true;
|
||||||
expect(controller.data[1].checked).toBeTruthy();
|
controller.checkAll = true;
|
||||||
|
controller.toggle();
|
||||||
|
|
||||||
|
expect(data[0].checked).toBeTruthy();
|
||||||
|
expect(data[1].checked).toBeTruthy();
|
||||||
|
expect(data[2].checked).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
it(`should unset checked property inside each existing element`, () => {
|
||||||
|
const data = controller.model.data;
|
||||||
|
data[0].checked = true;
|
||||||
|
data[1].checked = true;
|
||||||
|
data[2].checked = true;
|
||||||
|
|
||||||
|
controller._checked = false;
|
||||||
|
controller.checkAll = false;
|
||||||
|
controller.toggle();
|
||||||
|
|
||||||
|
expect(data[0].checked).toBeFalsy();
|
||||||
|
expect(data[1].checked).toBeFalsy();
|
||||||
|
expect(data[2].checked).toBeFalsy();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('areAllChecked()', () => {
|
||||||
|
it(`should set return true if all elements are checked`, () => {
|
||||||
|
const data = controller.model.data;
|
||||||
|
data[0].checked = true;
|
||||||
|
data[1].checked = true;
|
||||||
|
data[2].checked = true;
|
||||||
|
|
||||||
|
expect(controller.areAllChecked()).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
it(`should set return false if not all elements are checked`, () => {
|
||||||
|
const data = controller.model.data;
|
||||||
|
data[0].checked = true;
|
||||||
|
data[1].checked = false;
|
||||||
|
data[2].checked = true;
|
||||||
|
|
||||||
|
expect(controller.areAllChecked()).toBeFalsy();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('areAllUnchecked()', () => {
|
||||||
|
it(`should set return true if all elements are unchecked`, () => {
|
||||||
|
const data = controller.model.data;
|
||||||
|
data[0].checked = false;
|
||||||
|
data[1].checked = false;
|
||||||
|
data[2].checked = false;
|
||||||
|
|
||||||
|
expect(controller.areAllUnchecked()).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
it(`should set return false if not all elements are unchecked`, () => {
|
||||||
|
const data = controller.model.data;
|
||||||
|
data[0].checked = false;
|
||||||
|
data[1].checked = true;
|
||||||
|
data[2].checked = false;
|
||||||
|
|
||||||
|
expect(controller.areAllUnchecked()).toBeFalsy();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -24,7 +24,14 @@ module.exports = {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
on: () => {
|
||||||
|
return {
|
||||||
|
then: callback => {
|
||||||
|
callback({data: {id: 1234}});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
refresh: () => {},
|
refresh: () => {},
|
||||||
addFilter: () => {},
|
addFilter: () => {},
|
||||||
applyFilter: () => {}
|
applyFilter: () => {},
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue