使用React Native Testing Library测试UI Kitten按钮遇问题

1. 修正Navigation Mock不匹配问题 #

你的HomeBtn组件里调用的是navigation.navigate('Home')，但测试中传入的是push: pushMock，这会导致组件调用的方法不存在，后续断言也无法命中。需要把mock改成navigate：

const navigateMock = jest.fn();
<HomeBtn navigation={{ navigate: navigateMock }} />

2. 模拟UI Kitten的Icon组件解决name属性错误 #

测试环境下UI Kitten的Icon组件可能无法正确解析图标名称，导致抛出Cannot read properties of undefined (reading 'name')错误。用Jest模拟@ui-kitten/components里的Icon组件即可解决：

在测试文件顶部添加模拟代码：

jest.mock('@ui-kitten/components', () => {
  const originalModule = jest.requireActual('@ui-kitten/components');
  return {
    ...originalModule,
    Icon: jest.fn(() => null), // 模拟Icon组件返回空节点，避免渲染错误
  };
});

3. 触发按钮点击并完成断言 #

当前测试仅渲染了组件，未触发按钮的onPress事件，断言永远不会通过。需要用fireEvent触发点击：

修改后的完整测试代码：

import React from 'react';
import * as eva from '@eva-design/eva';
import {ApplicationProvider} from '@ui-kitten/components';
import {render, fireEvent} from '@testing-library/react-native';
import {HomeBtn} from '../../../components/buttons/HomeBtn';

// 模拟Icon组件
jest.mock('@ui-kitten/components', () => {
  const originalModule = jest.requireActual('@ui-kitten/components');
  return {
    ...originalModule,
    Icon: jest.fn(() => null),
  };
});

describe('HomeBtn', () => {
  it('should navigate to the Home Screen', () => {
    const navigateMock = jest.fn();
    const {getByRole} = render(
      <ApplicationProvider {...eva} theme={eva.light}>
        <HomeBtn navigation={{ navigate: navigateMock }} />
      </ApplicationProvider>,
    );
    
    // 触发按钮点击
    fireEvent.press(getByRole('button'));
    
    // 断言navigate方法被正确调用
    expect(navigateMock).toHaveBeenCalledWith('Home');
  });
});

额外优化（可选） #

如果使用TypeScript，可给HomeBtn的props添加类型，避免any类型带来的隐患：

import {NavigationProp} from '@react-navigation/native';
// 导入你的根路由参数类型
import {RootStackParamList} from '../path-to-your-root-stack';

type HomeBtnProps = {
  navigation: NavigationProp<RootStackParamList, 'Home'>;
};

export const HomeBtn = ({navigation}: HomeBtnProps) => {
  // 组件原有代码
};

内容的提问来源于stack exchange，提问作者dnd1993