tdd – 单元测试反应原生的触摸事件

发布时间：2020-12-13 20:10:38 所属栏目：百科来源：网络整理

导读：我正在尝试使用 this指南测试驱动器反应本机代码. reactjs覆盖react native,以使用jestjs进行浅层渲染和测试. 即使我能够测试浅层渲染组件(检查其存在和子项),我也无法测试触摸事件. handleTouch() { this.setState({ showDescription: !this.state.showDesc

我正在尝试使用 this指南测试驱动器反应本机代码. reactjs覆盖react native,以使用jestjs进行浅层渲染和测试.

即使我能够测试浅层渲染组件(检查其存在和子项),我也无法测试触摸事件.

handleTouch() {
 this.setState({ showDescription: !this.state.showDescription });
}


render() {
const description = this.state.showDescription ? (<Text style={styles.description}>{this.props.entry.description}</Text>) : null;
return (
  <TouchableNativeFeedback onPress={() => this.handleTouch()}>
    <View style={styles.rowContainer}>
      <View style={styles.row}>
      </View>
      {description}
    </View>
  </TouchableNativeFeedback>
 )
}

我正在尝试测试触摸TouchableNativeFeedback,是否呈现了描述标记. reactjs TestUtils提供模拟,但它不起作用.

这是我的规格设置：

beforeEach(function() {
    profileView = TestUtils.renderIntoDocument(<ProfileEntryView entry={entry}/>);
    var touchableNativeFeedback = TestUtils.findRenderedComponentWithType(profileView,TouchableNativeFeedback);
    TestUtils.Simulate.onTouchEnd(touchableNativeFeedback);
});

我如何使用reactjs TestUtils测试用户反应原生的UI交互？

因为ReactTestUtils模拟没有onTouchEnd或onPress事件.所以你需要添加模拟对象mocks / react-native.js：

const NativeComponent = (type) => {
    return React.createClass({
        render() {
            var properties = {className: type};
            if (typeof this.props.onPress !== 'undefined') {
                properties.onClick = this.props.onPress;
            }
            Object.assign(properties,this.props);
            return (
                <div {...properties}>{this.props.children}</div>
            );
      }
};
...
ReactNative.TouchableNativeFeedback = NativeComponent("TouchableNativeFeedback");

并将您的测试代码更新为：

var touchableNativeFeedback = TestUtils.findRenderedDOMComponentWithClass(profileView,'TouchableNativeFeedback');
TestUtils.Simulate.click(touchableNativeFeedback);

正在寻找更多的代码from this page.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!