Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

chai-dom

Package Overview
Dependencies
Maintainers
1
Versions
20
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

chai-dom

DOM assertions for the Chai assertion library using vanilla JavaScript

  • 1.5.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
69K
increased by11.9%
Maintainers
1
Weekly downloads
 
Created
Source

chai-dom

Build Status

chai-dom is an extension to the chai assertion library that provides a set of assertions when working with the DOM (specifically HTMLElement and NodeList)

Forked from chai-jquery to use for those of us freed of jQuery's baggage.

Assertions

attr(name[, value])

attribute(name[, value])

Assert that the HTMLElement has the given attribute, using getAttribute. Optionally, assert a particular value as well. The return value is available for chaining.

document.getElementById('header').should.have.attr('foo')
expect(document.querySelector('main article')).to.have.attribute('foo', 'bar')
expect(document.querySelector('main article')).to.have.attr('foo').match(/bar/)

class(className)

Assert that the HTMLElement has the given class, using classList.

document.getElementsByName('bar').should.have.class('foo')
expect(document.querySelector('main article')).to.have.class('foo')

id(id)

Assert that the HTMLElement has the given id.

document.querySelector('section').should.have.id('#main')
expect(document.querySelector('section')).to.have.id('foo')

html(html)

Assert that the html of the HTMLElement is equal to or contains the given html.

document.querySelector('.name').should.have.html('<em>John Doe</em>')
expect(document.querySelector('#title')).to.have.html('Chai Tea')
document.querySelector('.name').should.contain.html('<span>Doe</span>')
expect(document.querySelector('#title')).to.contain.html('<em>Tea</em>')

text(text)

Assert that the text of the HTMLElement or combined text of the NodeList is equal to or contains the given text, using textContent.

document.querySelector('.name').should.have.text('John Doe')
expect(document.querySelector('#title')).to.have.text('Chai Tea')
document.querySelectorAll('ul li').should.have.text('JohnJaneJessie')
document.querySelector('.name').should.contain.text('John')
expect(document.querySelector('#title')).to.contain.text('Chai')
document.querySelectorAll('ul li').should.contain.text('Jane')

text(text[])

Assert that the textContent of the NodeList children deep equal those text, or when using the contains flag, all the text items are somewhere in the NodeList.

document.querySelectorAll('.name').should.have.text(['John Doe', 'Jane'])
expect(document.querySelectorAll('ul li')).to.have.text(['John', 'Jane', 'Jessie'])
document.querySelectorAll('.name').should.contain.text(['John Doe'])
expect(document.querySelectorAll('ul li')).to.contain.text(['John', 'Jessie'])

value(value)

Assert that the HTMLElement has the given value

document.querySelector('.name').should.have.value('John Doe')
expect(document.querySelector('input.year')).to.have.value('2012')

empty

Assert that the HTMLElement or NodeList has no child nodes. If the object asserted against is neither of those, the original implementation will be called.

document.querySelector('.empty').should.be.empty
expect(document.querySelector('section')).not.to.be.empty

length(n)

Assert that the HTMLElement or NodeList has exactly n child nodes. If the object asserted against is neither of those, the original implementation will be called.

document.querySelector('ul').should.have.length(2)
document.querySelector('li').should.have.length(2)
expect(document.querySelector('ul')).not.to.have.length(3)

exist

Assert that the NodeList is not empty. If the object asserted against is not a NodeList, the original implementation will be called.

document.querySelectorAll('dl dd').should.exist
expect(document.querySelectorAll('.nonexistent')).not.to.exist

match(selector)

Assert that the selection matches an HTMLElement or all elements in a NodeList, using matches. If the object asserted against is neither of those, the original implementation will be called.

Note matches is DOM Level 4, so you may need a polyfill for it.

document.querySelectorAll('input').should.match('[name="bar"]')
expect(document.getElementById('empty')).to.match('.disabled')

contain(selector or element)

Assert that the HTMLElement contains the given element, using querySelectorAll for selector strings or using contains for elements. If the object asserted against is not an HTMLElement, or if contain is not called as a function, the original implementation will be called.

document.querySelector('section').should.contain('ul.items')
document.querySelector('section').should.contain(document.querySelector('section div'))
expect(document.querySelector('#content')).to.contain('p')

displayed

Assert that the HTMLElement is displayed (that display is not equal to "none"). If the element is attached to the body, it will call getComputedStyle; otherwise it will look at the inline display attribute.

document.querySelector('dl dd').should.be.displayed
expect(document.querySelector('.hidden')).not.to.be.displayed

Installation

npm

npm install chai-dom

bower

bower install chai-dom

Usage

CommonJS

var chai = require('chai')
chai.use(require('chai-dom'))

AMD

require(['chai', 'chai-dom'], function(chai, chaiDom) {
  chai.use(chaiDom)
})

Global

<script src="chai.js"></script>
<script src="chai-dom.js"></script>

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

Contributing

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

License

MIT License (see the LICENSE file)

Keywords

FAQs

Package last updated on 31 May 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc