Chaos Engineering for your React apps.
Chaos Engineering for your React applications.
React Chaos is currently a higher order component that will randomly throw Error
s in the component it wraps. The likelihood for the error to throw is based on a level
you set when you wrap a component.
Blog post: Announcing React Chaos Demo: https://react-chaos.netlify.com/
npm i --save-dev react-chaos
First, import the Chaos:
import withChaos from 'react-chaos';
Wrap any component with the Chaos:
const ComponentToWrap = () => <p>I may have chaos.</p>;
const ComponentWithChaos = withChaos(ComponentToWrap);
You can optionally set a Chaos level between 1 and 10 (the higher the number, the more Chaos 😈) as well as a custom error message:
const ComponentWithChaos = withChaos(ComponentToWrap);
const ComponentWithChaos = withChaos(
ComponentToWrap,
10,
'This error message will almost certainly be shown since we are at Chaos level 10.'
);
Note: The default Chaos level is 5.
By default, React Chaos will not run in production. If you want to override this by passing in true
as a 4th parameter like this:
const ComponentWithChaos2 = withChaos(
ComponentWillHaveChaos2,
3,
'a custom error message, level 3',
true
);
Chaos Engineering is the practice of experimenting with entropy on a software system to test its resiliency. You can read more about it here.
This project uses TSDX.