TypeError: Cannot read property 'error' of undefined on React Chrome Extension
<p>I'm developing a React Chrome Extension using the <a href="https://github.com/tshaddix/react-chrome-redux/wiki/Getting-Started" rel="noreferrer">React-Chrome-Redux library</a></p>

<p>It's the first time I develop using this and I stuck in an error that I can't figure out the reason.</p>

<p>My popup app is failing on runtime with the following error message on the console: </p>

<blockquote>
  <p>Error in event handler for (unknown): TypeError: Cannot read property
  'error' of undefined</p>
</blockquote>

<p>I tried to debug and set a breakpoint in the exact location of the error:</p>

<pre><code>return new Promise(function (resolve, reject) {
    chrome.runtime.sendMessage({
      type: _constants.DISPATCH_TYPE,
      payload: data
    }, function (_ref2) {
      var error = _ref2.error;
      var value = _ref2.value;

      if (error) {
        reject((0, _assignIn2.default)(new Error(), error));
      } else {
        resolve(value.payload);
      }
    });
  });
}
</code></pre>

<p>on the Promise callback the _ref2 is undefined when the action is:
type: "chromex.dispatch" and the payload is also undefined.</p>

<p>This started happening after introduce a dispatch method to start the authentication process, the code is as follow:</p>

<pre><code>class App extends Component {

  constructor(props) {
    super(props);

    this.props.dispatch({
      type: START_AUTH
    });
  }
</code></pre>

<p>On both popup/index.js and background/index.js I set the store communication channel:</p>

<pre><code>//popup
import {Store} from 'react-chrome-redux';
import {Provider} from 'react-redux';


const proxyStore = new Store({
  portName: 'my_app'
});

//background
import rootReducer from '../core/reducers';

import {wrapStore} from 'react-chrome-redux';
import {render} from 'react-dom';
import {Provider} from 'react-redux';
import {Store} from 'react-chrome-redux';

import App from './components/App';

const store = createStore(rootReducer, {});

wrapStore(store, {
  portName: 'my_app'
});
</code></pre>

<p>I've plenty of logging messages on the authentication process, but nothing seems to happen.</p>

<p>In core/ I have the common files, like reducers, action types, actions, etc, it's always translated from ES6 by webpack-babel.</p>

<p>Unfortunately it seems that React dev tools doesn't work on Chrome extensions to help debugging.</p>

<p>Any idea or any more information you need to help me to figure out what's happening and how to fix it?</p>