754c0d52 by Michael Richards

Merge pull request #143 from kayhadrin/improve-radio-box-binders

Improve checked/unchecked binders for radio box
2 parents 2dfedf1f 1d4f8be7
1 describe('Routines', function() { 1 describe('Routines', function() {
2 var el, input; 2 var el, input, trueRadioInput, falseRadioInput, checkboxInput;
3
4 var createInputElement = function(type, value) {
5 var elem = document.createElement('input');
6 elem.setAttribute('type', type);
7 if (value !== undefined){
8 elem.setAttribute('value', value);
9 }
10 document.body.appendChild(elem);
11 return elem;
12 };
3 13
4 beforeEach(function() { 14 beforeEach(function() {
5 rivets.configure({ 15 rivets.configure({
...@@ -12,8 +22,27 @@ describe('Routines', function() { ...@@ -12,8 +22,27 @@ describe('Routines', function() {
12 }); 22 });
13 23
14 el = document.createElement('div'); 24 el = document.createElement('div');
15 input = document.createElement('input'); 25 document.body.appendChild(el);
16 input.setAttribute('type', 'text'); 26
27 input = createInputElement('text');
28
29 // to test the radio input scenario when its value is "true"
30 trueRadioInput = createInputElement('radio', 'true');
31
32 // to test the radio input scenario when its value is "false"
33 falseRadioInput = createInputElement('radio', 'false');
34
35 // to test the checkbox input scenario
36 checkboxInput = createInputElement('checkbox');
37
38 });
39
40 afterEach(function(){
41 el.parentNode.removeChild(el);
42 input.parentNode.removeChild(input);
43 trueRadioInput.parentNode.removeChild(trueRadioInput);
44 falseRadioInput.parentNode.removeChild(falseRadioInput);
45 checkboxInput.parentNode.removeChild(checkboxInput);
17 }); 46 });
18 47
19 describe('text', function() { 48 describe('text', function() {
...@@ -126,33 +155,101 @@ describe('Routines', function() { ...@@ -126,33 +155,101 @@ describe('Routines', function() {
126 }); 155 });
127 156
128 describe('checked', function() { 157 describe('checked', function() {
129 describe('with a truthy value', function() { 158 describe('with a checkbox input', function() {
130 it('checks the element', function() { 159 describe('and a truthy value', function() {
131 rivets.binders.checked.routine(el, true); 160 it('checks the checkbox input', function() {
132 expect(el.checked).toBe(true); 161 rivets.binders.checked.routine(checkboxInput, true);
162 expect(checkboxInput.checked).toBe(true);
163 });
164 });
165
166 describe('with a falsey value', function() {
167 it('unchecks the checkbox input', function() {
168 rivets.binders.checked.routine(checkboxInput, false);
169 expect(checkboxInput.checked).toBe(false);
170 });
133 }); 171 });
134 }); 172 });
135 173
136 describe('with a falsey value', function() { 174 describe('with a radio input with value="true"', function() {
137 it('unchecks the element', function() { 175 describe('and a truthy value', function() {
138 rivets.binders.checked.routine(el, false); 176 it('checks the radio input', function() {
139 expect(el.checked).toBe(false); 177 rivets.binders.checked.routine(trueRadioInput, true);
178 expect(trueRadioInput.checked).toBe(true);
179 });
180 });
181
182 describe('with a falsey value', function() {
183 it('unchecks the radio input', function() {
184 rivets.binders.checked.routine(trueRadioInput, false);
185 expect(trueRadioInput.checked).toBe(false);
186 });
187 });
188 });
189
190 describe('with a radio input with value="false"', function() {
191 describe('and a truthy value', function() {
192 it('checks the radio input', function() {
193 rivets.binders.checked.routine(falseRadioInput, true);
194 expect(falseRadioInput.checked).toBe(false);
195 });
196 });
197
198 describe('with a falsey value', function() {
199 it('unchecks the radio input', function() {
200 rivets.binders.checked.routine(falseRadioInput, false);
201 expect(falseRadioInput.checked).toBe(true);
202 });
140 }); 203 });
141 }); 204 });
142 }); 205 });
143 206
144 describe('unchecked', function() { 207 describe('unchecked', function() {
145 describe('with a truthy value', function() { 208 describe('and a truthy value', function() {
146 it('unchecks the element', function() { 209 describe('and a truthy value', function() {
147 rivets.binders.unchecked.routine(el, true); 210 it('checks the checkbox input', function() {
148 expect(el.checked).toBe(false); 211 rivets.binders.unchecked.routine(checkboxInput, true);
212 expect(checkboxInput.checked).toBe(false);
213 });
214 });
215
216 describe('with a falsey value', function() {
217 it('unchecks the checkbox input', function() {
218 rivets.binders.unchecked.routine(checkboxInput, false);
219 expect(checkboxInput.checked).toBe(true);
220 });
149 }); 221 });
150 }); 222 });
151 223
152 describe('with a falsey value', function() { 224 describe('with a radio input with value="true"', function() {
153 it('checks the element', function() { 225 describe('and a truthy value', function() {
154 rivets.binders.unchecked.routine(el, false); 226 it('checks the radio input', function() {
155 expect(el.checked).toBe(true); 227 rivets.binders.unchecked.routine(trueRadioInput, true);
228 expect(trueRadioInput.checked).toBe(false);
229 });
230 });
231
232 describe('with a falsey value', function() {
233 it('unchecks the radio input', function() {
234 rivets.binders.unchecked.routine(trueRadioInput, false);
235 expect(trueRadioInput.checked).toBe(true);
236 });
237 });
238 });
239
240 describe('with a radio input with value="false"', function() {
241 describe('and a truthy value', function() {
242 it('checks the radio input', function() {
243 rivets.binders.unchecked.routine(falseRadioInput, true);
244 expect(falseRadioInput.checked).toBe(true);
245 });
246 });
247
248 describe('with a falsey value', function() {
249 it('unchecks the radio input', function() {
250 rivets.binders.unchecked.routine(falseRadioInput, false);
251 expect(falseRadioInput.checked).toBe(false);
252 });
156 }); 253 });
157 }); 254 });
158 }); 255 });
......
...@@ -274,7 +274,7 @@ Rivets.binders = ...@@ -274,7 +274,7 @@ Rivets.binders =
274 unbindEvent el, 'change', @currentListener 274 unbindEvent el, 'change', @currentListener
275 routine: (el, value) -> 275 routine: (el, value) ->
276 if el.type is 'radio' 276 if el.type is 'radio'
277 el.checked = el.value is value 277 el.checked = el.value?.toString() is value?.toString()
278 else 278 else
279 el.checked = !!value 279 el.checked = !!value
280 280
...@@ -286,7 +286,7 @@ Rivets.binders = ...@@ -286,7 +286,7 @@ Rivets.binders =
286 unbindEvent el, 'change', @currentListener 286 unbindEvent el, 'change', @currentListener
287 routine: (el, value) -> 287 routine: (el, value) ->
288 if el.type is 'radio' 288 if el.type is 'radio'
289 el.checked = el.value isnt value 289 el.checked = el.value?.toString() isnt value?.toString()
290 else 290 else
291 el.checked = !value 291 el.checked = !value
292 292
......