javascript - Jest 测试验证数据 prop

Question

我是 Jest 的新手，想了解如何编写测试的基础知识。如何编写验证 uri 包含/返回值的简单测试？

renderProfileImage () {
    const apiUrl = 'site.com'
    const profileImagePath = this.props.data.field_profile_image

    if (profileImagePath !== '') {
      return <Image
        style={styles.profile}
        source={this.state.imageLoading ? require('../img/profileImagePlaceholder.png') : { uri: `${apiUrl}${profileImagePath}` }}
        onLoadEnd={(e) => this.setState({ imageLoading: false })}
      />
    }

说 this.props.data.field_profile_image 返回 /photo.png

Answer 1

记住 "React elements are plain objects" :

import * as React from 'react';
import renderer from 'react-test-renderer';

import { MyComponent } from './path-to-your-component';

describe('renderProfileImage', () => {
  it('should set the correct uri', () => {
    const comp = renderer.create(<MyComponent data={{
      field_profile_image: '/path-to-the-image'
    }}/>).root.instance;
    // element is just an object representing an <Image>...
    const element = comp.renderProfileImage();
    // ...so check that element.props.source was set correctly
    expect(element.props.source).toEqual({ uri: 'site.com/path-to-the-image' });
  });
});