Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mighty-justice/tester
Centralize and standardize your tests with easy configuration.
https://github.com/mighty-justice/tester
configuration jest react react-components test test-runners testing
Last synced: about 2 months ago
JSON representation
Centralize and standardize your tests with easy configuration.
- Host: GitHub
- URL: https://github.com/mighty-justice/tester
- Owner: mighty-justice
- License: mit
- Created: 2018-12-11T13:02:35.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-03T15:39:46.000Z (about 2 years ago)
- Last Synced: 2024-12-03T03:12:40.558Z (2 months ago)
- Topics: configuration, jest, react, react-components, test, test-runners, testing
- Language: TypeScript
- Homepage: https://mighty-justice.github.io/tester/
- Size: 2.36 MB
- Stars: 2
- Watchers: 4
- Forks: 0
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Tester
[](https://www.npmjs.com/package/@mighty-justice/tester) [](https://travis-ci.org/mighty-justice/tester) [](https://coveralls.io/github/mighty-justice/tester?branch=master)
Centralize and standardize your tests with easy configuration.
## Installation
#### dependencies
```
"react": ">=16",
"react-dom": ">=16",
"enzyme": ">=3.8"
```
#### npm
`npm install --save-dev @mighty-justice/tester`
#### yarn
`yarn add --dev @mighty-justice/tester`
## Quick Start
Tester lets you configure and bootstrap your tests the way you want to. The possibilities are endless, but here's a quick summary to get you started.
In this example, we'll create a Transport hook to mock our API calls and test it.
### Configuration
Add this to your `jestSetup.js` file.
```js
// Import the full enzyme to pass it to Tester
import enzyme from 'enzyme';
// Import the proper adapter, version 16 is required.
import Adapter from 'enzyme-adapter-react-16';
import { TransportMock } from './mocks';
import { ConfigureTester } from '@mighty-justice/tester';
// Adapt enzyme BEFORE configuring Tester
enzyme.configure({ adapter: new Adapter() });
// Now you can configure Tester by passing enzyme and the config object
TesterConfig.configure(enzyme, {
hooks: [
{
name: 'Transport',
// When the Tester is initialized, run the following
onInit: (tester) => {
/*
You can set whatever you want on the tester,
as long as it doesn't conflict with an existing property.
*/
tester.Transport = new TransportMock();
// You can use any options that you pass on the Tester initialization to run code.
if (tester.opts.registerEndpoints) {
tester.Transport.register(tester.opts.registerEndpoints);
}
},
},
// ...
// You can add as many hooks as you want
],
});
```
### Usage
Now that our Tester is configured, let's test one of our components.
```js
/* global */
import Button from './button':
import { Tester } from '@mighty-justice/tester';
describe('Button', () => {
it('Button triggers API call', async () => {
const tester = await new Tester(
Button,
{ props: { callsApiOnClick: true } },
).mount();
expect(tester.Transport.calls.length).toBe(0);
tester.component.simulate('click');
expect(tester.Transport.calls.length).toBe(1);
});
});
```
### Helpers
The most helpful helpers are:
```js
tester.instance // The instance of the tested component
tester.component // The tested component
tester.html() // Retrieve mounted component html
tester.text() // Retrieve mounted component text
tester.wrapper // return of the enzyme mount()
// and more...
```
Here's the full list: [Helpers](docs/Helpers.md)
## Contributing
- Release: `npm run deploy`