Các sự kiện liên lạc thử nghiệm đơn vị trong phản ứng gốc

Question

Tôi đang cố gắng kiểm tra ổ đĩa phản ứng mã gốc bằng cách sử dụng hướng dẫn this. Phản ứng gốc được ghi đè bởi các phản ứng để cho phép hiển thị và thử nghiệm nông bằng cách sử dụng các jestj.

Mặc dù tôi có thể kiểm tra các thành phần được hiển thị nông (kiểm tra sự hiện diện của nó và trẻ em), tôi không thể kiểm tra các sự kiện chạm.

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

Tôi đang cố kiểm tra nếu chạm vào thẻ TouchableNativeFeedback, description được hiển thị. Reactjs TestUtils cung cấp Simulate nhưng nó không hoạt động.

Đây là thiết lập spec của tôi:

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

Làm thế nào tôi sẽ kiểm tra sự tương tác giao diện người dùng sử dụng reactjs TestUtils cho phản ứng bản địa?

Answer 1

Vì ReactTestUtils mô phỏng không có sự kiện onTouchEnd hoặc onPress. Vì vậy, bạn cần phải thêm vào đối tượng giả 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"); 

Và cập nhật mã thử nghiệm của bạn:

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

Looking for nhiều mã from this page.