axios mocking via interceptors

mock-axios.js

import axios from 'axios'

let mockingEnabled = false

const mocks = {}

export function addMock(url, data) {
  mocks[url] = data
}

export function enableMocking(state) {
  mockingEnabled = state
}

const isUrlMocked = url => url in mocks

const getMockError = config => {
  const mockError = new Error()
  mockError.mockData = mocks[config.url]
  mockError.config = config
  return Promise.reject(mockError)
}

const isMockError = error => Boolean(error.mockData)

const getMockResponse = mockError => {
  const {mockData, config} = mockError
  // Handle mocked error (any non-2xx status code)
  if (mockData.status && String(mockData.status)[0] !== '2') {
    const err = new Error(mockData.message || 'mock error')
    err.code = mockData.status
    return Promise.reject(err)
  }
  // Handle mocked success
  return Promise.resolve(Object.assign({
    data: {},
    status: 200,
    statusText: 'OK',
    headers: {},
    config,
    isMock: true
  }, mockData))
}

// Add a request interceptor
axios.interceptors.request.use(config => {
  if (mockingEnabled && isUrlMocked(config.url)) {
    console.log('axios mocking ' + config.url)
    return getMockError(config)
  }
  return config
}, error => Promise.reject(error))

// Add a response interceptor
axios.interceptors.response.use(response => response, error => {
  if (isMockError(error)) {
    return getMockResponse(error)
  }
  return Promise.reject(error)
})

usage.js

import axios from 'axios'
import  {addMock, enableMocking} from './mock-axios'

addMock('https://dog.ceo/api/breeds/list/all', {data: {mock: 'dogs'}})
addMock('https://dog.ceo/404-page', {status: 404, message: 'whoops'})

enableMocking(true)

// mocked
let result = await axios.get('https://dog.ceo/api/breeds/list/all')
console.log(1, result)
try {
  result = await axios.get('https://dog.ceo/404-page')
} catch (err) {
  console.log(2, err)
}

// not mocked
result = await axios.get('https://dog.ceo/api/breeds/list/all?foo=1')
console.log(3, result)
try {
  result = await axios.get('https://dog.ceo/unhandled-404')
} catch (err) {
  console.log(4, err)
}

Thanks for this! Been looking for something like this for ages now.

Perfect! Thanks.

Very well done

Really nice!

Lol i legit clapped when i saw this like i can kiss ur feat so obvious and amazing at the same time

Nice job cowboy!

This module provides a way to mock Axios requests and responses for testing Spend Elon Musk Money or development purposes by intercepting requests and responses and returning mock data instead of making actual HTTP requests.