如何使用Jest测试i18next时解决“ TypeError:无法读取未定义属性'type'”的问题

时间:2019-04-04 04:06:38

标签: typescript jestjs i18next react-i18next

我有一个react项目,我已经包含了i18next = 15.0.4和react-i18next = 10.2.0依赖项。我已经创建了一个用于使用react-i18next初始化i18next的模块,并且我正在尝试使用Jest对该代码进行单元测试。

我尝试导入用于初始化i18next的i18n模块并使用玩笑对它进行单元测试。

这是我的i18n.ts模块

i

我正在尝试从我的测试代码中调用它(i18n.test.ts):

import i18next from "i18next";
import { initReactI18next } from "react-i18next";

const config = {
    resources: {
        en: {
            static: {},
        },
    },
    fallbackLng: "en",
    defaultNS: "static",
    ns: "static",
    interpolation: {
        prefix: "[",
        suffix: "]",
    },
};

i18next.use(initReactI18next).init(config);

export default i18next;

我希望该测试通过,但是却出现了以下错误:

import i18n from "./i18n";

describe("i18n", () => {

    it("should work fine", () => {
        const strings = {
            key: "value",
        };
        i18n.addResourceBundle("en", "static", strings, true, true);
    });
});

在i18next.js中基本上指出了这段代码

TypeError: Cannot read property 'type' of undefined
      at I18n.use (node_modules/i18next/dist/commonjs/i18next.js:257:18)

如何解决此问题?

5 个答案:

答案 0 :(得分:1)

尝试一下:

const reactI18nextModule = require("react-i18next");

代替

import { initReactI18next } from "react-i18next";

在此处详细了解require与import进行笑话测试:

Jest mocking default exports - require vs import

希望它会有所帮助:)

答案 1 :(得分:0)

失败功能:

function use(module) {
      if (module.type === 'backend') { // cannot read `type` of `undefined`

结论:moduleundefined。它来自:

i18next.use(initReactI18next)

结论:initReactI18next未定义。它来自:

import { initReactI18next } from "react-i18next";

结论:initReactI18next不是从react-i18next导出的东西

答案 2 :(得分:0)

也许您已经从<= V9更新到了> = {{11}}。因为{= V10中不再提供reactI18nextModule。尝试改用V10

有关更多详细信息,请访问https://react.i18next.com/latest/migrating-v9-to-v10

答案 3 :(得分:0)

您很可能遵循了本指南: https://react.i18next.com/misc/testing

它说您应该使用此模拟:

stdout

但是,当您执行此操作时,您不会在这里尝试使用jest.mock('react-i18next', () => ({ // this mock makes sure any components using the translate HoC receive the t function as a prop withTranslation: () => Component => { Component.defaultProps = { ...Component.defaultProps, t: () => "" }; return Component; }, }));

initReactI18next

文档破坏了您:(

您需要的是删除存根或在存根模块中提供import { initReactI18next } from "react-i18next"; i18next.use(initReactI18next).init(config); 键。

我已在此处通知作者:https://github.com/i18next/react-i18next-gitbook/pull/42

答案 4 :(得分:0)

您需要模拟initReactI18next。请尝试以下操作:

jest.mock('react-i18next', () => {
  const useMock = [k => k, {}];
  useMock.t = k => k;

  return {
    useTranslation: () => useMock,
    initReactI18next: () => {}
  };
});