Jest测试含react-native-linear-gradient组件时遇TypeError求助

这个错误是因为react-native-linear-gradient依赖原生端组件实现，而Jest运行在Node环境中无法调用原生方法，必须Mock该组件来绕过。下面是几种可行的Mock方案：

方案一：在单个测试文件中局部Mock #

在你的测试文件最顶部添加以下代码，直接将LinearGradient替换为React Native的View组件：

jest.mock('react-native-linear-gradient', () => {
  const { View } = require('react-native');
  return props => <View {...props} />;
});

这样测试时会把LinearGradient当成普通View渲染，保留所有props传递逻辑，不影响组件结构测试。

方案二：全局Mock（所有测试文件通用） #

1. 在项目根目录创建__mocks__/react-native-linear-gradient.js文件，写入：

import React from 'react';
import { View } from 'react-native';

const LinearGradient = (props) => <View {...props} />;

export default LinearGradient;

2. 在Jest配置文件（jest.config.js或package.json的jest字段）中添加映射：

module.exports = {
  // 其他已有配置...
  moduleNameMapper: {
    'react-native-linear-gradient': '<rootDir>/__mocks__/react-native-linear-gradient.js'
  }
};

配置完成后，所有测试文件都会自动使用这个Mock，无需每个文件单独配置。

方案三：简化Mock（仅占位用） #

如果你的测试不需要验证LinearGradient的props传递，也可以用更简单的写法：

jest.mock('react-native-linear-gradient', () => 'LinearGradient');

这种方式会把组件渲染成一个名为LinearGradient的空标签，适合只需要验证组件结构存在的场景。

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