Question

我有一个React Native组件，看起来像：

export class Estimate extends PureComponent {
  setRef =
    (ref) => {
      this.estimateForm = ref
    }

  render () {
    const { onPress } = this.props
    return (
      <Form
        name="estimateForm"
        ref={this.setRef}
      >
        <Actions style={{ alignItems: 'flex-end' }}>
          <Button
            type="text"
            style={{ marginBottom: -em(0.5) }}
            onPress={() => onPress(this.estimateForm.values)}
            title={t('estimateShippingAndTax')}
          />
          <TextInput
            placeholder={t('postalCode')}
            name="estimate"
            style={{ width: 100 }}
            validate="postalCode"
          />
        </Actions>
      </Form>
    )
  }
}

我的玩笑/酶测试看起来像：

let obj
let onPressFunction
describe('Estimate', () => {
  beforeAll(() => {
    onPressFunction = jest.fn()
    obj = shallow(<Estimate onPress={onPressFunction} />)
  })

  test('Text gets returned with onPress', () => {
    console.log(obj.html())
    const value = { values: { estimate: '61606' } }
    obj.instance().setRef(value)
    obj.find('Button').first().simulate('onPress')
    expect(onPressFunction).toHaveBeenCalledWith('61606')
  })
})

即使我的组件按预期工作，我似乎也无法通过我的测试。我的测试失败：

预期的模拟函数已被调用： [“ 61606”] 但是它没有被调用。

Answer 1

您的酶测试应该模拟press事件，而不是onPress事件。事件名称是“新闻”。

obj.find('Button').first().simulate('press')

看看您的标签，这是一个React Native项目，this thread on the Enzyme repo建议尝试直接调用该方法，而不要依赖simulate：

obj.find('Button').first().props().onPress()

如何测试回调参数本机反应

1 个答案: