Question

我正在尝试为vue组件collector设置测试，该组件正在导入Javascript模块以收集一些数据。

components / collector.vue

<script>
import dataService from '@/services/dataService.js';
...

dataService.collectResults().then(results => {
  this.data = results;
});
</script>

javascript文件：

services / dataService.js

let dataService = {
    collectResults() {
        [...]
        return dataPromise;
    }
    [...]
} 
export default dataService;

我正在使用jest来测试collector组件，并尝试模拟collectResults方法。

collector.spec.js

jest.mock('dataService');
import { mount } from '@vue/test-utils';
import collector from '@/components/collector.vue';
import VueRouter from 'vue-router';


describe('behaviour tests', () => {
  let cmp;
  beforeEach(() => {
    Vue.use(VueRouter);
    const router = new VueRouter();
    cmp = mount(collector, {
      router
    });

it('dummy test', () => {
  console.log(cmp.vm.data);
}

services / __ mocks __ / dataService.js

const dataServiceMock = jest.genMockFromModule('dataService');

function __collectResults() {
  return new Promise(() => {
    console.log('mocked!');
    [...]
  });
}

dataServiceMock.collectResults = __collectResults;
export default dataServiceMock;

但是，在运行测试时，原始的dataService.js文件正在执行（在我的情况下会导致异常）。

考虑到我必须模拟10个函数，而其他函数保持原样，这种情况下正确的方法应该是什么？

从Vue导入的模拟JavaScript函数

0 个答案: