Mocking backend in vue component

test.js

// ArticlesDAO
import axios from 'axios';

export function findAll () {
  axios.get('/api/articles');
}



// ArticlesList.spec.js
import ArticlesList from 'components/ArticlesList'
import { shallowMount } from '@vue/test-utils';
import * as ArticlesDAO from 'dao/ArticlesDAO';
import delay from 'utils';

describe('ArticlesList', () => {
  let wrapper;
  
  async function mountComponent () {
    sinon.stub(ArticlesDAO, 'findAll').resolves([{ id: 1, name: 'Article 1' }, { id: 2, name: 'Article 2' }]);
    
    wrapper = shallowMount(ArticlesList, {});
    
    await delay();
  }
  
  afterEach(() => {
    sinon.restore();
  });
  
  it('articles are displayed properly', async () => {
    await mountComponent();
    expect(wrapper.findAll('.article__name').wrappers.map(w => w.text())).to.deep.equal(['Article 1', 'Article 2']);
  });
});