From 6c3cea56aa6b8cfb537508b05e5e27b2cddeee43 Mon Sep 17 00:00:00 2001 From: Joan Sanchez Date: Tue, 30 Apr 2019 09:19:40 +0200 Subject: [PATCH] fixed multi-check karma unit tests --- .../components/multi-check/multi-check.js | 56 ++++++++--- .../multi-check/multi-check.spec.js | 98 +++++++++++++++---- front/core/mocks/crud-model.js | 9 +- 3 files changed, 128 insertions(+), 35 deletions(-) diff --git a/front/core/components/multi-check/multi-check.js b/front/core/components/multi-check/multi-check.js index bb0279706..b210d01d4 100644 --- a/front/core/components/multi-check/multi-check.js +++ b/front/core/components/multi-check/multi-check.js @@ -10,7 +10,7 @@ import Input from '../../lib/input'; export default class MultiCheck extends Input { constructor($element, $scope) { super($element, $scope); - this._checkAll = false; + this._checked = false; this.checkField = 'checked'; this.isIntermediate = false; } @@ -36,15 +36,35 @@ export default class MultiCheck extends Input { if (value) { value.on('rowChange', () => { - this.isIntermediate = this.allChecked && !this.areAllChecked(); - if (this.isIntermediate) - this._checked = undefined; - else if (this.areAllChecked()) + this.isIntermediate = !this.areAllUnchecked() && !this.areAllChecked(); + + if (this.areAllChecked()) 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 * 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() { - return this._checked; + areAllUnchecked() { + 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 - * - * @param {Boolean} value - Checkbox state [undefined, true, false] + * Toggles checked property on + * all instances */ - set checked(value) { - this._checked = value; - this.allChecked = value; - + toggle() { const data = this.model.data; if (!data) return; data.forEach(el => { - el[this.checkField] = value; + el[this.checkField] = this.checkAll; }); } } diff --git a/front/core/components/multi-check/multi-check.spec.js b/front/core/components/multi-check/multi-check.spec.js index 748fa5871..c85b160c1 100644 --- a/front/core/components/multi-check/multi-check.spec.js +++ b/front/core/components/multi-check/multi-check.spec.js @@ -1,4 +1,5 @@ import './multi-check.js'; +import crudModel from 'core/mocks/crud-model'; describe('Component vnMultiCheck', () => { let controller; @@ -9,33 +10,94 @@ describe('Component vnMultiCheck', () => { beforeEach(angular.mock.inject($componentController => { $element = angular.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', () => { - it(`should set controller _checkAll property with the argument received then call switchChecks()`, () => { - let argument = 'I am the model'; - spyOn(controller, 'switchChecks'); - controller.checkAll = argument; + describe('checked() setter', () => { + it(`should set controller _checked property with the argument received then call toggle()`, () => { + spyOn(controller, 'toggle'); + controller.checked = crudModel; - expect(controller._checkAll).toEqual(argument); - expect(controller.switchChecks).toHaveBeenCalledWith(); + expect(controller._checked).toEqual(crudModel); + expect(controller.toggle).toHaveBeenCalledWith(); }); }); - describe('switchChecks()', () => { + describe('toggle()', () => { it(`should set checked property inside each existing element`, () => { - controller.data = [ - {name: 'name'}, - {name: null} - ]; + const data = controller.model.data; - expect(controller.data[0].checked).not.toBeDefined(); - expect(controller.data[1].checked).not.toBeDefined(); - controller._checkAll = 1; - controller.switchChecks(); + expect(data[0].checked).not.toBeDefined(); + expect(data[1].checked).not.toBeDefined(); + expect(data[2].checked).not.toBeDefined(); - expect(controller.data[0].checked).toBeTruthy(); - expect(controller.data[1].checked).toBeTruthy(); + controller._checked = true; + 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(); }); }); }); diff --git a/front/core/mocks/crud-model.js b/front/core/mocks/crud-model.js index e86f9d63e..af6406eec 100644 --- a/front/core/mocks/crud-model.js +++ b/front/core/mocks/crud-model.js @@ -24,7 +24,14 @@ module.exports = { } }; }, + on: () => { + return { + then: callback => { + callback({data: {id: 1234}}); + } + }; + }, refresh: () => {}, addFilter: () => {}, - applyFilter: () => {} + applyFilter: () => {}, };