4

我尝试了两种方法，

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}/>);

但是两个道具仍然未定义

4

1 回答 1

1

您设置props正确。问题是在您的特定情况下wrapper.prop()返回。undefined发生这种情况是因为实际上wrapper不是<ActiveConversation />，而是它返回的。因此，您的prop()调用尝试从从返回的根节点获取propwith键。messagesList<ActiveConversation />

例如，如果<ActiveConversation />组件呈现如下内容：

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

wrapper.prop('messagesList')将尝试在此节点中查找 prop <div className='conversation'>（不是子节点），并且由于没有，因此将返回undefined.

为了通过测试<ActiveConversation />，应该呈现如下内容：

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

但我想这不是你想要的。

顺便说一句，但你的测试似乎毫无意义。它有什么意义？测试是否prop设置了a？这都是关于react功能的，留给 facebook 来测试 :)

于 2016-08-04T07:30:54.603 回答