VueJs. Шутка. У меня проблемы с издевательством над моими звонками

Question

Я использую JEST для тестирования

Это мой api.js, который представляет собой список конечных точек

import axios from 'axios';

const apiClient = axios.create({
    baseURL: 'http://172.16.3.171:8085',

});

export default {

    displayApplications()
    {
        return apiClient.get('/getData/application/list');
    },
    getActiveApplicationsCount(){
        return apiClient.get('/getData/ActiveApplicationCount');
    },
    getInactiveApplicationsCount(){
        return apiClient.get('/getData/InActiveApplicationCount');
    },
    getTotalApplicationsCount(){
        return apiClient.get('/getData/AllApplicationCount');
    },
    postSaveApplication(){
        return apiClient.post('/getData/application/addOrUpdate',formData);
    }
}

Здесь я вызываю функцию отображения в methods{}:

async displayData(){
    try {
      console.log('in displayData:---*****---')
      const response =  await this.$api.displayApplications().then(res => {
        this.rows = res.data;
        console.log("Data is: ",this.rows)
      });
    } catch (error) {
        console.log("Error in displayData",error)
    }
    }, 

Это мой *.spec.js файл

import { shallowMount  } from "@vue/test-utils";
import Applications from "@/components/dashboard/admin/Applications.vue";
import mockAxios from "axios";

beforeEach(() => {
    cmp = shallowMount(Applications, {
      data() {
        return {
          form: {
            applicationName: "",
            applicationUrl: ""
          }
        };
      },
    });
    jest.mock('../../../../api.js');
    jest.resetModules();
    jest.clearAllMocks();
  });

it("axios call for displayData()", async () => {
    mockAxios.api.displayApplications(() =>Promise.resolve({
      data: {
        results: [
          { applicationName: "hello", url: "hello.co.in", status: "active" }
        ]
      }
    }) );
    const result = await api.displayApplications();
    // cmp.vm.displayData = result
    expect(result).toEqual([
      { applicationName: "hello", url: "hello.co.in", status: "active" }
    ]);
});
});

Также я создал фиктивные аксиосы ​​в отдельном файле. в папке mocks .

module.exports = {
        create: jest.fn(() => Promise.resolve({data: {} })),
        get: jest.fn(() => Promise.resolve({ data : { } })),
        post: jest.fn(() => Promise.resolve({data : { } })),
}

Это работало раньше, когда я использовал вызовы get внутри моего компонента. Теперь вызовы API находятся в отдельном файле.

Я запутался, как издеваться над файлом api.js и заставить его работать в тестировании. Я получаю эту ошибку.

  console.log src/components/dashboard/admin/Applications.vue:1399
    Error in displayData TypeError: Cannot read property 'displayApplications' of undefined
        at VueComponent.displayData (D:\RPF Project\rpf-project\src\components\dashboard\admin\Applications.vue:1386:52)
        at VueComponent.created (D:\RPF Project\rpf-project\src\components\dashboard\admin\Applications.vue:1409:12)
        at invokeWithErrorHandling (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:1850:57)
        at callHook (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:4201:7)
        at VueComponent.Vue._init (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:4983:5)
        at new VueComponent (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:5128:12)
        at createComponentInstanceForVnode (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:3277:10)
        at init (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:3108:45)
        at createComponent (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:5952:9)
        at createElm (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:5899:9)
        at VueComponent.patch [as __patch__] (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:6449:7)
        at VueComponent.Vue._update (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:3927:19)
        at VueComponent.updateComponent (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:4048:10)
        at Watcher.get (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:4459:25)
        at new Watcher (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:4448:12)
        at mountComponent (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:4055:3)
        at VueComponent.Object.<anonymous>.Vue.$mount (D:\RPF Project\rpf-project\node_modules\vue\dist\vue.runtime.common.dev.js:8386:10)
        at mount (D:\RPF Project\rpf-project\node_modules\@vue\test-utils\dist\vue-test-utils.js:8649:21)
        at shallowMount (D:\RPF Project\rpf-project\node_modules\@vue\test-utils\dist\vue-test-utils.js:8677:10)
        at Object.beforeEach (D:\RPF Project\rpf-project\src\test\spec\dashboard\admin\Applications.spec.js:9:11)
        at Object.asyncJestLifecycle (D:\RPF Project\rpf-project\node_modules\jest-jasmine2\build\jasmineAsyncInstall.js:53:37)
        at resolve (D:\RPF Project\rpf-project\node_modules\jest-jasmine2\build\queueRunner.js:43:12)
        at new Promise (<anonymous>)
        at mapper (D:\RPF Project\rpf-project\node_modules\jest-jasmine2\build\queueRunner.js:26:19)
        at promise.then (D:\RPF Project\rpf-project\node_modules\jest-jasmine2\build\queueRunner.js:73:41)
        at process._tickCallback (internal/process/next_tick.js:68:7)