Add CSS selector support to assertField
Showing
6 changed files
with
218 additions
and
22 deletions
... | @@ -160,7 +160,7 @@ Asserts that a given subject is `falsy <http://11heavens.com/falsy-and-truthy-in | ... | @@ -160,7 +160,7 @@ Asserts that a given subject is `falsy <http://11heavens.com/falsy-and-truthy-in |
160 | ``assertField()`` | 160 | ``assertField()`` |
161 | ------------------------------------------------------------------------------- | 161 | ------------------------------------------------------------------------------- |
162 | 162 | ||
163 | **Signature:** ``assertField(String inputName, String expected[, String message, Object options])`` | 163 | **Signature:** ``assertField(String|object input, String expected[, String message, Object options])`` |
164 | 164 | ||
165 | Asserts that a given form field has the provided value:: | 165 | Asserts that a given form field has the provided value:: |
166 | 166 | ||
... | @@ -173,6 +173,16 @@ Asserts that a given form field has the provided value:: | ... | @@ -173,6 +173,16 @@ Asserts that a given form field has the provided value:: |
173 | }); | 173 | }); |
174 | }); | 174 | }); |
175 | 175 | ||
176 | // Path usage with type 'css' | ||
177 | casper.test.begin('assertField() tests', 1, function(test) { | ||
178 | casper.start('http://www.google.fr/', function() { | ||
179 | this.fill('form[name="gs"]', { q: 'plop' }, false); | ||
180 | test.assertField({type: 'css', path: '.q.foo'}, 'plop'); | ||
181 | }).run(function() { | ||
182 | test.done(); | ||
183 | }); | ||
184 | }); | ||
185 | |||
176 | .. versionadded:: 1.0 | 186 | .. versionadded:: 1.0 |
177 | 187 | ||
178 | This also works with any input type: ``select``, ``textarea``, etc. | 188 | This also works with any input type: ``select``, ``textarea``, etc. |
... | @@ -182,6 +192,63 @@ This also works with any input type: ``select``, ``textarea``, etc. | ... | @@ -182,6 +192,63 @@ This also works with any input type: ``select``, ``textarea``, etc. |
182 | The `options` parameter allows to set the options to use with | 192 | The `options` parameter allows to set the options to use with |
183 | :ref:`ClientUtils#getFieldValue() <clientutils_getfieldvalue>`. | 193 | :ref:`ClientUtils#getFieldValue() <clientutils_getfieldvalue>`. |
184 | 194 | ||
195 | `input` parameter introspects whether or not a `type` key is passed in with `xpath` or `css` and a property `path` specified along with it. | ||
196 | |||
197 | ``assertFieldName()`` | ||
198 | ------------------------------------------------------------------------------- | ||
199 | |||
200 | **Signature:** ``assertFieldName(String inputName, String expected[, String message, Object options])`` | ||
201 | |||
202 | .. versionadded:: 1.1-beta3 | ||
203 | |||
204 | Asserts that a given form field has the provided value:: | ||
205 | |||
206 | casper.test.begin('assertField() tests', 1, function(test) { | ||
207 | casper.start('http://www.google.fr/', function() { | ||
208 | this.fill('form[name="gs"]', { q: 'plop' }, false); | ||
209 | test.assertField('q', 'plop', 'did not plop', {formSelector: 'plopper'}); | ||
210 | }).run(function() { | ||
211 | test.done(); | ||
212 | }); | ||
213 | }); | ||
214 | |||
215 | ``assertFieldCSS()`` | ||
216 | ------------------------------------------------------------------------------- | ||
217 | |||
218 | **Signature:** ``assertFieldCSS(String cssSelector, String expected, String message)`` | ||
219 | |||
220 | .. versionadded:: 1.1 | ||
221 | |||
222 | Asserts that a given form field has the provided value given a CSS selector:: | ||
223 | |||
224 | casper.test.begin('assertField() tests', 1, function(test) { | ||
225 | casper.start('http://www.google.fr/', function() { | ||
226 | this.fill('form[name="gs"]', { q: 'plop' }, false); | ||
227 | test.assertField('q', 'plop', 'did not plop', 'input.plop'); | ||
228 | }).run(function() { | ||
229 | test.done(); | ||
230 | }); | ||
231 | }); | ||
232 | |||
233 | ``assertFieldXPath()`` | ||
234 | ------------------------------------------------------------------------------- | ||
235 | |||
236 | **Signature:** ``assertFieldXPath(String xpathSelector, String expected, String message)`` | ||
237 | |||
238 | .. versionadded:: 1.1 | ||
239 | |||
240 | Asserts that a given form field has the provided value given a XPath selector:: | ||
241 | |||
242 | casper.test.begin('assertField() tests', 1, function(test) { | ||
243 | casper.start('http://www.google.fr/', function() { | ||
244 | this.fill('form[name="gs"]', { q: 'plop' }, false); | ||
245 | test.assertField('q', 'plop', 'did not plop', '/html/body/form[0]/input[1]'); | ||
246 | }).run(function() { | ||
247 | test.done(); | ||
248 | }); | ||
249 | }); | ||
250 | |||
251 | |||
185 | .. index:: HTTP, HTTP Status Code | 252 | .. index:: HTTP, HTTP Status Code |
186 | 253 | ||
187 | ``assertHttpStatus()`` | 254 | ``assertHttpStatus()`` | ... | ... |
... | @@ -290,7 +290,7 @@ | ... | @@ -290,7 +290,7 @@ |
290 | * | 290 | * |
291 | * @param String selector CSS3 selector | 291 | * @param String selector CSS3 selector |
292 | * @param HTMLElement|null scope Element to search child elements within | 292 | * @param HTMLElement|null scope Element to search child elements within |
293 | * @return NodeList|undefined | 293 | * @return Array|undefined |
294 | */ | 294 | */ |
295 | this.findAll = function findAll(selector, scope) { | 295 | this.findAll = function findAll(selector, scope) { |
296 | scope = scope || this.options.scope; | 296 | scope = scope || this.options.scope; |
... | @@ -299,7 +299,7 @@ | ... | @@ -299,7 +299,7 @@ |
299 | if (pSelector.type === 'xpath') { | 299 | if (pSelector.type === 'xpath') { |
300 | return this.getElementsByXPath(pSelector.path, scope); | 300 | return this.getElementsByXPath(pSelector.path, scope); |
301 | } else { | 301 | } else { |
302 | return scope.querySelectorAll(pSelector.path); | 302 | return Array.prototype.slice.call(scope.querySelectorAll(pSelector.path)); |
303 | } | 303 | } |
304 | } catch (e) { | 304 | } catch (e) { |
305 | this.log('findAll(): invalid selector provided "' + selector + '":' + e, "error"); | 305 | this.log('findAll(): invalid selector provided "' + selector + '":' + e, "error"); |
... | @@ -560,10 +560,19 @@ | ... | @@ -560,10 +560,19 @@ |
560 | } | 560 | } |
561 | } | 561 | } |
562 | var formSelector = ''; | 562 | var formSelector = ''; |
563 | if (options && options.formSelector) { | 563 | if (options.formSelector) { |
564 | formSelector = options.formSelector + ' '; | 564 | formSelector = options.formSelector + ' '; |
565 | } | 565 | } |
566 | var inputs = this.findAll(formSelector + '[name="' + inputName + '"]'); | 566 | var inputs = this.findAll(formSelector + '[name="' + inputName + '"]'); |
567 | |||
568 | if (options.inputSelector) { | ||
569 | inputs = inputs.concat(this.findAll(options.inputSelector)); | ||
570 | } | ||
571 | |||
572 | if (options.inputXPath) { | ||
573 | inputs = inputs.concat(this.getElementsByXPath(options.inputXPath)); | ||
574 | } | ||
575 | |||
567 | switch (inputs.length) { | 576 | switch (inputs.length) { |
568 | case 0: return undefined; | 577 | case 0: return undefined; |
569 | case 1: return getSingleValue(inputs[0]); | 578 | case 1: return getSingleValue(inputs[0]); | ... | ... |
... | @@ -449,6 +449,20 @@ Tester.prototype.assertEvalEqual = function assertEvalEquals(fn, expected, messa | ... | @@ -449,6 +449,20 @@ Tester.prototype.assertEvalEqual = function assertEvalEquals(fn, expected, messa |
449 | }); | 449 | }); |
450 | }; | 450 | }; |
451 | 451 | ||
452 | function baseFieldAssert(inputName, expected, actual, message) { | ||
453 | "use strict"; | ||
454 | |||
455 | return this.assert(utils.equals(actual, expected), message, { | ||
456 | type: 'assertField', | ||
457 | standard: f('"%s" input field has the value "%s"', inputName, expected), | ||
458 | values: { | ||
459 | inputName: inputName, | ||
460 | actual: actual, | ||
461 | expected: expected | ||
462 | } | ||
463 | }); | ||
464 | } | ||
465 | |||
452 | /** | 466 | /** |
453 | * Asserts that the provided assertion fails (used for internal testing). | 467 | * Asserts that the provided assertion fails (used for internal testing). |
454 | * | 468 | * |
... | @@ -473,26 +487,65 @@ Tester.prototype.assertFail = function assertFail(fn, message) { | ... | @@ -473,26 +487,65 @@ Tester.prototype.assertFail = function assertFail(fn, message) { |
473 | /** | 487 | /** |
474 | * Asserts that a given input field has the provided value. | 488 | * Asserts that a given input field has the provided value. |
475 | * | 489 | * |
476 | * @param String inputName The name attribute of the input element | 490 | * @param String|Object input The name attribute of the input element |
491 | * or an object with the selector | ||
477 | * @param String expected The expected value of the input element | 492 | * @param String expected The expected value of the input element |
478 | * @param String message Test description | 493 | * @param String message Test description |
479 | * @param Object options ClientUtils#getFieldValue options (optional) | 494 | * @param Object options ClientUtils#getFieldValue options (optional) |
480 | * @return Object An assertion result object | 495 | * @return Object An assertion result object |
481 | */ | 496 | */ |
482 | Tester.prototype.assertField = function assertField(inputName, expected, message, options) { | 497 | Tester.prototype.assertField = function assertField(input, expected, message, options) { |
483 | "use strict"; | 498 | "use strict"; |
499 | |||
500 | if (typeof input === 'object') { | ||
501 | switch (input.type) { | ||
502 | case 'css': | ||
503 | return this.assertFieldCSS(input.path, expected, message); | ||
504 | case 'xpath': | ||
505 | return this.assertFieldXPath(input.path, expected, message); | ||
506 | // no default | ||
507 | } | ||
508 | } | ||
509 | |||
484 | var actual = this.casper.evaluate(function(inputName, options) { | 510 | var actual = this.casper.evaluate(function(inputName, options) { |
485 | return __utils__.getFieldValue(inputName, options); | 511 | return __utils__.getFieldValue(inputName, options); |
486 | }, inputName, options); | 512 | }, input, options); |
487 | return this.assert(utils.equals(actual, expected), message, { | 513 | |
488 | type: 'assertField', | 514 | return baseFieldAssert.call(this, input, expected, actual, message); |
489 | standard: f('"%s" input field has the value "%s"', inputName, expected), | 515 | }; |
490 | values: { | 516 | |
491 | inputName: inputName, | 517 | /** |
492 | actual: actual, | 518 | * Asserts that a given input field by CSS selector has the provided value. |
493 | expected: expected | 519 | * |
494 | } | 520 | * @param Object cssSelector The CSS selector to use for the assert field value |
495 | }); | 521 | * @param String expected The expected value of the input element |
522 | * @param String message Test description | ||
523 | * @return Object An assertion result object | ||
524 | */ | ||
525 | Tester.prototype.assertFieldCSS = function assertFieldCSS(cssSelector, expected, message) { | ||
526 | "use strict"; | ||
527 | var actual = this.casper.evaluate(function(inputName, cssSelector) { | ||
528 | return __utils__.getFieldValue(inputName, {inputSelector: cssSelector}); | ||
529 | }, null, cssSelector); | ||
530 | |||
531 | return baseFieldAssert.call(this, null, expected, actual, message); | ||
532 | }; | ||
533 | |||
534 | /** | ||
535 | * Asserts that a given input field by XPath selector has the provided value. | ||
536 | * | ||
537 | * @param Object xPathSelector The XPath selector to use for the assert field value | ||
538 | * @param String expected The expected value of the input element | ||
539 | * @param String message Test description | ||
540 | * @return Object An assertion result object | ||
541 | */ | ||
542 | Tester.prototype.assertFieldXPath = function assertFieldXPath(xPathSelector, expected, message) { | ||
543 | "use strict"; | ||
544 | var actual = this.casper.evaluate(function(inputName, xPathSelector) { | ||
545 | return __utils__.getFieldValue(inputName, {inputXPath: xPathSelector}); | ||
546 | }, null, xPathSelector); | ||
547 | |||
548 | return baseFieldAssert.call(this, null, expected, actual, message); | ||
496 | }; | 549 | }; |
497 | 550 | ||
498 | /** | 551 | /** | ... | ... |
... | @@ -6,7 +6,7 @@ | ... | @@ -6,7 +6,7 @@ |
6 | </head> | 6 | </head> |
7 | <body> | 7 | <body> |
8 | <form action="result.html" enctype="multipart/form-data"> | 8 | <form action="result.html" enctype="multipart/form-data"> |
9 | <input type="text" name="email" placeholder="email"> | 9 | <input type="text" name="email" placeholder="email" id="email"> |
10 | <input type="password" name="password" placeholder="password"> | 10 | <input type="password" name="password" placeholder="password"> |
11 | <input type="text" name="language" placeholder="language"> | 11 | <input type="text" name="language" placeholder="language"> |
12 | <input type="whatever" name="strange"> | 12 | <input type="whatever" name="strange"> | ... | ... |
... | @@ -51,17 +51,17 @@ casper.test.begin('ClientUtils.exists() tests', 5, function(test) { | ... | @@ -51,17 +51,17 @@ casper.test.begin('ClientUtils.exists() tests', 5, function(test) { |
51 | casper.test.begin('ClientUtils.findAll() tests', 7, function(test) { | 51 | casper.test.begin('ClientUtils.findAll() tests', 7, function(test) { |
52 | var clientutils = require('clientutils').create(); | 52 | var clientutils = require('clientutils').create(); |
53 | fakeDocument('<ul class="foo"><li>bar</li><li>baz</li></ul>'); | 53 | fakeDocument('<ul class="foo"><li>bar</li><li>baz</li></ul>'); |
54 | test.assertType(clientutils.findAll('li'), 'nodelist', | 54 | test.assertType(clientutils.findAll('li'), 'array', |
55 | 'ClientUtils.findAll() can find matching DOM elements'); | 55 | 'ClientUtils.findAll() can find matching DOM elements'); |
56 | test.assertEquals(clientutils.findAll('li').length, 2, | 56 | test.assertEquals(clientutils.findAll('li').length, 2, |
57 | 'ClientUtils.findAll() can find matching DOM elements'); | 57 | 'ClientUtils.findAll() can find matching DOM elements'); |
58 | test.assertType(clientutils.findAll('ol'), 'nodelist', | 58 | test.assertType(clientutils.findAll('ol'), 'array', |
59 | 'ClientUtils.findAll() can find matching DOM elements'); | 59 | 'ClientUtils.findAll() can find matching DOM elements'); |
60 | test.assertEquals(clientutils.findAll('ol').length, 0, | 60 | test.assertEquals(clientutils.findAll('ol').length, 0, |
61 | 'ClientUtils.findAll() can find matching DOM elements'); | 61 | 'ClientUtils.findAll() can find matching DOM elements'); |
62 | // scoped | 62 | // scoped |
63 | var scope = clientutils.findOne('ul'); | 63 | var scope = clientutils.findOne('ul'); |
64 | test.assertType(clientutils.findAll('li', scope), 'nodelist', | 64 | test.assertType(clientutils.findAll('li', scope), 'array', |
65 | 'ClientUtils.findAll() can find matching DOM elements within a given scope'); | 65 | 'ClientUtils.findAll() can find matching DOM elements within a given scope'); |
66 | test.assertEquals(clientutils.findAll('li', scope).length, 2, | 66 | test.assertEquals(clientutils.findAll('li', scope).length, 2, |
67 | 'ClientUtils.findAll() can find matching DOM elements within a given scope'); | 67 | 'ClientUtils.findAll() can find matching DOM elements within a given scope'); | ... | ... |
... | @@ -129,8 +129,75 @@ casper.test.begin('Tester.assertField(): nonexistent fields', 2, function(test) | ... | @@ -129,8 +129,75 @@ casper.test.begin('Tester.assertField(): nonexistent fields', 2, function(test) |
129 | test.assertFail(function() { | 129 | test.assertFail(function() { |
130 | test.assertField('nonexistent', ''); | 130 | test.assertField('nonexistent', ''); |
131 | }, 'Tester.assertField() only checks for existing fields'); | 131 | }, 'Tester.assertField() only checks for existing fields'); |
132 | }).run(function() { | ||
133 | test.done(); | ||
134 | }); | ||
135 | }); | ||
136 | |||
137 | casper.test.begin('Tester.assertField(): CSS selectors', 1, function(test) { | ||
138 | casper.start('tests/site/form.html', function() { | ||
139 | this.fill('form[action="result.html"]', { | ||
140 | 'email': 'albert@camus.com' | ||
132 | }); | 141 | }); |
133 | casper.run(function() { | 142 | |
143 | test.assertField({ | ||
144 | type: 'css', | ||
145 | path: '#email' | ||
146 | }, | ||
147 | 'albert@camus.com', | ||
148 | 'Tester.assertField() works as expected with CSS selectors' | ||
149 | ); | ||
150 | }).run(function() { | ||
134 | test.done(); | 151 | test.done(); |
135 | }) | 152 | }); |
153 | }); | ||
154 | |||
155 | casper.test.begin('Tester.assertField(): XPath selectors', 1, function(test) { | ||
156 | casper.start('tests/site/form.html', function() { | ||
157 | this.fill('form[action="result.html"]', { | ||
158 | 'email': 'albert@camus.com' | ||
159 | }); | ||
160 | |||
161 | test.assertField({ | ||
162 | type: 'xpath', | ||
163 | path: '/html/body/form[1]/input[1]' | ||
164 | }, | ||
165 | 'albert@camus.com', | ||
166 | 'Tester.assertField() works as expected with XPath selectors' | ||
167 | ); | ||
168 | }).run(function() { | ||
169 | test.done(); | ||
170 | }); | ||
171 | }); | ||
172 | |||
173 | casper.test.begin('Tester.assertFieldCSS(): CSS selectors', 1, function(test) { | ||
174 | casper.start('tests/site/form.html', function() { | ||
175 | this.fill('form[action="result.html"]', { | ||
176 | 'email': 'albert@camus.com' | ||
177 | }); | ||
178 | |||
179 | test.assertFieldCSS( | ||
180 | '#email', | ||
181 | 'albert@camus.com', | ||
182 | 'Tester.assertFieldCSS() works as expected with CSS selectors' | ||
183 | ); | ||
184 | }).run(function() { | ||
185 | test.done(); | ||
186 | }); | ||
187 | }); | ||
188 | |||
189 | casper.test.begin('Tester.assertFieldXPath(): XPath selectors', 1, function(test) { | ||
190 | casper.start('tests/site/form.html', function() { | ||
191 | this.fill('form[action="result.html"]', { | ||
192 | 'email': 'albert@camus.com' | ||
193 | }); | ||
194 | |||
195 | test.assertFieldXPath( | ||
196 | '/html/body/form[1]/input[1]', | ||
197 | 'albert@camus.com', | ||
198 | 'Tester.assertFieldXPath() works as expected with XPath selectors' | ||
199 | ); | ||
200 | }).run(function() { | ||
201 | test.done(); | ||
202 | }); | ||
136 | }); | 203 | }); |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or sign in to post a comment