jestjs - 如何测试 react-native 方法？

Question

我想测试react-native的Vibration模块，问题是当我尝试测试它时出现错误:

有了这个组件:

import React, { useEffect } from 'react';
import { Text, Vibration } from 'react-native';

interface Props {}

export const MyComponent = (props: Props) => {
  useEffect(() => Vibration.vibrate(1), []);
  return (
    <Text>asdaf</Text>
  );
};

还有这个测试文件:

// @ts-nocheck
import React from 'react';
import { render } from '@testing-library/react-native';
import { NativeModules } from 'react-native';

import { MyComponent } from '../../../src/modules/MyComponent';

describe('MyComponent', () => {
  it('alpha', () => {
    const { debug } = render(<MyComponent/>);
    expect(true).toBeTruthy();
  });
});

我收到这个错误:

Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'Vibration' could not be found. Verify that a module by this name is registered in the native binary.

我试着像这样模拟 react-native:

// @ts-nocheck
import React from 'react';
import { render } from '@testing-library/react-native';
import { NativeModules } from 'react-native';

import { ChatRoomContainer } from '../../../src/modules/ChatRoom';

// Mock NativeModules
jest.mock('react-native', () => ({
  ...jest.requireActual('react-native'),
  Vibration: {
    vibrate: jest.fn()
  },
  __esModule: true
}));

describe('MyComponent', () => {
  it('alpha', () => {
    const { debug } = render(<ChatRoomContainer/>);
    expect(true).toBeTruthy();
  });
});

但随后我收到大量与不应再使用的旧模块相关的警告:

Warning: CheckBox has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '@react-native-community/checkbox' instead of 'react-native'. See https://github.com/react-native-community/react-native-checkbox
Warning: DatePickerIOS has been merged with DatePickerAndroid and will be removed in a future release. It can now be installed and imported from '@react-native-community/datetimepicker' instead of 'react-native'. See https://github.com/react-native-community/datetimepicker

那么测试 react-native 的此类功能(如 Vibration)的最佳方法是什么？

提前感谢您的宝贵时间!

Answer 1

您可以使用库路径模拟 react-native，如下所示:

const mockedVibrate = jest.fn();
jest.mock('react-native/Libraries/Vibration/Vibration', () => ({
  vibrate: mockedVibrate,
}));