https://github.com/developit/preact-jsx-chai

:white_check_mark: Add JSX assertions to Chai, with support for Preact Components.
https://github.com/developit/preact-jsx-chai

chai chai-plugin jsx-assertions jsx-chai preact test testing

Last synced: about 2 months ago
JSON representation

:white_check_mark: Add JSX assertions to Chai, with support for Preact Components.

• Host: GitHub
• URL: https://github.com/developit/preact-jsx-chai
• Owner: developit
• License: mit
• Created: 2015-12-22T00:05:32.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2020-05-29T20:15:31.000Z (over 4 years ago)
• Last Synced: 2024-07-11T21:12:05.002Z (2 months ago)
• Topics: chai, chai-plugin, jsx-assertions, jsx-chai, preact, test, testing
• Language: JavaScript
• Homepage: http://npm.im/preact-jsx-chai
• Size: 122 KB
• Stars: 56
• Watchers: 4
• Forks: 7
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-preact - Preact JSX Chai - JSX assertion testing _(no DOM, right in Node)_. (Uncategorized / Uncategorized)

README

        
# preact-jsx-chai

[![Greenkeeper badge](https://badges.greenkeeper.io/developit/preact-jsx-chai.svg)](https://greenkeeper.io/)

[![NPM](http://img.shields.io/npm/v/preact-jsx-chai.svg)](https://www.npmjs.com/package/preact-jsx-chai)

[![travis-ci](https://travis-ci.org/developit/preact-jsx-chai.svg)](https://travis-ci.org/developit/preact-jsx-chai)

Extend Chai with support for asserting JSX equality & contents with support for [Preact] Components.

(Heavily) inspired by [jsx-chai].

---

### Usage

```js

import { h } from 'preact'; /** @jsx h */

import chai, { expect } from 'chai';

import assertJsx from 'preact-jsx-chai';

chai.use(assertJsx);

// check if two JSX DOMs are deeply equal:

expect(

	
a

).to.deep.equal(

	
a

);


// check if a given JSX DOM contains the given fragment:

expect(

	
 foo! 

).to.contain(

	foo!

);

```


> **Note:** in environments like Karma where chai is available as a global, `preact-jsx-chai` will automatically register itself on import. Don't worry, though, this plugin is smart enough to avoid registering itself multiple times.

---

### Options

There are a few global options available to customize how `preact-jsx-chai` asserts over VNodes.

| Name            | Type     | Default | Description

|-----------------|----------|---------|-------------

| `isJsx`         | Function | _auto_  | Override the detection of values as being JSX VNodes.

| `functions`     | Boolean  | _true_  | If `false`, props with function values will be omitted from the comparison entirely

| `functionNames` | Boolean  | _true_  | If `false`, ignores function names and bound state, asserting only that the compared props are functions

##### To set these options:

```js

import { options } from 'preact-jsx-chai';

options.functions = false;

// or:

import jsxChai from 'preact-jsx-chai';

jsxChai.options.functions = false;

```

---

### Assertions

Deep, fully rendered equality/inclusion is checked for: `.deep.equal`, `.eql`, `.include`, and `.contain`

Shallow, JSX only equality/inclusion is checked for: `.equal`, `.shallow.include`, and `.shallow.contain`

```js

let Outer = ({a}) => 

let Inner = ({a}) => 
{a}


// JSX tests

expect().to.be.jsx

expect('Outer').to.not.be.jsx

// Deep equality tests

expect().to.deep.equal()

expect().to.deep.equal(
foo
/>)

expect().to.not.deep.equal()

expect().to.eql() // .eql is shorthand for .deep.equal

expect().to.not.eql()


// Shallow Equality tests

expect().to.equal()

expect().to.not.equal()

expect().to.not.equal(
foo
) //  is not rendered


let WrappedOuter = ({a}) => 


// Deep includes/contains tests

expect().to.include(
foo
)

expect().to.contain(
foo
)

expect().to.contain()

expect().to.not.include(
Bad Div
)


// Shallow includes/contains tests

expect().to.shallow.contain()

expect().to.not.shallow.include(
foo
)

```


---

### License

[MIT]

[Preact]: https://github.com/developit/preact

[jsx-chai]: https://github.com/bkonkle/jsx-chai

[MIT]: http://choosealicense.com/licenses/mit/