运行测试时获取“不变违规：本机模块不能为空。”

Posted 2023-03-13

【中文标题】运行测试时获取“不变违规：本机模块不能为空。”

【英文标题】：Getting ''Invariant Violation: Native module cannot be null.'' when I run the test

【发布时间】：2019-05-21 15:02:24

【问题描述】：

我有一个如下的登录组件，我正在为这个组件编写一些测试用例。当我尝试运行测试时，出现以下错误：

测试

import renderer from 'react-test-renderer'

import Login from '../Login'
let props, wrapper

beforeEach(() => 
  props = 
    loginAttempt: jest.fn(),
    recoverAttempt: jest.fn(),
    reset: jest.fn()
  
  wrapper = shallow(<Login ...props />)
)

describe('tests for <Login />', () => 
  test('should have a formProvider with handlesubmit atribute', () => 
    const value = wrapper.find('FormProvider')
    expect(value.length).toBe(1)
  )
)

//Snapshot test
test('Snapshot test for the Contact form', () => 
  const tree = renderer.create(<Login ...props />).toJSON()
  expect(tree).toMatchSnapshot()
)

组件

import React,  Component  from 'react'
import KeyboardAvoidingWrapper from 'components/Wrappers/KeyboardAvoidingWrapper'

export default class AuthScreen extends Component 
  state = 

  

  toggleRecovery = e => 

    )
  

  loginAttempt = data => 

  

  recoverAttempt = data => 

  

  componentWillUnmount() 

  

  render() 
    let  loginAttempt, toggleRecovery, recoverAttempt, state, props  = this
    let  recovery  = state
    let  error, fetching  = props
    return (
      <KeyboardAvoidingWrapper enabled=false behavior="padding" fluid>

    UI GOES HERE..

      </KeyboardAvoidingWrapper>
    )
  

错误

  ● Test suite failed to run

    Invariant Violation: Native module cannot be null.

      at invariant (node_modules/react-native/node_modules/fbjs/lib/invariant.js:40:15)
      at new NativeEventEmitter (node_modules/react-native/Libraries/EventEmitter/NativeEventEmitter.js:36:36)
      at Object.<anonymous> (node_modules/react-native-safari-view/SafariViewManager.ios.js:12:20)
      at Object.<anonymous> (node_modules/react-native-safari-view/index.js:1:238)

为什么我会收到此错误？是因为组件没有正确导入吗？我无法弄清楚为什么会这样。我该如何解决这个问题？

【参考方案1】：

当您在渲染树中导入本机组件时会发生此问题，因为测试渲染器没有它们。要解决此问题，您要么需要模拟组件（https://jestjs.io/docs/en/manual-mocks），要么使用浅层渲染（https://reactjs.org/docs/shallow-renderer.html）

对于您的特殊情况，这是帮助您的 github 问题：https://github.com/naoufal/react-native-safari-view/issues/99

另一种解决方案可能是使用react-native-mock-render 模块（react-native-mock 最活跃的分支）

【讨论】：

为什么只针对这个组件。除了@Hari Luong

之外，我已经使用相同的方法来测试它们只是工作的其他组件

其他组件可能只是 javascript，所以它可以工作。对于需要原生集成的组件，它是行不通的。 （例如，地图、日历……）

能否提供Login组件中渲染的组件列表？

Login 有一个导入，即 import SafariView from 'react-native-safari-view' ，这导致了失败。不知道如何配置它

我更新了我的答案，它包含帮助您模拟包以进行测试的链接