Question

我正在使用react编写Web应用程序。我对客户端测试不太熟悉，所以我还在试图弄清楚如何对我的组件进行单元测试。

我在react文档中看到他们提供Test Utilities来测试自定义UI组件，但我找不到在组件内部测试函数的方法。

我有一个表单，我想验证字段，让我们说验证电子邮件地址。如何测试此方法的功能？从我所看到的，人们只是测试UI组件本身。

Answer 1

这有点令人费解，但这是一个使用skin-deep测试反应组件内部函数的示例。

组件文件：

export default React.createClass({
  validate(input) {
    return true
  },
  render() {
    if (validate(this.props.input)) {
      return <div>Valid!</div>
    }
    return <div>Not Valid!</div>
  }
})

测试文件：

import React from 'react'
import sd from 'skin-deep'
import Component from 'Component.jsx'

let tree = sd.shallowRender(React.createElement(Component, {}))
const instance = tree.getMountedInstance()

// Now you can run tests on instance functions.
assert instance.validate(foo) === true

我们已经在React组件之外放置了我们想要测试的函数，以避免这样做。

单元测试反应组件功能

1 个答案: