Unit-Tests Touch-Ereignisse in reagieren native

Question

Ich versuche zu testen, reagieren nativen Code mit this Handbuch. Das reaktive native wird von reactjs überschrieben, um seichtes Rendering und Testen mit jestjs zu ermöglichen.

Auch wenn ich flache gerenderte Komponenten testen kann (Überprüfung der Anwesenheit und Kinder), kann ich Touch-Ereignisse nicht testen.

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

Ich versuche, wenn die TouchableNativeFeedback auf Berührung zu testen, description Tag gemacht wird. Die reactjs TestUtils bietet Simulate aber es hat nicht funktioniert.

Das ist mein spec Setup:

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

Wie werde ich testen UI-Interaktionen reactjs mit TestUtils für reagieren-native?

Answer 1

Da ReactTestUtils simulieren nicht onTouchEnd oder onPress Ereignis hat. Sie müssen also Mock-Objekt hinzufügen 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"); 

und aktualisieren Sie Ihren Testcode:

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

für mehr Code Suche from this page.