TypeError: _axiosMockAdapter.MockAdapter is not a constructor

Question

I'm using vuejs, vue-testing-library, jest, axios, and axios-mock-adapter to test a component. I'm immediately running into the following error when trying to run my test:

TypeError: _axiosMockAdapter.MockAdapter is not a constructor

My test:

import GlobalSearch from '../src/components/global_search.vue';
import { render, fireEvent } from '@testing-library/vue';
import { axios } from 'axios';
import { MockAdapter } from 'axios-mock-adapter';

// jest.mock("axios", () => ({
//  get: () => Promise.resolve(
//      [{
//          "content":"Keith's Company - Keith's First Project",
//          "id":3,
//          "searchable_type":"Project",
//          "url":"/projects/1"
//      }]
//  )
// }))

describe('GlobalSearch', () => {
    it('It renders its default state', async () => {
        let mock = new MockAdapter(axios);

        const { findByText, getByText } = render(GlobalSearch);

        findByText('Companies, Contacts, Projects');

        const searchResults = [{
            "content":"Keith's Company - Keith's First Project",
            "id":3,
            "searchable_type":"Project",
            "url":"/projects/1"
        }]
        mock.onGet('/search/index').reply(200, searchResults);

        await fireEvent.update(getByText('Companies, contacts, projects'), 'ke')

        getByText('First Project');
    });
});

What am I doing wrong? Also, is this stack pretty standard?

Answer 1

MockAdapter is a default export, so remove the braces on the import statement:

import MockAdapter from 'axios-mock-adapter';

instead of:

import { MockAdapter } from 'axios-mock-adapter';