Question

我无法使用axios编写单元测试。当我模拟axios时，它返回未定义。我正在使用vue-test-utils和jest（请参见下面的代码）。我已经检查过文档，但无法弄清楚。

import { shallowMount } from '@vue/test-utils';
import flushPromises from 'flush-promises';
import Vue from 'vue';
import Vuetify from 'vuetify';
import axios from 'axios';
import FrontendUser from '@/views/Users/FrontendUser';
import store from '@/store';
import "@/config/axios";

jest.mock('axios');

Vue.use(Vuetify);

describe("FrontendUser.vue", () => {
  test("Data are download successfully", async () => {
    const wrapper = shallowMount(FrontendUser, {
      store,
      mocks: {
        $t: () => { },
      }
    });
    const vm = wrapper.vm;
    const response = [
      {
        id: 1,
        email: "example@example.com",
        username: "test",
        isTenant: false,
        getRole: "RegularUser"
      },
      {
        id: 2,
        email: "example@example.com",
        username: "test",
        isTenant: true,
        getRole: "RegularUser"
      }
    ]
    axios.get.mockImplementation(() => Promise.resolve({ status: 200, data: response }))
    await flushPromises();
    expect(vm.frontendUsers.length).toBeGreaterThan(0);
  })

});

以下是错误的屏幕截图： enter image description here

Answer 1

jest.mock('axios', {
    get: jest.fn(() => Promise.resolve({ status: 200, data: response })),
});

Vue测试-模拟axios返回未定义

1 个答案: