具有重复参数的 Axios 模拟适配器答案

【问题标题】：Axios Mock Adapter with repeated params具有重复参数的 Axios 模拟适配器
【发布时间】：2020-10-14 14:25:36
【问题描述】：

我在 react 应用程序中使用模拟适配器进行测试，其中一个看起来像这样：

http://endpoint.com/api/entities?id=123&select=labels&select=versions&labelsLang=en

需要注意的重要部分是select 参数在那里出现了两次。

其中一个测试以另一种语言呈现，因此我们设置了两个模拟端点来反映这一点，但是我似乎找不到正确模拟重复参数的方法。我只是继续获得第一个结果。

模拟端点的代码如下：

const mockApiClient = axios.create({ baseURL: "http://localhost" });
const mock = new MockAdapter(mockApiClient);

const params1 = new URLSearchParams();
params1.append("id", "123");
params1.append("select", "labels");
params1.append("select", "versions");
params1.set("labelsLang", "en");
mock
  .onGet("/entities", {
    asymmetricMatch: function(actual: any) {
      return actual.params.toString() === params1.toString();
    },
  })
  .reply(200, getCompanyResponse);

const params2 = new URLSearchParams();
params2.append("id", "123");
params2.append("select", "labels");
params2.append("select", "versions");
params2.set("labelsLang", "de");
mock
  .onGet("/entities", {
    asymmetricMatch: function(actual: any) {
      return actual.params.toString() === params2.toString();
    },
  })
  .reply(200, getCompanyResponseDE);

我知道这很乱，我只是想了解如何正确地做到这一点。

每当我尝试在对象中指定特定参数时，它都会抱怨您不能有重复的键。

（即。 { params:{select:'labels', select:'versions} })

【问题讨论】：

标签： reactjs unit-testing axios

【解决方案1】：

解决了。

这是怎么做的：

const mockApiClient = axios.create({ baseURL: "http://localhost" });
const mock = new MockAdapter(mockApiClient);

const params1 = {
  "id": "123",
  select: ["labels", "versions"],
  "labelsLang": "en",
};
mock
  .onGet("/entities", {
    params: {
      asymmetricMatch: function(actual: any) {
        actual.sort(); // Important, as without it the order of params would affect the result
        return actual.toString() === toURLSearchParams(params1).toString();
      },
    },
  })
  .reply(200, getCompanyResponse);


export const toURLSearchParams = (params: {[key: string]: string|string[]}, sort:boolean = true):URLSearchParams => {
  if(params instanceof URLSearchParams) return params

  const searchParams = new URLSearchParams();
  for(const key in params){
    const value = params[key];
    if(Array.isArray(value)){
      value.forEach((eachValue) => {
        searchParams.append(key, eachValue)
      })
    } else {
      searchParams.append(key,value)
    }
  }
  if(sort) searchParams.sort() // Likewise here. 
  return searchParams;
}

【讨论】：