Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 1 | /** |
| 2 | * © OpenCORD |
| 3 | * |
| 4 | * Created by teone on 3/24/16. |
| 5 | */ |
| 6 | |
| 7 | (function () { |
| 8 | 'use strict'; |
| 9 | |
| 10 | describe('The xos.helper module', function(){ |
| 11 | describe('The xos-table component', () => { |
| 12 | |
| 13 | beforeEach(module('xos.helpers')); |
| 14 | |
| 15 | it('should throw an error if no config is specified', inject(($compile, $rootScope) => { |
| 16 | function errorFunctionWrapper(){ |
| 17 | $compile(angular.element('<xos-table></xos-table>'))($rootScope); |
| 18 | $rootScope.$digest(); |
| 19 | } |
| 20 | expect(errorFunctionWrapper).toThrow(new Error('[xosTable] Please provide a configuration via the "config" attribute')); |
| 21 | })); |
| 22 | |
| 23 | it('should throw an error if no config columns are specified', inject(($compile, $rootScope) => { |
| 24 | function errorFunctionWrapper(){ |
| 25 | // setup the parent scope |
| 26 | let scope = $rootScope.$new(); |
| 27 | scope.config = 'green'; |
| 28 | $compile(angular.element('<xos-table config="config"></xos-table>'))(scope); |
| 29 | $rootScope.$digest(); |
| 30 | } |
| 31 | expect(errorFunctionWrapper).toThrow(new Error('[xosTable] Please provide a columns list in the configuration')); |
| 32 | })); |
| 33 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 34 | describe('when basicly configured', function() { |
| 35 | var scope, element, isolatedScope; |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 36 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 37 | beforeEach(inject(function ($compile, $rootScope) { |
| 38 | scope = $rootScope.$new(); |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 39 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 40 | scope.config = { |
| 41 | columns: [ |
| 42 | { |
| 43 | label: 'Label 1', |
| 44 | prop: 'label-1' |
| 45 | }, |
| 46 | { |
| 47 | label: 'Label 2', |
| 48 | prop: 'label-2' |
| 49 | } |
| 50 | ] |
| 51 | }; |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 52 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 53 | scope.data = [ |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 54 | { |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 55 | 'label-1': 'Sample 1.1', |
| 56 | 'label-2': 'Sample 1.2' |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 57 | }, |
| 58 | { |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 59 | 'label-1': 'Sample 2.1', |
| 60 | 'label-2': 'Sample 2.2' |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 61 | } |
| 62 | ] |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 63 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 64 | element = angular.element('<xos-table config="config" data="data"></xos-table>'); |
| 65 | $compile(element)(scope); |
| 66 | scope.$digest(); |
| 67 | isolatedScope = element.isolateScope().vm; |
| 68 | })); |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 69 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 70 | it('should contain 2 columns', function() { |
| 71 | var th = element[0].getElementsByTagName('th'); |
| 72 | expect(th.length).toEqual(2); |
| 73 | expect(isolatedScope.columns.length).toEqual(2); |
| 74 | }); |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 75 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 76 | it('should contain 3 rows', function() { |
| 77 | var tr = element[0].getElementsByTagName('tr'); |
| 78 | expect(tr.length).toEqual(3); |
| 79 | }); |
| 80 | |
Matteo Scandolo | fb5937d | 2016-04-15 14:27:54 -0700 | [diff] [blame] | 81 | describe('when no data are provided', () => { |
| 82 | beforeEach(() => { |
| 83 | isolatedScope.data = []; |
| 84 | scope.$digest(); |
| 85 | }); |
| 86 | it('should render an alert', () => { |
| 87 | let alert = element[0].getElementsByClassName('alert'); |
| 88 | let table = element[0].getElementsByTagName('table'); |
| 89 | expect(alert.length).toEqual(1); |
| 90 | expect(table.length).toEqual(1); |
| 91 | }); |
| 92 | }); |
| 93 | |
Matteo Scandolo | ed92a29 | 2016-04-28 13:14:08 -0700 | [diff] [blame] | 94 | xdescribe('when a field type is provided', () => { |
Matteo Scandolo | 250a29c | 2016-04-27 17:26:21 -0700 | [diff] [blame] | 95 | describe('and is boolean', () => { |
| 96 | beforeEach(() => { |
Matteo Scandolo | 250a29c | 2016-04-27 17:26:21 -0700 | [diff] [blame] | 97 | isolatedScope.config = { |
| 98 | columns: [ |
| 99 | { |
| 100 | label: 'Label 1', |
| 101 | prop: 'label-1', |
| 102 | type: 'boolean' |
| 103 | } |
| 104 | ] |
| 105 | }; |
| 106 | isolatedScope.data = [ |
| 107 | { |
| 108 | 'label-1': true |
| 109 | }, |
| 110 | { |
| 111 | 'label-1': false |
| 112 | } |
| 113 | ]; |
| 114 | scope.$digest(); |
| 115 | }); |
| 116 | |
| 117 | it('should render an incon', () => { |
| 118 | let td1 = $(element).find('tbody tr:first-child td')[0]; |
| 119 | let td2 = $(element).find('tbody tr:last-child td')[0]; |
Matteo Scandolo | 250a29c | 2016-04-27 17:26:21 -0700 | [diff] [blame] | 120 | expect($(td1).find('i')).toHaveClass('glyphicon-ok'); |
| 121 | expect($(td2).find('i')).toHaveClass('glyphicon-remove'); |
| 122 | }); |
| 123 | }); |
| 124 | |
| 125 | describe('and is date', () => { |
| 126 | beforeEach(() => { |
Matteo Scandolo | 250a29c | 2016-04-27 17:26:21 -0700 | [diff] [blame] | 127 | isolatedScope.config = { |
| 128 | columns: [ |
| 129 | { |
| 130 | label: 'Label 1', |
| 131 | prop: 'label-1', |
| 132 | type: 'date' |
| 133 | } |
| 134 | ] |
| 135 | }; |
| 136 | isolatedScope.data = [ |
| 137 | { |
| 138 | 'label-1': '2015-02-17T22:06:38.059000Z' |
| 139 | } |
| 140 | ]; |
| 141 | scope.$digest(); |
| 142 | }); |
| 143 | |
| 144 | it('should render an formatted date', () => { |
| 145 | let td1 = $(element).find('tbody tr:first-child td')[0]; |
| 146 | expect($(td1).text()).toEqual('02-17-2015 14:06:38'); |
| 147 | }); |
| 148 | }); |
| 149 | }); |
| 150 | |
Matteo Scandolo | 6a6586e | 2016-04-14 16:52:13 -0700 | [diff] [blame] | 151 | describe('when actions are passed', () => { |
| 152 | |
| 153 | let cb = jasmine.createSpy('callback') |
| 154 | |
| 155 | beforeEach(() => { |
| 156 | isolatedScope.config.actions = [ |
| 157 | { |
| 158 | label: 'delete', |
| 159 | icon: 'remove', |
| 160 | cb: cb, |
| 161 | color: 'red' |
| 162 | } |
| 163 | ]; |
| 164 | scope.$digest(); |
| 165 | }); |
| 166 | |
| 167 | it('should have 3 columns', () => { |
| 168 | var th = element[0].getElementsByTagName('th'); |
| 169 | expect(th.length).toEqual(3); |
| 170 | expect(isolatedScope.columns.length).toEqual(2); |
| 171 | }); |
| 172 | |
| 173 | it('when clicking on action should invoke callback', () => { |
| 174 | var link = element[0].getElementsByTagName('a')[0]; |
| 175 | link.click(); |
| 176 | expect(cb).toHaveBeenCalledWith(scope.data[0]); |
| 177 | }); |
| 178 | }); |
| 179 | |
| 180 | describe('when filter is fulltext', () => { |
| 181 | beforeEach(() => { |
| 182 | isolatedScope.config.filter = 'fulltext'; |
| 183 | scope.$digest(); |
| 184 | }); |
| 185 | |
| 186 | it('should render a text field', () => { |
| 187 | var textField = element[0].getElementsByTagName('input'); |
| 188 | expect(textField.length).toEqual(1); |
| 189 | }); |
| 190 | |
| 191 | describe('and a value is enterd', () => { |
| 192 | beforeEach(() => { |
| 193 | isolatedScope.query = '2.2'; |
| 194 | scope.$digest(); |
| 195 | }); |
| 196 | |
| 197 | it('should contain 2 rows', function() { |
| 198 | var tr = element[0].getElementsByTagName('tr'); |
| 199 | expect(tr.length).toEqual(2); |
| 200 | }); |
| 201 | }); |
| 202 | }); |
| 203 | |
| 204 | describe('when filter is field', () => { |
| 205 | beforeEach(() => { |
| 206 | isolatedScope.config.filter = 'field'; |
| 207 | scope.$digest(); |
| 208 | }); |
| 209 | |
| 210 | it('should render a text field for each column', () => { |
| 211 | var textField = element[0].getElementsByTagName('input'); |
| 212 | expect(textField.length).toEqual(2); |
| 213 | }); |
| 214 | |
| 215 | describe('and a value is enterd', () => { |
| 216 | beforeEach(() => { |
| 217 | isolatedScope.query = {'label-1': '2.1'}; |
| 218 | scope.$digest(); |
| 219 | }); |
| 220 | |
| 221 | it('should contain 3 rows', function() { |
| 222 | var tr = element[0].getElementsByTagName('tr'); |
| 223 | expect(tr.length).toEqual(3); |
| 224 | }); |
| 225 | }); |
| 226 | }); |
Matteo Scandolo | f32a2e9 | 2016-04-14 17:19:08 -0700 | [diff] [blame] | 227 | |
| 228 | describe('when order is true', () => { |
| 229 | beforeEach(() => { |
| 230 | isolatedScope.config.order = true; |
| 231 | scope.$digest(); |
| 232 | }); |
| 233 | |
| 234 | it('should render a arrows beside', () => { |
| 235 | var arrows = element[0].getElementsByTagName('i'); |
| 236 | expect(arrows.length).toEqual(4); |
| 237 | }); |
| 238 | |
| 239 | describe('and an order is set', () => { |
| 240 | beforeEach(() => { |
| 241 | isolatedScope.orderBy = 'label-1'; |
| 242 | isolatedScope.reverse = true; |
| 243 | scope.$digest(); |
| 244 | }); |
| 245 | |
| 246 | it('should orderBy', function() { |
| 247 | var tr = element[0].getElementsByTagName('tr'); |
| 248 | expect(angular.element(tr[1]).text()).toContain('Sample 2.2'); |
| 249 | expect(angular.element(tr[2]).text()).toContain('Sample 1.1'); |
| 250 | }); |
| 251 | }); |
| 252 | }); |
Matteo Scandolo | a7e64fd | 2016-04-14 14:59:09 -0700 | [diff] [blame] | 253 | }); |
| 254 | }); |
| 255 | }); |
| 256 | })(); |
| 257 | |