React Native Jest单元测试实战: 解析OrderHomeScreen组件

import React from 'react';
import { View, StyleSheet } from 'react-native';
import { render, fireEvent } from '@testing-library/react-native';
import OrderHomeScreen from './OrderHomeScreen';

describe('OrderHomeScreen', () => {
  test('正确渲染OrderHomeScreen组件', () => {
    const { getByText } = render(<OrderHomeScreen />);
    
    // 检查标题是否正确渲染
    expect(getByText('我的订单')).toBeTruthy();
    
    // 检查右侧按钮是否正确渲染
    expect(getByText('NavBar_service')).toBeTruthy();
    
    // 检查标签页标题是否正确渲染
    expect(getByText('全部')).toBeTruthy();
    expect(getByText('待付款')).toBeTruthy();
    expect(getByText('待发货')).toBeTruthy();
    expect(getByText('待收货')).toBeTruthy();
    expect(getByText('待评价')).toBeTruthy();
  });
  
  test('点击右侧按钮时调用openKF函数', () => {
    const { getByTestId } = render(<OrderHomeScreen />);
    
    // 模拟openKF函数
    jest.mock('@common/Web/URLHelper', () => ({
      openKF: jest.fn()
    }));
    
    // 模拟点击右侧按钮
    fireEvent.press(getByTestId('rightItem'));
    
    // 检查openKF函数是否被调用
    expect(openKF).toHaveBeenCalled();
  });
  
  test('切换标签页时调用refreshList函数', () => {
    const { getByText } = render(<OrderHomeScreen />);
    
    // 模拟refreshList函数
    const refreshList = jest.fn();
    
    // 模拟OrderList组件
    jest.mock('@components/Order/OrderList', () => ({
      __esModule: true,
      default: jest.fn().mockImplementation((props) => {
        if (props.ref) {
          props.ref.current = { refreshList };
        }
        return null;
      })
    }));
    
    // 模拟切换到'待付款'标签页
    fireEvent.changeText(getByText('待付款'));
    
    // 检查refreshList函数是否被调用
    expect(refreshList).toHaveBeenCalled();
  });
});