Error in redux when executing an action: Uncaught type error: cannot read property 'type' of undefined
<p>Just new to React. I guess It's a basic question but I can't get why the reducer doesn't get fired or update the state:</p>

<p>My HomeView.js:</p>

<pre><code>     ....
          const { localeChange, counter, locale } = this.props
            return (
               &lt;div&gt;
                  &lt;button onClick={() =&gt; increment(7)}&gt;Increment&lt;/button&gt;
              &lt;input type='text' value = {counter}/&gt;
               .....
            &lt;/div&gt;
        )

    const mapStateToProps = (state) =&gt; ({
      locale: state.locale,
      counter: state.counter
    })
    export default connect(mapStateToProps, {localeChange, increment})(HomeView)
</code></pre>

<p>My reducer (constant, action and reducer in the same file):</p>

<pre><code>export const COUNTER_INCREMENT = 'COUNTER_INCREMENT'

export function increment (text) {
  return { type: COUNTER_INCREMENT, text }
}

export default function counterIncrement (state = 0, action) {
  switch (action.type) {
    case 'INCREMENT':
      return state + action.text
    default:
      return state
  }
}
</code></pre>

<p>And finally my "parent" reducer:</p>

<pre><code>import { combineReducers } from 'redux'
import { routeReducer as router } from 'react-router-redux'
import locale from './modules/locale'
import counter from './modules/counter'

export default combineReducers({
  locale,
  router,
  counter
})
</code></pre>

<p>What I understand:</p>

<p>In my state I have a field named counter (it's there using redux dev tools). 
When I click the button I dispatch increment action, so I really should dispatch an action like this:
{type: COUNTER_INCREMENT, text: 7}</p>

<p>However counterIncrement function (reducer) gets action as undefined: <code>Uncaught type error: cannot read property 'type' of undefined</code>. 
Any way I could debug this properly? I put a breakpoint in the reducer counterIncrement but doesn't get fired.</p>