chai-jquery

chai-jquery is an extension to the chai assertion library that
provides a set of jQuery-specific assertions.

Usage

Include chai-jquery.js in your test file, after jquery.js and chai.js (version 1.0.0-rc1 or later):

``html



`

Note that jquery.js and chai.js can be inserted one before another (order does not matter here).

Use the assertions with chai's expect or should assertions.

Assertions

$3


Assert that the first element of the selection has the given attribute, using .attr().
Optionally, assert a particular value as well. The return value is available for chaining.

`js
$('#header').should.have.attr('foo');
expect($('body')).to.have.attr('foo', 'bar');
expect($('body')).to.have.attr('foo').match(/bar/);
`

$3


Assert that the first element of the selection has the given property, using .prop().
Optionally, assert a particular value as well. The return value is available for chaining.

`js
$('#header').should.have.prop('disabled');
expect($('body')).to.have.prop('disabled', false);
expect($('body')).to.have.prop('value').match(/bar/);
`

$3


Assert that the first element of the selection has the given CSS property, using .css().
Optionally, assert the computed value as well. The return value is available for chaining.

`js
$('#header').should.have.css('background');
expect($('body')).to.have.css('background-color', 'rgb(0, 0, 0)');
expect($('body')).to.have.css('font-family').match(/sans-serif/);
`

$3


Assert that the first element of the selection has the given data value, using .data().
Optionally, assert a particular value as well. The return value is available for chaining.

`js
$('#header').should.have.data('foo');
expect($('body')).to.have.data('foo', 'bar');
expect($('body')).to.have.data('foo').match(/bar/);
`

$3


Assert that the first element of the selection has the given class, using .hasClass().

`js
$('#header').should.have.class('foo');
expect($('body')).to.have.class('foo');
`

$3


Assert that the first element of the selection has the given id, using .attr('id').

`js
$('.header').should.have.id('#main');
expect($('body')).to.have.id('foo');
`

$3


Assert that the html of the first element of the selection is equal to the given html, using .html().

`js
$('.name').should.have.html('John Doe');
expect($('#title')).to.have.html('Chai Tea');
`

$3


Assert that the text of the first element of the selection is equal to the given text, using .text().

`js
$('.name').should.have.text('John Doe');
expect($('#title')).to.have.text('Chai Tea');
`

$3


Assert that the first element of the selection has the given value, using .val().

`js
$('.name').should.have.value('John Doe');
expect($('.year')).to.have.value('2012');
`

$3


Assert that at least one element of the selection is visible, using .is(':visible').

`js
$('.name').should.be.visible;
expect($('.year')).to.be.visible;
`

$3


Assert that at least one element of the selection is hidden, using .is(':hidden').

`js
$('.name').should.be.hidden;
expect($('.year')).to.be.hidden;
`

$3


Assert that at least one element of the selection is selected, using .is(':selected').

`js
$('option').should.be.selected;
expect($('option')).not.to.be.selected;
`

$3


Assert that at least one element of the selection is checked, using .is(':checked').

`js
$('.checked').should.be.checked;
expect($('input')).not.to.be.checked;
`

$3


Assert that at least one element of the selection is enabled, using .is(':enabled').

`js
$('.enabled').should.be.enabled;
expect($('enabled')).to.be.enabled;
`

$3


Assert that at least one element of the selection is disabled, using .is(':disabled').

`js
$('.disabled').should.be.disabled;
expect($('input')).not.to.be.disabled;
`

$3


Assert that at least one element of the selection is empty, using .is(':empty').
If the object asserted against is not a jQuery object, the original implementation will be called.

`js
$('.empty').should.be.empty;
expect($('body')).not.to.be.empty;
`

$3

Assert that the selection is not empty. Note that this overrides the built-in chai assertion. If the object asserted
against is not a jQuery object, the original implementation will be called.

`js
$('#exists').should.exist;
expect($('#nonexistent')).not.to.exist;
`

$3


Assert that the selection matches a given selector, using .is(). Note that this overrides
the built-in chai assertion. If the object asserted against is not a jQuery object, the original implementation will be called.

`js
$('input').should.match('#foo');
expect($('#empty')).to.match(':empty');
`

$3


Assert that the selection contains the given text, using :contains().
If the object asserted against is not a jQuery object, or if contain is not called as a function, the original
implementation will be called.

`js
$('body').should.contain('text');
expect($('#content')).to.contain('text');
`

$3


Assert that the selection contains at least one element which has a descendant matching the given selector,
using .has().

`js
$('body').should.have.descendants('h1');
expect($('#content')).to.have.descendants('div');
`

$3


Assert that at least one element of the selection is visible. Note that this assertion does not use .is(':focus').
It rather uses $('.element').get(0) === document.activeElement, because of incompatibility of .is(':focus') in certain webkit browsers.

`js
$('#focused').should.have.focus();
expect($('#nonfocused')).not.have.focus();
`

Contributing

To run the test suite, run npm install (requires
Node.js to be installed on your system), and open
test/index.html` in your web browser.

License

Copyright (c) 2012 John Firebaugh

MIT License (see the LICENSE file)