如何用玩笑模拟反应导航参数值答案

【问题标题】：How to mock react navigation params value with jest如何用玩笑模拟反应导航参数值
【发布时间】：2021-10-08 01:28:38
【问题描述】：

我是 jest 的新手，我正在尝试测试组件的渲染，但是在模拟它接收到的参数时遇到问题，这要归功于反应导航。

这是测试：

describe('<GameScreen /> tests', () => {
it('Render the component correctly ', () => {

    const route = {
      isAccesibilityModeOn: false
    }
    const navigate = jest.fn();
    const tree = renderer.create(<GameScreen route= {route} navigation={{ navigate }} />).toJSON();
    expect(tree).toMatchSnapshot();
  });
});

这是我的组件，它以变量isAccesibilityModeOn 的形式接收布尔值：

export default function GameView({route, navigation}) {

  const {isAccesibilityModeOn} = route.params;'
  
 return(<Text>Hello</Text>)
}

控制台给我的错误是这样的

TypeError: Cannot read property 'isAccesibilityModeOn' of undefinedJest

那么问题来了，如何模拟组件的参数值呢？

【问题讨论】：

标签： reactjs react-native unit-testing jestjs

【解决方案1】：

查看您作为道具传递的 route 对象 - 它缺少 params 属性。在组件中，您尝试访问未知 params 的 isAccesibilityModeOn 属性，因此您会看到此错误。

【讨论】：

感谢您的回答！你能告诉我如何添加 params 属性吗？我不知道该把它放在哪里。
用const route = { params: { isAccesibilityModeOn: false } } 替换您的route 定义。那么它应该可以正常工作。