Как я могу выполнить этот компонент теста с шуткой - PullRequest
0 голосов
/ 29 декабря 2018

У меня есть компонент с некоторыми подпорками, но когда я хочу проверить, отрисован ли он, тест не пройден, и у меня появляется следующее сообщение об ошибке: «TypeError: Невозможно прочитать свойство 'name' of undefined"

этомой компонент:

  render(){
   const character = this.props.character ? this.props.character : null;
   const characterName = this.props.character.name ? 
   this.props.character.name : null;
 const characterStatus = this.props.character.status  ? 
   this.props.character.status : null;

return(
  <TouchableOpacity 
  onPress={() => {}}
  style={styles.item_container}
  >
    <Image style={styles.image} source={{uri: character.image}}/>
    <View style={styles.content_container}>
      <View >
        <Text style={styles.name}>{characterName}</Text>
        <Text style={styles.status}>{characterStatus}</Text>
      </View>
    </View>
  </TouchableOpacity>
);

и мой шутный тест:

 it('renders ListItem without children', () => {
const rendered = renderer.create( <ListItem  /> ).toJSON();
expect(rendered).toBeTruthy();
 })   

как мне пройти этот тест и правильно проверить, хорошо ли рендерится мой компонент?

1 Ответ

0 голосов
/ 30 декабря 2018

У вас есть пара проблем.

Во-первых, в вашем компоненте вы делаете следующее

const character = this.props.character ? this.props.character : null;
const characterName = this.props.character.name ? this.props.character.name : null;

Это будет вызывать неопределенную ошибку каждый раз, когда this.props.character будет нулевым, так как вы не сможете получить name собственность от character проп.Вам нужно найти способ обработки ответа, когда this.props.character равен нулю.Возвращает ли это значение null для вашего компонента или использует значение по умолчанию.Выбор за вами.

Во-вторых, ваш тест не пройден, потому что вы не проходите символьную опору, на которую опирается ваш компонент, см. Первый пункт выше.Вам нужно создать объект, который является образцом персонажа, и передать его в ListItem.Как-то так, вы можете заполнить правильную информацию.

it('renders ListItem without children', () => {
  const character = { name: '<CHARACTER_NAME>', image: '<IMAGE_URI>', status: '<CHARACTER_STATUS>'};
  const rendered = renderer.create( <ListItem  character={character}/> ).toJSON();
  expect(rendered).toBeTruthy();
}) 

Если вы хотите, чтобы ваш тест проходил, когда вы не проходите символическую опору, тогда вам нужно установить некоторые средства защиты, чтобы ничто не было неопределенным, когда символическая опора равна нулю.

...