ThomasThiebaud ThomasThiebaud - 1 year ago 105
React JSX Question

Why mapStateToProps do not map to the right prop?

I have this container

import { connect } from 'react-redux'
import { createType, getTypes } from '../modules/type'

import Type from '../components/Type'

const mapDispatchToProps = {

const mapStateToProps = state => ({
types: state.type.types

export default connect(mapStateToProps, mapDispatchToProps)(Type)

and I would like to test it using
. To do it, I'm using this test

import React from 'react'
import { Provider } from 'react-redux'
import { mount } from 'enzyme'

import TypeContainer from 'routes/Type/containers/TypeContainer'

import configureMockStore from 'redux-mock-store';
import thunk from 'redux-thunk';

const mockStore = configureMockStore([ thunk ]);
const mockStoreInitialized = mockStore({
type: {
types: [
{id: 1, name: 'type 1'}

describe.only('(Route) Type', () => {
it('should get container', () => {
const wrapper = mount(
<Provider store={mockStoreInitialized}>
<TypeContainer />

expect(wrapper.find(TypeContainer).prop('types')).to.deep.equal([{id: 1, name: 'type 1'}])

The test is failing (at the assertion level) because
is empty. I can not find find why.

The strange thing is that if I check the coverage report, my test passed into the

Did I missed something ?

Answer Source

TypeContainer won't have a prop called types, it will pull types from the store and pass it to Type, which will have a prop called types. So it's not that mapStateToProps is not doing the right thing; it's just you're making assertions against the wrong object.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download