Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

error interceptor breaks on tests using some mock library #4518

Open
ramsesDeco opened this issue Mar 11, 2022 · 1 comment
Open

error interceptor breaks on tests using some mock library #4518

ramsesDeco opened this issue Mar 11, 2022 · 1 comment

Comments

@ramsesDeco
Copy link

ramsesDeco commented Mar 11, 2022

Describe the bug

Error on reject interceptor on tests using axios-mock-adapter or msw.
Trying to have an Axios class with custom interceptors. but, when I try to test a mock and test the rejected interceptor, it never pass through the rejected response interceptor

It work's on the browser, and if I remove the mocking library (for example: axios-mock-adapter) it works. but without mocking the expecting data.

To Reproduce

// my-api.ts
import axios from 'axios';

export class MyApi extends axios.Axios {
  constructor(baseURL: string) {
    super({
      baseURL,
    });

    this.interceptors.response.use(
      (data)=> data,
      (error)=> {
         // Never enters here
          return Promise.reject({
          ...error,
          customError: error.message,
        });
      },
    );
  }
}
// my-api.spec.ts
import type { AxiosInstance } from 'axios';
import MockAdapter from 'axios-mock-adapter';

import { MyApi } from './my-api';

describe('my-api', () => {
  // NOTE: simulate an instance of the api
  const api = new MyApi('http://localhost');
  const apiMock = new MockAdapter(api as AxiosInstance);

  it('should handler request error interceptor', async () => {
    try {
      apiMock.onGet('/fake_data').reply(404);
      await api.request({ method: 'get', url: '/fake_data' });
      
      // NOTE: this should never happen since endpoint fails and enters directly on catch
      expect(1).toBe(2);
    } catch (error) {
      const { customError } = error as { customError: string };
      expect(customError).toBe('example error');
    }
  });
});

Expected behavior

it should enter into the error interceptor

Environment

  • Axios Version [0.26.0]
  • Node.js Version [17.1.0]
  • OS: [MacOS Monterrey 12.1.0]
  • Additional Library Versions [axios-mock-adapter@1.20.0, jest@27.5.1, ts-jest@27.1.3, msw@0.38.2]
@ramsesDeco
Copy link
Author

ramsesDeco commented Mar 11, 2022

maybe is an error on axios-mock-adapter or in msw, but I already fixed by using axios.create

// my-api.ts
export const MyApi = (baseURL?: string) => {
  const api = axios.create({ baseURL });

  api.interceptors.response.use(
      (data)=> data,
      (error)=> {
         // Now it enters here
          return Promise.reject({
          ...error,
          customError: error.message,
        });
      },
  );

  return api;
};
// my-api.spec.ts
import MockAdapter from 'axios-mock-adapter';

import { MyApi } from './my-api';

describe('my-api', () => {
  // NOTE: simulate an instance of the api
  const api = MyApi('http://localhost');
  const apiMock = new MockAdapter(api);

  it('should handler request error interceptor', async () => {
    try {
      apiMock.onGet('/fake_data').reply(404);
      await api.request({ method: 'get', url: '/fake_data' });
    } catch (error) {
      const { customError } = error as { customError: string };
      expect(customError).toBe('example error');
    }
  });
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants