Question

我的vue代码调用element-ui个模块：

// in main.js
import { Notification } from "element-ui";

起初，我的测试是投掷

无法从'test.js'找到模块'Element'

所以我用

模拟了模块

jest.mock('element-ui', () => ({
  Element: jest.fn(),
}))

然而，

仍然出错

找不到'test.js'中的模块'element-ui / lib / theme-default / element.css'

我不知道如何通过这个。

有什么想法吗？感谢。

如果我在test.js中导入element-ui组件：

ReferenceError: document is not defined

      at Object.<anonymous> (node_modules/element-ui/lib/utils/dom.js:22:39)
      at Object.<anonymous> (node_modules/element-ui/lib/utils/popup/popup-manager.js:9:12)
      at Object.<anonymous> (node_modules/element-ui/lib/utils/popup/index.js:14:21)

（Jest 21.2，vue-test-utils 1.0.0）

Answer 1

这有助于：https://github.com/eddyerburgh/vue-hackernews/

我现在导入main.js中所有与element-ui相关的组件，并且我模拟调用其组件之一的每个方法：

beforeEach(() => {
    // Mock this method that calls a Notification element-ui component.
    vm.notifyWarning = jest.fn();
  })

Answer 2

我要做的是在每个测试文件之前注册所有Element-UI组件。

jest.config.js（https://jestjs.io/docs/en/configuration#setupfiles-array）

InputElement cityInput = querySelector('#city-input'); final cityName = cityInput.value;

eachTest.js

module.exports = { ..., setupFiles: ['./jest/eachTest.js'], ... }

Vue，Jest：如何模拟element-ui组件？找不到模块element.css

2 个答案: