首页 > 解决方案 > 如何使用 Vue + Jest 模拟 axios 帖子

问题描述

我正在尝试通过 Jest 在 Vue 中测试一个方法,我必须在这个方法中测试一个 Axios 请求。

我已经搜索了几个解决方案,但我没有找到一个与我的场景匹配的解决方案,我无法测试这个请求,即使我使用了 moxios 和其他 npm 包

// config.vue
methods: {
    async config () {
      await axios.post('/users/config')
        .then(res => {
          if (res.data.success) {
            M.toast({html: res.data.message, classes: 'green'})
            this.$router.push('/tour')
          }
        })
        .catch(() => {
          M.toast({html: 'Não foi possível contactar, ou você não possui permissão!', classes: 'red'})
        })
    }
  }
```js
// config.spec.js

import { mount, createLocalVue } from '@vue/test-utils'
import config from '@/components/config'
import axios from '@/axios-auth'
jest.mock('axios')

const localVue = createLocalVue()


describe('config', () => {
  const spy = jest.fn()

  it('mocking axios request', () => {
    const wrapper = mount(config, {
      localVue
    })
    wrapper.vm.config()
    expect(spy).toHaveBeenCalledWith('/users/config', 'post', {success: true, message: 'Configuração realizada!'})
  })
})

标签: vue.jsjestjsaxios

解决方案


推荐阅读