Как использовать Jest-тестирование с React Native Test Renderer с testIds? - PullRequest
Новая
       77

Как использовать Jest-тестирование с React Native Test Renderer с testIds?

0 голосов
/ 19 февраля 2020

Я начинаю тестировать с Jest и react-test-renderer (не ферментом), но я не могу правильно проверить, что я пытаюсь сделать.

В компоненте "Забыли пароль" Я хочу:

  • Проверить, что TitleLargeWithHeader отображает с заголовком «Забыли пароль». Я дал ему testId="title", но я не уверен, как запросить этот идентификатор.
  • Проверьте, что компонент text с testId="subtitle" отображает "Электронная почта будет отправлена ​​на ваш адрес электронной почты учетной записи сбросить пароль. " Я также не уверен, как запросить этот идентификатор.

Может ли кто-нибудь указать мне правильное направление или я что-то упустил?

ForgotPassword. js 

<SafeAreaView style={styles.container} behavior="padding">
  <TitleLargeWithHeader title="Forgot Password" testId="title" />

  <View style={styles.subtitleContainer}>
    <Text style={styles.subtitleText} testId="subtitle">An email will be sent to your account email to reset your password.</Text>
  </View>

  <KeyboardAwareScrollView>
    <View style={styles.form}>
      <TextInputField
        value={email}
        onChangeText={(text) => setEmail(text)}
        title={'Email'}
        autoCorrect={true}
        keyboardType="email-address"
        returnKeyType="done"
        onSubmitEditing={sendEmail}
        autoCapitalize={"none"}
      />
    </View>

    <ButtonLarge
      label={'Send Email'}
      onPress={sendEmail}
      disabled={!email}
    />
  </KeyboardAwareScrollView>
</SafeAreaView>

ForgotPassword.test. js

// Imports: Dependencies
import 'react-native';
import React from 'react';
// Note: Test Renderer Must Be Required After React-Native
import { create } from 'react-test-renderer';
import ShallowRenderer from 'react-test-renderer/shallow'; // ES6

// Imports Screens
import ForgotPassword from './ForgotPassword';

// Imports: Components
import TitleLargeWithHeader from '../../components/TitleLargeWithHeader';

// Test: Forgot Password
describe('Screen: Forgot Password', () => {
  // Title Renders
  it('Title renders', () => {
    const component = create(<ForgotPassword />);
    const testInstance = component.root;

    // expect(testInstance.findByProps({title: 'Forgot Password'}).children).toEqual(['Forgot Password']);


  });

  // Subtitle Renders
  it('Subtitle renders', () => {
    const component = create(<ForgotPassword />);
    const testInstance = component.root;

    // expect(testInstance.findByProps({ testId: "subtitle"}).children).toEqual(['subtitle']);
  });
});
...