Question

我已经编写了一个反应组件的测试，我使用了浅层渲染，但由于用于textarea的ref我需要使用mount。挂载用法解决了我希望的refs问题，但是发生了类型错误。这就是我写测试的方式：

it('testing send message bar...',()=> {

  const wrapper=mount(<SendMessageBar activeConversation={conversation}  />);
  expect(wrapper.contains(<div className="sendMessageBar" />)).to.equal(true);
  expect(wrapper.find('.sendMessageBar')).to.have.length(1);
  expect(wrapper.find('textarea').hasClass('sendMessageInput')).to.equal(true);

  wrapper.ref('messageInput').get(0).value='message test...';
  const button=wrapper.find('.sendMessageBtn');
  button.simulate('click');

  console.log(wrapper.debug());
  console.log(wrapper.html());
});

错误日志如下：

TypeError: this.props.handleHeight is not a function
  at _setupTextArea (SendMessageBar.react.js:32:16)
  at componentDidMount (SendMessageBar.react.js:56:12)
  at invokeComponentDidMountWithTimer (node_modules/react/lib/ReactCompositeComponent.js:63:18)
  at CallbackQueue._assign.notifyAll (node_modules/react/lib/CallbackQueue.js:66:22)
  at ReactReconcileTransaction.ON_DOM_READY_QUEUEING.close (node_modules/react/lib/ReactReconcileTransaction.js:79:26)
  at ReactReconcileTransaction.Mixin.closeAll (node_modules/react/lib/Transaction.js:202:25)
  at ReactReconcileTransaction.Mixin.perform (node_modules/react/lib/Transaction.js:149:16)
  at batchedMountComponentIntoNode (node_modules/react/lib/ReactMount.js:123:15)
  at ReactDefaultBatchingStrategyTransaction.Mixin.perform (node_modules/react/lib/Transaction.js:136:20)
  at Object.ReactDefaultBatchingStrategy.batchedUpdates (node_modules/react/lib/ReactDefaultBatchingStrategy.js:63:19)
  at Object.batchedUpdates (node_modules/react/lib/ReactUpdates.js:98:20)
  at Object.ReactMount._renderNewRootComponent (node_modules/react/lib/ReactMount.js:286:18)
  at Object.ReactMount._renderSubtreeIntoContainer (node_modules/react/lib/ReactMount.js:365:32)
  at Object.ReactMount.render (node_modules/react/lib/ReactMount.js:386:23)
  at Object.ReactTestUtils.renderIntoDocument (node_modules/react/lib/ReactTestUtils.js:82:21)
  at renderWithOptions (node_modules/enzyme/build/react-compat.js:175:26)
  at new ReactWrapper (node_modules/enzyme/build/ReactWrapper.js:94:59)
  at mount (node_modules/enzyme/build/mount.js:21:10)
  at Context.<anonymous> (sample.js:47:15)

使用mount而不是浅时发生类型错误

0 个答案: