axios 用jest动态创建模拟axio

kxxlusnw  于 2023-03-02  发布在  iOS
关注(0)|答案(1)|浏览(134)

我试着用笑话来嘲笑axios。这是我目前所拥有的:

jest.mock('axios', () => ({
  create: jest.fn(() => function () {
    return {
      data: {
        data: {
          subscription: [
            {
              tag: 'free',
            },
          ],
        },
      },
    };
  }),
}));

describe('Subscription store', () => {
  it('fetches subscription data', async () => {
    const subscription = useSubscriptionStore();
    await subscription.fetch();
  });
});

这是可行的,我没有得到任何错误。但是我想用不同的返回数据属性来做不同的测试用例,我想动态地传递它们来模拟。

return {
      data: {
        data: {
          subscription: [
            {
              tag: 'free',
            },
          ],
        },
      },
    };

我试着这样做

const mockAxios = (data) => {
  jest.doMock('axios', () => ({
    create: jest.fn(() => function () {
      return data;
    }),
  }));
};

describe('Subscription store', () => {
  beforeEach(() => {
    jest.resetModules();
  });

  it('fetches subscription data', async () => {
    const data = {
      data: {
        subscription: [
          {
            tag: 'premium',
          },
        ],
      },
    };

    mockAxios(data);
    const subscription = useSubscriptionStore();
    await subscription.fetch();
  });
});

这是我的服务类,我在其中模拟axios以使测试工作:

export default class Http {
 constructor() {
    this.axios = Axios.create();
 }

 sendRequest(method, url, config) {
    const promise = this.axios({
      method: method,
      url: url,
      ...config,
    });

    return promise;
  }
}

但现在我得到了这样的错误:

所以我不知道如何使这项工作将感谢一些帮助。

qkf9rpyu

qkf9rpyu1#

更新后的代码是直接从create函数返回数据对象,而不是将其 Package 在带有data属性的响应对象中,这导致Axios抛出状态代码为404的错误,因为它需要响应对象。
像这样:

const mockAxios = (response) => {
  axios.create = jest.fn(() => axios);
  axios.get.mockResolvedValue(response);
};

describe('Subscription store', () => {
  it('fetches subscription data', async () => {
    const data = {
      subscription: [
        {
          tag: 'premium',
        },
      ],
    };

    mockAxios({ data });

    const subscription = useSubscriptionStore();
    await subscription.fetch();

    expect(subscription.data).toEqual(data.subscription);
  });

  it('handles error response', async () => {
    const error = new Error('Not found');
    mockAxios(Promise.reject(error));

    const subscription = useSubscriptionStore();
    await expect(subscription.fetch()).rejects.toEqual(error);
  });
});

相关问题