Simple component setState logger

injectLogger.js

// Usage
import React from 'react';
injectLogger(React.Component);

// You can also make it specific to just a component
class App extends React.Component {}
injectLogger(App);

// Injecting logger will add additional boolean param to setState.
// Set this to true to perform setState logging
this.setState(
  {},
  undefined,
  true // enable logger
);

// Implementation
function injectLogger(Component) {
  const originalSetState = Component.prototype.setState;
  Component.prototype.setState = function(...args) {
    if (args[2] === true) {
      console.group(this.constructor.name);
      console.log('prevState', this.state);
      let changedState = {};
      if (typeof args[0] === 'function') {
        changedState = args[0](this.state);
      } else {
        changedState = args[0];
      }
      console.log('modification', changedState);
    }
    originalSetState.call(this, args[0], () => {
      if (typeof args[1] === 'function') {
        args[1]();
      }
      if (args[2] === true) {
        console.log('nextState', this.state);
        console.groupEnd(this.constructor.name);
      }
    });
  }
}