Question

如果我尝试使用yarn run jest运行以下内容，则会出现 TypeError：_vm。$ t不是函数，因为SearchField正在使用翻译（"$t('search')"。

import { mount } from "@vue/test-utils";
import SearchField from "@/components/ui/SearchField";

describe("SearchField", () => {
  const wrapper = mount(SearchField);

  it("renders correctly", () => {
    expect(wrapper.element).toMatchSnapshot();
  });
});

如果在开头添加以下三行，则会出现 TypeError：无法读取未定义的属性'_t'。

import Vue from "vue";
import VueI18n from "vue-i18n";
Vue.use(VueI18n);

Answer 1

nuxt-i18n是一个外部库，而不是您自己的代码，因此测试良好实践要求我们仅模拟翻译库及其所需的功能（在这种情况下为$t）。

以下代码可以解决您的问题：

describe("SearchField", () => {
  const wrapper = mount(SearchField);

  it("renders correctly", () => {
    mocks: {
      $t: (msg) => msg
    }
    expect(wrapper.element).toMatchSnapshot();
  });
});

有关此方法的更多信息，请参见here。

如何对使用nuxt-i18n的Vue.js组件进行单元测试

1 个答案: