CODEWITHSUNDEEP
reactjsimmutable.jsreselect
Griffin M
Griffin M

Reputation: 461

Testing Reselect Selectors

I am trying to test a react/redux reselect selector which will filter an array and return only active clients. My issue is with immutableJS.

Selector:

const selectClients = state => state.get('clients', initialState)

const makeSelectInactiveClients = () => createSelector(
  makeSelectClients(),
  clients => clients.filter(c => c.inactive)
)

Test:

describe('Active and not active client selectors', () => {
  const activeClients = [
    { id: 1, name: 'Client 1' },
    { id: 2, name: 'Client 2' },
  ]
  const inactiveClients = [
    { id: 1, name: 'Client 3', inactive: true },
    { id: 2, name: 'Client 4', inactive: true },
  ]
  const clients = [
    { id: 1, name: 'Client 1' },
    { id: 2, name: 'Client 2' },
    { id: 1, name: 'Client 3', inactive: true },
    { id: 2, name: 'Client 4', inactive: true },
  ]

  describe('#makeSelectActiveClients', () => {
    const activeClientsSelector = selectors.makeSelectActiveClients()

    it('only returns active clients', () => {
      const mockedState = fromJS({
        clients: {
          loading: false,
          clients: clients,
        },
      })


      expect(activeClientsSelector(mockedState)).toEqual(activeClients)
    })
  })
})

Reducer:

export default function ClientsReducer(state = initialState, action) {
  switch (action.type) {
    case FETCH_CLIENTS:
      return state.set('loading', true)
    case SET_CLIENTS:
      return state
        .set('loading', false)
        .set('clients', action.clients)
    default:
      return state
  }
}

The issue is that when the reducer sets the client array, it is set a plan JS array. However, when that array is set in my test using ImmutableJS, it is set as an immutable object and does not have the inactive without using the get keyword.

Should I be calling toJS in my reducer like this?

return state
  .set('loading', false)
  .set('clients', fromJS(action.clients))

and then use the get keyword in the selectors to access the properties of member objects of clients?

or should I be doing something differently in my test?

Upvotes: 2

Views: 4006

Answers (1)

brietsparks
brietsparks

Reputation: 5016

Try calling fromJS on activeClients in the test assertion:

expect(activeClientsSelector(mockedState)).toEqual(fromJS(activeClients))

Upvotes: 2

Related Questions