preact-jsx-chai
Extend Chai with support for asserting JSX equality & contents with support for Preact Components.
(Heavily) inspired by jsx-chai.
Usage
; /** @jsx h */ ;;chai; // check if two JSX DOMs are deeply equal:todeep; // check if a given JSX DOM contains the given fragment:to;
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:
;optionsfunctions = false; // or: ;jsxChaioptionsfunctions = 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
let <Inner a=a/>let <div>a</div> // JSX teststobejsxtonotbejsx // Deep equality teststodeeptodeeptonotdeepto // .eql is shorthand for .deep.equaltonot // Shallow Equality teststotonottonot // <Inner /> is not rendered let <div id="outer"><Inner a=a /></div> // Deep includes/contains teststotototonot // Shallow includes/contains teststoshallowtonotshallow