1 |
|
2 | var id = function (id){ return document.getElementById(id); };
|
3 | var tf = new TableFilter('demo', {
|
4 | base_path: '../dist/tablefilter/',
|
5 | col_3: 'checklist',
|
6 | load_filters_on_demand: false
|
7 | });
|
8 | tf.init();
|
9 |
|
10 | var checkList = tf.feature('checkList');
|
11 | module('Sanity checks');
|
12 | test('CheckList component', function() {
|
13 | deepEqual(typeof checkList, 'object', 'CheckList instanciated');
|
14 | deepEqual(checkList.containers instanceof Array, true,
|
15 | 'Type of containers property');
|
16 | });
|
17 |
|
18 | module('UI elements');
|
19 | test('CheckList UI elements', function() {
|
20 | var flt = id(tf.fltIds[3]);
|
21 | notEqual(flt, null, 'CheckList UL element');
|
22 | deepEqual(flt.firstChild.nodeName, 'LI',
|
23 | 'First CheckList option element name');
|
24 | deepEqual(flt.childNodes.length, 8, 'number of checklist options');
|
25 | });
|
26 |
|
27 | module('Behaviour');
|
28 | test('Can filter on checkList item click', function() {
|
29 | var flt3 = tf.getFilterElement(3);
|
30 |
|
31 | var evObj = document.createEvent('HTMLEvents');
|
32 | evObj.initEvent('click', true, true);
|
33 | tf.setFilterValue(3, '1.1');
|
34 | flt3.querySelectorAll('input')[1].dispatchEvent(evObj);
|
35 |
|
36 | deepEqual(tf.getValidRows().length, 1, 'Table filtered');
|
37 | deepEqual(tf.getFilteredData()[0][1][3], '1.1', 'Matched value');
|
38 | });
|
39 | test('Can refresh all drop-down filters', function() {
|
40 |
|
41 | tf.clearFilters();
|
42 | var build = checkList.build;
|
43 | var hit = 0;
|
44 | checkList.build = function() { hit++; };
|
45 |
|
46 |
|
47 | checkList.refreshAll();
|
48 |
|
49 |
|
50 | deepEqual(hit, 1, 'build method called');
|
51 |
|
52 | checkList.build = build;
|
53 | });
|
54 | test('Can select options', function() {
|
55 | tf.clearFilters();
|
56 | var flt1 = id(tf.fltIds[3]);
|
57 |
|
58 | checkList.selectOptions(3, ['1.4', '.6']);
|
59 |
|
60 | notEqual(flt1.getAttribute('value').indexOf('1.4'), -1, 'Option selected');
|
61 | notEqual(flt1.getAttribute('value').indexOf('.6'), -1, 'Option selected');
|
62 | });
|
63 | test('Can get selected values', function() {
|
64 |
|
65 | var values = ['.6', '1.4'];
|
66 | tf.clearFilters();
|
67 | tf.setFilterValue(3, values);
|
68 |
|
69 |
|
70 | var result = checkList.getValues(3);
|
71 |
|
72 |
|
73 | deepEqual(values, result);
|
74 | });
|
75 | test('Can return values when no selected options', function() {
|
76 |
|
77 | tf.clearFilters();
|
78 |
|
79 |
|
80 | var result = checkList.getValues(3);
|
81 |
|
82 |
|
83 | deepEqual([''], result);
|
84 | });
|
85 | test('Can return values checklist element has no value attribute', function() {
|
86 |
|
87 | tf.getFilterElement(3).removeAttribute('value');
|
88 |
|
89 |
|
90 | var result = checkList.getValues(3);
|
91 |
|
92 |
|
93 | deepEqual([''], result);
|
94 | });
|
95 |
|
96 |
|
97 | module('Options sorting');
|
98 | test('Can sort options', function() {
|
99 | tf.clearFilters();
|
100 | tf.destroy();
|
101 | tf = new TableFilter('demo', {
|
102 | base_path: '../dist/tablefilter/',
|
103 | col_0: 'checklist',
|
104 | col_1: 'checklist',
|
105 | col_2: 'checklist',
|
106 | col_3: 'checklist',
|
107 | col_4: 'checklist',
|
108 | col_types: ['string', 'string', 'number', 'number', 'number'],
|
109 | sort_filter_options_asc: [0, 2, 3],
|
110 | sort_filter_options_desc: [1, 4]
|
111 | });
|
112 | tf.init();
|
113 |
|
114 | var flt0 = id(tf.fltIds[0]);
|
115 | var flt1 = id(tf.fltIds[1]);
|
116 | var flt2 = id(tf.fltIds[2]);
|
117 | var flt3 = id(tf.fltIds[3]);
|
118 | var flt4 = id(tf.fltIds[4]);
|
119 |
|
120 | deepEqual(
|
121 | flt0.getElementsByTagName('li')[1].firstChild.firstChild.value,
|
122 | 'Adelaide',
|
123 | 'First option value for column 0'
|
124 | );
|
125 | deepEqual(
|
126 | flt0.getElementsByTagName('li')[2].firstChild.firstChild.value,
|
127 | 'Sydney',
|
128 | 'Last option value for column 0'
|
129 | );
|
130 | deepEqual(
|
131 | flt1.getElementsByTagName('li')[1].firstChild.firstChild.value,
|
132 | 'Perth',
|
133 | 'First option value for column 1'
|
134 | );
|
135 | deepEqual(
|
136 | flt1.getElementsByTagName('li')[6].firstChild.firstChild.value,
|
137 | 'Adelaide',
|
138 | 'Last option value for column 1'
|
139 | );
|
140 | deepEqual(
|
141 | flt2.getElementsByTagName('li')[1].firstChild.firstChild.value,
|
142 | '286',
|
143 | 'First option value for column 2'
|
144 | );
|
145 | deepEqual(
|
146 | flt2.getElementsByTagName('li')[7].firstChild.firstChild.value,
|
147 | '2781',
|
148 | 'Last option value for column 2'
|
149 | );
|
150 | deepEqual(
|
151 | flt3.getElementsByTagName('li')[1].firstChild.firstChild.value,
|
152 | '.6',
|
153 | 'First option value for column 3'
|
154 | );
|
155 | deepEqual(
|
156 | flt3.getElementsByTagName('li')[7].firstChild.firstChild.value,
|
157 | '3.1',
|
158 | 'Last option value for column 3'
|
159 | );
|
160 | deepEqual(
|
161 | flt4.getElementsByTagName('li')[1].firstChild.firstChild.value,
|
162 | '40',
|
163 | 'First option value for column 4'
|
164 | );
|
165 | deepEqual(
|
166 | flt4.getElementsByTagName('li')[7].firstChild.firstChild.value,
|
167 | '4.3',
|
168 | 'Last option value for column 4'
|
169 | );
|
170 | });
|
171 |
|
172 |
|
173 | module('Empty and non-empty options');
|
174 | test('Can select empty and non-empty options', function() {
|
175 |
|
176 | tf.clearFilters();
|
177 | tf.destroy();
|
178 | tf = new TableFilter('demo', {
|
179 | base_path: '../dist/tablefilter/',
|
180 | col_2: 'checklist',
|
181 | col_3: 'checklist',
|
182 | enable_empty_option: true,
|
183 | enable_non_empty_option: true
|
184 | });
|
185 | tf.init();
|
186 | var checkList = tf.feature('checkList');
|
187 | var flt2 = tf.getFilterElement(2);
|
188 | var flt3 = tf.getFilterElement(3);
|
189 |
|
190 |
|
191 | checkList.selectOptions(2, [tf.emOperator, tf.nmOperator]);
|
192 | checkList.selectOptions(3, [tf.emOperator, tf.nmOperator, '1.4']);
|
193 |
|
194 |
|
195 | deepEqual(checkList.getValues(2), [tf.emOperator, tf.nmOperator],
|
196 | 'Filter 2 empty and non-empty options selected');
|
197 | notEqual(flt2.getAttribute('value').indexOf(tf.emOperator), -1,
|
198 | 'Filter 2 options values attribute');
|
199 | notEqual(flt2.getAttribute('value').indexOf(tf.nmOperator), -1,
|
200 | 'Filter 2 options values attribute');
|
201 | deepEqual(checkList.getValues(3), [tf.emOperator, tf.nmOperator, '1.4'],
|
202 | 'Filter 3 options selected');
|
203 | notEqual(flt3.getAttribute('value').indexOf(tf.emOperator), -1,
|
204 | 'Filter 3 options values attribute');
|
205 | notEqual(flt3.getAttribute('value').indexOf(tf.nmOperator), -1,
|
206 | 'Filter 3 options values attribute');
|
207 | });
|
208 |
|
209 |
|
210 | module('Clear filter text');
|
211 | test('Can define clear filter text for each column', function() {
|
212 | tf.clearFilters();
|
213 | tf.destroy();
|
214 | tf = new TableFilter('demo', {
|
215 | base_path: '../dist/tablefilter/',
|
216 | col_2: 'checklist',
|
217 | col_3: 'checklist',
|
218 | col_4: 'checklist',
|
219 | clear_filter_text: [null, null, 'clear 2', 'clear 3', 'clear 4']
|
220 | });
|
221 | tf.init();
|
222 |
|
223 | var flt2 = tf.getFilterElement(2).getElementsByTagName('li');
|
224 | var flt3 = tf.getFilterElement(3).getElementsByTagName('li');
|
225 | var flt4 = tf.getFilterElement(4).getElementsByTagName('li');
|
226 |
|
227 | deepEqual(flt2[0].getElementsByTagName('label')[0].innerText,
|
228 | 'clear 2', 'clear text filter 2');
|
229 | deepEqual(flt3[0].getElementsByTagName('label')[0].innerText,
|
230 | 'clear 3', 'clear text filter 3');
|
231 | deepEqual(flt4[0].getElementsByTagName('label')[0].innerText,
|
232 | 'clear 4', 'clear text filter 4');
|
233 | });
|
234 | test('Can define clear filter text globally', function() {
|
235 | tf.clearFilters();
|
236 | tf.destroy();
|
237 | tf = new TableFilter('demo', {
|
238 | base_path: '../dist/tablefilter/',
|
239 | col_2: 'checklist',
|
240 | col_3: 'checklist',
|
241 | col_4: 'checklist',
|
242 | clear_filter_text: 'reset'
|
243 | });
|
244 | tf.init();
|
245 |
|
246 | var flt2 = tf.getFilterElement(2).getElementsByTagName('li');
|
247 | var flt3 = tf.getFilterElement(3).getElementsByTagName('li');
|
248 | var flt4 = tf.getFilterElement(4).getElementsByTagName('li');
|
249 |
|
250 | deepEqual(flt2[0].getElementsByTagName('label')[0].innerText,
|
251 | 'reset', 'clear text filter 2');
|
252 | deepEqual(flt3[0].getElementsByTagName('label')[0].innerText,
|
253 | 'reset', 'clear text filter 3');
|
254 | deepEqual(flt4[0].getElementsByTagName('label')[0].innerText,
|
255 | 'reset', 'clear text filter 4');
|
256 | });
|
257 |
|
258 | module('Tear down');
|
259 | test('TableFilter removed', function() {
|
260 | tf.destroy();
|
261 | deepEqual(id(tf.fltIds[3]), null, 'CheckList UL element');
|
262 | deepEqual(
|
263 | tf.feature('checkList').initialized,
|
264 | false,
|
265 | 'CheckList not initialised'
|
266 | );
|
267 | });
|