Automagically generate tests from errors
Switch branches/tags
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
demo move demo gif Dec 24, 2016
src better snippet formatting Dec 24, 2016
test better snippet formatting Dec 24, 2016
.babelrc first commit Dec 15, 2016
.eslintrc live demo Dec 24, 2016
.gitignore live demo Dec 24, 2016
.travis.yml enable travis Dec 15, 2016
LICENSE Initial commit Dec 15, 2016 move demo gif Dec 24, 2016
package.json v0.3.3 Dec 24, 2016
webpack.config.js live demo Dec 24, 2016
yarn.lock live demo Dec 24, 2016

React Fix It Build Status

Automagically generate tests from errors.

⚠️ This package uses react-component-errors to wrap the lifecycle methods into a try...catch block, which affects the performance of your components. Therefore it should not be used in production.

How to use it

  • Enhance your components with fixIt
  • Write some bugs (or wait for your components to fail)
  • Open the console and copy the test snippet
  • Paste the code to reproduce the error
  • Fix the bugs and celebrate




You can either install it with npm or yarn.

npm install --save-dev react-fix-it


yarn add --dev react-fix-it


import React, { Component } from 'react'
import fixIt, { options } from 'react-fix-it'

// defaults to console.log
options.log = (test) => {

class MyComponent extends Component {
  render() {
    return <div>Hello ⚛</div>

export default fixIt(MyComponent)

💡 They easiest way to patch automatically all the components in development mode is by using babel-plugin-react-fix-it with the following configuration:

  "env": {
    "development": {
      "plugins": ["react-fix-it"]


npm test


yarn test