CODEWITHSUNDEEP
reactjsenzyme
Thomas John
Thomas John

Reputation: 2188

How to set object type props value in an enzyme for a react component?

I tried two ways,

1.

const wrapper=shallow(<ActiveConversation />)
wrapper.setProps({activeConversation:c,agent:a});
expect(wrapper.prop('messagesList')).to.equal(messagesList);

2.

const wrapper=shallow(<ActiveConversation messagesList={messagesList}
       agent={agent} contactFormState={d} tagSuggestions={t}/>);

But still both props goes on undefined

Upvotes: 4

Views: 1772

Answers (1)

Alexandr Lazarev
Alexandr Lazarev

Reputation: 12882

You are setting props correctly. The problem is that wrapper.prop() returns undefined in your particular case. This happens because actually wrapper isn't <ActiveConversation />, it's what it returns. So your prop() call tries to get a prop with messagesList key from the root node returned from <ActiveConversation />.

For example, if <ActiveConversation /> component renders something like this: 

<div className='conversation'>
  <ConversationRenderer
    messagesList={this.props.messagesList}
    activeConversation={this.props.activeConversation} 
    info={info? true: false}
  /> 
  {info} 
</div>

wrapper.prop('messagesList') will try to find prop in this node <div className='conversation'> (not it's children), and since there isn't one, will return undefined.

In order to pass the test <ActiveConversation /> should render something like:

<div 
   messagesList={this.props.messagesList}
   className='conversation'
>
  <ConversationRenderer
    messagesList={this.props.messagesList}
    activeConversation={this.props.activeConversation} 
    info={info? true: false}
  /> 
  {info} 
</div>

But I guess that's not what you want.

By the way, but your test seems to be meaningless. What's the point of it? To test if a prop is set? It's al about react functionality, leave it for facebook to test :)

Upvotes: 1

Related Questions