Action never seen when dispatched on Store.

[ramakay]

I have a non React project with the following code
.

index.js

import configureStore from 'js/store/configureStore'

/* Redux Imports */
import { createPage } from 'js/actions/page'

// Boot the App
document.addEventListener('DOMContentLoaded', function () {
  const initialState = window.__INITIAL_STATE__
  const pageId = window.__INITIAL_STATE__.page
  const store = configureStore(initialState)
  store.dispatch(createPage(pageId))
})

*actions/page.js*
function initPage (pageId) {
  return {
    type: 'CREATE_PAGE',
    page: pageId
  }
}

export function createPage (pageId) {
  return dispatch => {
    dispatch(initPage(pageId))
  }
}

reducers/page.js

/**
 * Page Mediators get imported here
 * Page Mediators are brokers that hold page initialization.
 * The bundle includes all page mediators but they will not be activated
 * unless thre reducer calls them.
 */
import * as cart from 'js/templates/cart'

/**
 * This is a edge case, index.js boots the app and we are subscribing to 
 * a Redux @@INIT action instead of adding one more layer of actions
 * which leads to unintended scenarios.
 */

const page = (state = {page: []} , action) => {

  console.log(state)
  switch (action.type) {
    case '@@INIT':
      console.log('initializing page:' + state.id)
      console.log(state)
      dispatch({type: 'CREATE_PAGE',page: state.id})
      cart.init()
      return state
    case 'CREATE_PAGE':
      console.log('initializing page:' + state.id)
      cart.init()
      return state
    default:
      return state
  }
}
export default page

---

The problem I have is that actions/page.js never sees the CREATE_PAGE action. Any thoughs?

[gaearon]

Unrelated but

• This is a edge case, index.js boots the app and we are subscribing to
• a Redux @@init action instead of adding one more layer of actions
• which leads to unintended scenarios.

can break your app any day.

We specifically say:

• These are private action types reserved by Redux.
• For any unknown actions, you must return the current state.
• If the current state is undefined, you must return the initial state.
• Do not reference these action types directly in your code.

[ramakay]

Thanks @gaearon - I intend to remove this, I added it because the actions I have created are never seen - What could I be doing wrong?

[gaearon]

Please use StackOverflow for questions. We try to use the issue tracker for bug and feature discussions, but not for support.

As for the code, it violates the constraints of Redux by performing a side effect (cart.init()) and trying to dispatch an action (dispatch()) inside the reducer. This is not allowed, as noted more than once in the documentation. Reducers must be pure functions, so you should place side effects before or after dispatching the action.

If you dispatch inside a reducer, your code should fail. If it doesn’t fail, maybe you have a Promise swallowing the error somewhere. It’s hard to say more from this snippet of code.