🔥💥 vue-chaos 💥🔥

A simple (yet chaotic) component to introduce chaos in your Vue app.

Usage

Install

npm i vue-chaos

Import & use

<template>
        <VueChaos
         :chance="5"
         error-message="My custom error message"
         :run-in-production="false">
          <MyOtherComponent />
        </VueChaos>
</template>
<script>
    import VueChaos from 'vue-chaos';
    ...
    export default {
      ...
      components:{
        VueChaos
      }
    }
</script>

Props

Name	Type	Default value	Description
chance	Number	5	Decides the probability of the wrapper to throw an error;
error-message	String	🔥 Chaos emitted by VueChaos 🔥	custom error message to throw (i.e. to assert snapshots against)
run-in-production	Boolean	false	a flag to flip if we'd like to cause chaos in production (use at own risk! ☠️)

🔥🐒 Chaos Engineering? 🐒🔥

"Chaos engineering is the discipline of experimenting on a software system in production in order to build confidence in the system's capability to withstand turbulent and unexpected conditions." (wiki)

OK, but why? 🤔

Using the concept of ErrorCaptured in combination with this component can and will improve your apps resilience;

This way you can make sure your app won't behave unexpectedly and will handle everything gracefully, so your customers won't be impacted.

More awesome chaotic tools 🎉

1. Frontend
   • react-chaos
   • Angular - no need as it's chaotic enough 😏🤭
2. Other tools:
   • awesome-chaos-engineering