对带有笑话的组件使用自定义模拟

Question

我正在编写一个React-Native应用程序，在其中我需要测试一个屏幕：

MyScreen.js

import React, { Component } from "react";
import CustomTable from "./CustomTable";

export default MyScreen extends Component {
  render() {
    return <CustomTable />;
  }
}

CustomTable.ios.js

import React, { Component } from "react";
import { View } from "react-native";
import TableView from "react-native-tableview";

export default MyScreen extends Component {
  render() {
    return (
      <View>
        ...some stuff
        <TableView />
      </View>
    );
  }
}

react-native-tableview调用了一些iOS特定代码，因此我仅通过返回文件夹中的android版本（CustomTable.android.js）就将其模拟了__mocks__

__mocks__/CustomTable.ios.js

import CustomAndroidTable from "../CustomTable.android";
export const CustomTable = CustomAndroidTable;

我想MyScreen.js用Jest 进行测试，但我希望它使用__mock__/CustomTable.ios。我该如何去做呢？Jest甚至有可能吗？我当前的测试文件如下所示：

tests/MyScreen.test.js

import React from "react";
import renderer from "react-test-renderer";
import MyScreen from "../src/MyScreen";

describe("test", () => {
  it("works", () => {
  jest.mock("../src/CustomTable.ios");
  const tree = renderer.create(
    <MyScreen />,
  ).toJSON();
  expect(tree).toMatchSnapshot();
});

但它仍称为的原始版本CustomTable.ios。我究竟做错了什么？

Answer 1

您应该在套件测试之外调用jest.mock。应该在您导入后立即进行。

import React from "react";
import renderer from "react-test-renderer";
import MyScreen from "../src/MyScreen";

jest.mock("../src/CustomTable.ios");

describe("test", () => {
  it("works", () => {
  const tree = renderer.create(
    <MyScreen />,
  ).toJSON();
  expect(tree).toMatchSnapshot();
});