Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 1 | /** |
| 2 | * © OpenCORD |
| 3 | * |
| 4 | * Created by teone on 4/18/16. |
| 5 | */ |
| 6 | |
| 7 | (function () { |
| 8 | 'use strict'; |
| 9 | |
| 10 | describe('The xos.helper module', function(){ |
| 11 | |
| 12 | describe('The XosFormHelper service', () => { |
| 13 | let service; |
| 14 | |
| 15 | let fields = [ |
| 16 | 'id', |
| 17 | 'name', |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 18 | 'mail', |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 19 | 'active', |
| 20 | 'created', |
| 21 | 'custom' |
| 22 | ]; |
| 23 | |
| 24 | let modelField = { |
| 25 | id: {}, |
| 26 | name: {}, |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 27 | mail: {}, |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 28 | active: {}, |
| 29 | created: {}, |
| 30 | custom: {} |
| 31 | }; |
| 32 | |
| 33 | let model = { |
| 34 | id: 1, |
| 35 | name: 'test', |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 36 | mail: 'test@onlab.us', |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 37 | active: true, |
| 38 | created: '2016-04-18T23:44:16.883181Z', |
| 39 | custom: 'MyCustomValue' |
| 40 | }; |
| 41 | |
| 42 | let customField = { |
| 43 | custom: { |
| 44 | label: 'Custom Label', |
| 45 | type: 'number', |
| 46 | validators: {} |
| 47 | } |
| 48 | }; |
| 49 | |
| 50 | let formObject = { |
| 51 | id: { |
| 52 | label: 'Id:', |
| 53 | type: 'number', |
| 54 | validators: {} |
| 55 | }, |
| 56 | name: { |
| 57 | label: 'Name:', |
| 58 | type: 'string', |
| 59 | validators: {} |
| 60 | }, |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 61 | mail: { |
| 62 | label: 'Mail:', |
| 63 | type: 'email', |
| 64 | validators: {} |
| 65 | }, |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 66 | active: { |
| 67 | label: 'Active:', |
| 68 | type: 'boolean', |
| 69 | validators: {} |
| 70 | }, |
| 71 | created: { |
| 72 | label: 'Created:', |
| 73 | type: 'date', |
| 74 | validators: {} |
| 75 | }, |
| 76 | custom: { |
| 77 | label: 'Custom Label:', |
| 78 | type: 'number', |
| 79 | validators: {} |
| 80 | } |
| 81 | }; |
| 82 | |
| 83 | // load the application module |
| 84 | beforeEach(module('xos.helpers')); |
| 85 | |
| 86 | // inject the cartService |
| 87 | beforeEach(inject(function (_XosFormHelpers_) { |
| 88 | // The injector unwraps the underscores (_) from around the parameter names when matching |
| 89 | service = _XosFormHelpers_; |
| 90 | })); |
| 91 | |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 92 | describe('the _isEmail method', () => { |
| 93 | it('should return true', () => { |
| 94 | expect(service._isEmail('test@onlab.us')).toEqual(true); |
| 95 | }); |
| 96 | it('should return false', () => { |
| 97 | expect(service._isEmail('testonlab.us')).toEqual(false); |
| 98 | expect(service._isEmail('test@onlab')).toEqual(false); |
| 99 | }); |
| 100 | }); |
| 101 | |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 102 | describe('the _getFieldFormat method', () => { |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 103 | it('should return string', () => { |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 104 | expect(service._getFieldFormat('string')).toEqual('string'); |
Matteo Scandolo | b3d686f | 2016-04-22 14:14:03 -0700 | [diff] [blame] | 105 | expect(service._getFieldFormat(null)).toEqual('string'); |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 106 | }); |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 107 | it('should return mail', () => { |
| 108 | expect(service._getFieldFormat('test@onlab.us')).toEqual('email'); |
| 109 | }); |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 110 | it('should return number', () => { |
| 111 | expect(service._getFieldFormat(1)).toEqual('number'); |
| 112 | expect(service._getFieldFormat('1')).toEqual('number'); |
| 113 | }); |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 114 | it('should return boolean', () => { |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 115 | expect(service._getFieldFormat(false)).toEqual('boolean'); |
| 116 | expect(service._getFieldFormat(true)).toEqual('boolean'); |
| 117 | }); |
| 118 | |
| 119 | it('should return date', () => { |
| 120 | expect(service._getFieldFormat('2016-04-19T23:09:1092Z')).toEqual('string'); |
| 121 | expect(service._getFieldFormat(new Date())).toEqual('date'); |
| 122 | expect(service._getFieldFormat('2016-04-19T23:09:10.208092Z')).toEqual('date'); |
| 123 | }); |
| 124 | }); |
| 125 | |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 126 | it('should convert the fields array in an empty form object', () => { |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 127 | expect(service.parseModelField(fields)).toEqual(modelField); |
| 128 | }); |
| 129 | |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 130 | it('should combine modelField and customField in a form object', () => { |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 131 | expect(service.buildFormStructure(modelField, customField, model)).toEqual(formObject); |
| 132 | }); |
| 133 | }); |
| 134 | |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 135 | describe('The xos-form component', () => { |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 136 | |
| 137 | let element, scope, isolatedScope; |
| 138 | |
| 139 | beforeEach(module('xos.helpers')); |
| 140 | |
| 141 | it('should throw an error if no config is specified', inject(($compile, $rootScope) => { |
| 142 | function errorFunctionWrapper(){ |
| 143 | $compile(angular.element('<xos-form></xos-form>'))($rootScope); |
| 144 | $rootScope.$digest(); |
| 145 | } |
| 146 | expect(errorFunctionWrapper).toThrow(new Error('[xosForm] Please provide a configuration via the "config" attribute')); |
| 147 | })); |
| 148 | |
| 149 | it('should throw an error if no actions is specified', inject(($compile, $rootScope) => { |
| 150 | function errorFunctionWrapper(){ |
| 151 | let scope = $rootScope.$new(); |
| 152 | scope.config = 'green'; |
| 153 | $compile(angular.element('<xos-form config="config"></xos-form>'))(scope); |
| 154 | $rootScope.$digest(); |
| 155 | } |
| 156 | expect(errorFunctionWrapper).toThrow(new Error('[xosForm] Please provide an action list in the configuration')); |
| 157 | })); |
| 158 | |
| 159 | describe('when correctly configured', () => { |
| 160 | |
| 161 | let cb = jasmine.createSpy('callback'); |
| 162 | |
| 163 | beforeEach(inject(($compile, $rootScope) => { |
| 164 | |
| 165 | |
| 166 | scope = $rootScope.$new(); |
| 167 | |
| 168 | scope.config = { |
| 169 | exclude: ['excludedField'], |
Matteo Scandolo | b3d686f | 2016-04-22 14:14:03 -0700 | [diff] [blame] | 170 | formName: 'testForm', |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 171 | actions: [ |
| 172 | { |
| 173 | label: 'Save', |
| 174 | icon: 'ok', // refers to bootstraps glyphicon |
| 175 | cb: cb, |
| 176 | class: 'success' |
| 177 | } |
| 178 | ], |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 179 | fields: { |
| 180 | first_name: { |
| 181 | label: 'Custom Label' |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 182 | } |
Matteo Scandolo | 9f0e5ae | 2016-04-20 12:24:52 -0700 | [diff] [blame] | 183 | } |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 184 | }; |
| 185 | |
| 186 | scope.model = { |
| 187 | id: 1, |
| 188 | first_name: 'Jhon', |
| 189 | last_name: 'Snow', |
| 190 | age: 25, |
Matteo Scandolo | 4ba4cf1 | 2016-04-20 16:36:17 -0700 | [diff] [blame] | 191 | email: 'test@onlab.us', |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 192 | birthDate: '2016-04-18T23:44:16.883181Z', |
| 193 | enabled: true, |
| 194 | role: 'user', //select |
| 195 | a_permissions: [ |
| 196 | |
| 197 | ], |
| 198 | o_permissions: { |
| 199 | |
| 200 | } |
| 201 | }; |
| 202 | |
| 203 | element = angular.element(`<xos-form config="config" ng-model="model"></xos-form>`); |
| 204 | $compile(element)(scope); |
| 205 | scope.$digest(); |
| 206 | isolatedScope = element.isolateScope().vm; |
| 207 | })); |
| 208 | |
| 209 | it('should add excluded properties to the list', () => { |
| 210 | let expected = ['id', 'validators', 'created', 'updated', 'deleted', 'backend_status', 'excludedField']; |
| 211 | expect(isolatedScope.excludedField).toEqual(expected); |
| 212 | }); |
| 213 | |
Matteo Scandolo | 4ba4cf1 | 2016-04-20 16:36:17 -0700 | [diff] [blame] | 214 | it('should render 8 input field', () => { |
| 215 | // boolean are in the form model, but are not input |
| 216 | expect(Object.keys(isolatedScope.formField).length).toEqual(9); |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 217 | var field = element[0].getElementsByTagName('input'); |
| 218 | expect(field.length).toEqual(8); |
| 219 | }); |
| 220 | |
Matteo Scandolo | 4ba4cf1 | 2016-04-20 16:36:17 -0700 | [diff] [blame] | 221 | it('should render 1 boolean field', () => { |
| 222 | expect($(element).find('.boolean-field > button').length).toEqual(2) |
| 223 | }); |
| 224 | |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 225 | it('when clicking on action should invoke callback', () => { |
Matteo Scandolo | 4ba4cf1 | 2016-04-20 16:36:17 -0700 | [diff] [blame] | 226 | var link = $(element).find('[role="button"]'); |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 227 | link.click(); |
| 228 | expect(cb).toHaveBeenCalledWith(scope.model); |
| 229 | }); |
| 230 | |
| 231 | it('should set a custom label', () => { |
| 232 | let nameField = element[0].getElementsByClassName('form-group')[0]; |
| 233 | let label = angular.element(nameField.getElementsByTagName('label')[0]).text() |
| 234 | expect(label).toEqual('Custom Label:'); |
| 235 | }); |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 236 | |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 237 | it('should use the correct input type', () => { |
| 238 | expect($(element).find('[name="age"]')).toHaveAttr('type', 'number'); |
| 239 | expect($(element).find('[name="birthDate"]')).toHaveAttr('type', 'date'); |
Matteo Scandolo | 4ba4cf1 | 2016-04-20 16:36:17 -0700 | [diff] [blame] | 240 | expect($(element).find('[name="email"]')).toHaveAttr('type', 'email'); |
| 241 | }); |
| 242 | |
| 243 | describe('the boolean field', () => { |
| 244 | |
| 245 | let setFalse, setTrue; |
| 246 | |
| 247 | beforeEach(() => { |
| 248 | setFalse= $(element).find('.boolean-field > button:first-child'); |
| 249 | setTrue = $(element).find('.boolean-field > button:last-child'); |
| 250 | }); |
| 251 | |
| 252 | it('should change value to false', () => { |
| 253 | expect(isolatedScope.ngModel.enabled).toEqual(true); |
| 254 | setFalse.click() |
| 255 | expect(isolatedScope.ngModel.enabled).toEqual(false); |
| 256 | }); |
| 257 | |
| 258 | it('should change value to false', () => { |
| 259 | isolatedScope.ngModel.enabled = false; |
| 260 | scope.$apply(); |
| 261 | expect(isolatedScope.ngModel.enabled).toEqual(false); |
| 262 | setTrue.click() |
| 263 | expect(isolatedScope.ngModel.enabled).toEqual(true); |
| 264 | }); |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 265 | }); |
Matteo Scandolo | b3d686f | 2016-04-22 14:14:03 -0700 | [diff] [blame] | 266 | |
| 267 | describe('the custom validation options', () => { |
| 268 | beforeEach(() => { |
| 269 | scope.config.fields.first_name.validators = { |
| 270 | minlength: 10, |
| 271 | maxlength: 15, |
| 272 | required: true |
| 273 | }; |
| 274 | |
Matteo Scandolo | 01c8757 | 2016-04-25 08:15:24 -0700 | [diff] [blame] | 275 | scope.config.fields.age = { |
| 276 | validators: { |
| 277 | min: 10, |
| 278 | max: 20 |
| 279 | } |
| 280 | }; |
| 281 | |
Matteo Scandolo | b3d686f | 2016-04-22 14:14:03 -0700 | [diff] [blame] | 282 | scope.$digest(); |
| 283 | }); |
| 284 | |
| 285 | it('should validate required', () => { |
| 286 | scope.model.first_name = null; |
| 287 | scope.$digest(); |
| 288 | |
| 289 | expect(isolatedScope.testForm.first_name.$valid).toBeFalsy(); |
| 290 | expect(isolatedScope.testForm.first_name.$error.required).toBeTruthy(); |
| 291 | }); |
| 292 | |
| 293 | it('should validate minlength', () => { |
| 294 | scope.model.first_name = 'short'; |
| 295 | scope.$digest(); |
| 296 | |
| 297 | expect(isolatedScope.testForm.first_name.$valid).toBeFalsy(); |
| 298 | expect(isolatedScope.testForm.first_name.$error.minlength).toBeTruthy(); |
| 299 | }); |
| 300 | |
| 301 | it('should validate maxlength', () => { |
| 302 | scope.model.first_name = 'this is way too long!'; |
| 303 | scope.$digest(); |
| 304 | |
| 305 | expect(isolatedScope.testForm.first_name.$valid).toBeFalsy(); |
| 306 | expect(isolatedScope.testForm.first_name.$error.maxlength).toBeTruthy(); |
| 307 | }); |
Matteo Scandolo | 01c8757 | 2016-04-25 08:15:24 -0700 | [diff] [blame] | 308 | |
| 309 | xit('should validate min', () => { |
| 310 | // not validating min and max for now |
| 311 | scope.model.age = 8; |
| 312 | scope.$digest(); |
| 313 | |
| 314 | expect(isolatedScope.testForm.age.$valid).toBeFalsy(); |
| 315 | expect(isolatedScope.testForm.age.$error.min).toBeTruthy(); |
| 316 | }); |
Matteo Scandolo | b3d686f | 2016-04-22 14:14:03 -0700 | [diff] [blame] | 317 | }); |
Matteo Scandolo | 6e2e6ff | 2016-04-20 14:59:39 -0700 | [diff] [blame] | 318 | }); |
Matteo Scandolo | 7bc39c4 | 2016-04-20 11:38:42 -0700 | [diff] [blame] | 319 | }); |
| 320 | }); |
| 321 | })(); |