Модульное тестирование сенсорных событий в React Native

Я пытаюсь протестировать нативный код реакции, используя это руководство. Нативная реакция переопределяется reactjs, чтобы обеспечить неглубокий рендеринг и тестирование с использованием 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 тег description. Reactjs TestUtils предоставляет Simulate, но это не сработало.

Это моя спецификация:

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

Как я буду тестировать взаимодействие с пользовательским интерфейсом, используя reactjs TestUtils для нативной реакции?


react-native jestjs ecmascript-6 tdd
person gmuraleekrishna    schedule 01.02.2016    source источник

Ответы (1)


arrow_upward
6
arrow_downward

Поскольку симуляция 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);

Ищу дополнительный код на этой странице.

person DoanND    schedule 09.05.2016