Storybook is a great tool for developing components -- and while simulated and snapshot based testing can get you pretty far, there's no substitution for the real thing. proof
is a tapable integration testing library for your stories.
The quickest way to get started is to use the proof-cli.
npm i --save-dev @proof-ui/cli @proof-ui/storybook
Next, make sure to configure the @proof-ui/storybook
addon in your storybook's config.js
file.
// .storybook/config.js
import configureProof from '@proof-ui/storybook';
configureProof();
Now you're ready to start writing tests!
Inspired by ava proof exposes a concise API for authoring tests:
import test, { assert } from '@proof-ui/test';
test({ kind: 'Components|Button', story: 'Basic' }, async ({ browser }) => {
// Use the browser object to test your component
assert(true === true);
});
Or mirror storybook to make it easy to cross-reference tests between files.
import { proofsOf, assert } from '@proof-ui/test';
const proofs = proofsOf('Components|Button');
proofs.add('Basic', async ({ browser }) => {
// Use the browser object to test your component
assert(true === true);
});
Proof ships with power-assert out of the box -- but feel free to bring your own assertion library to the mix.
Add proof as a test script in your package.json
{
"scripts": {
"test": "proof"
}
}
And call it
npm test
Proof will run against a local chrome instance by default, but can be configured to target any number of local, remote, or headless browsers.
Create a proof.config.js
file in your package's root folder or use the -c
, --conf
option on the command line to specify a different one.
At it's core, proof
uses tapable and exposes many hooks to allow complete control over the entire test life-cycle.