Question

我正在Jest写一个单元测试。

在我正在测试的单位中

import queryString from 'query-string'

它正在执行代码：

queryString.stringify(ids)

其中id是以下格式的数组：

[{ id: '123' },{ id: '321' }]

此代码在我部署的网页中运行时效果很好，但在JEST测试中，它提供了以下输出：

id=%5Bobject%20Object%5D&id=%5Bobject%20Object%5D

而浏览器中的相同代码则给出：

id=123&id=321

根据query-string模块的要求，我正在使用节点＆gt;的验证; 6.

我还补充说：

/* jest commonjs */

到我的测试文件的顶部，作为查询字符串目标节点。

此外，我尝试在stringify中设置各种选项，但无济于事。

有谁能告诉我为什么我在这些不同的环境中得到不同的结果以及如何让我的测试工作？即不将字符串渲染为“％5Bobject％20”。

当然，我可以实现自己的stringify方法，但是这个库是为了这个而构建的！

Answer 1

您能否定义预期的行为？

根据documentation，stringify()将对象转换为查询。由于您传递了ids元素数组，因此可能会有不同的行为。

请注意，在javascript中，数组是一个以数字作为键的对象，因此[ { id: '123' }, { id: '456' } ]实际上看起来像{ '0': { 'id': '123' }, '1': { 'id': '456' } }（看一下数组的Object.keys，你＆＃ 39;我会看到它['0','1']）。

那就是说，queryString正在做的是将每对键值转换为key=value，其中key和values已被＆＃34;字符串化＆＃34; （我通过String构造函数假设）。由于该值是一个对象，它会返回您正在查看的内容（事实上，String({})是[object Object]。我期望（并且我确实得到的）来自字符串化因此，对象数组类似0=[object Object]&1=[object Object]（方括号转换为%5B和%5D，空格转换为%20。）

我真的不知道questionId来自何处，所以应该提供更多的上下文（例如，显示实际对象的字符串化可能很有用）但是，为了达到目的，为了避免将对象转换为[object Object]，您应该使用一个键提取器，它返回您实际想要显示为值的值。

因此，举例来说，如果您的数组如上所述，并且您希望获得的结果是0=123&1=456，那么您可以执行以下操作：

const ids = [ {id: '123'}, {id: '456'} ];
queryString.stringify(ids.map(v => v.id))

相反，如果预期行为是id=123&id=456，则需要将数组转换为对象{ id: ['123','456'] }。您可以使用以下

执行此操作

const ids = [ {id: '123'}, {id: '456'} ];
queryString.stringify({ id: ids.reduce( (c,v) => c.concat(v.id), []) })

因此，您需要将原始ids数组转换为适合stringify的对象。

Answer 2

你可以使用这个 npm 包 https://www.npmjs.com/package/qs
它有一个有效的 qs.stringify

查询字符串模块中的stringify在Jest测试中无法正常工作

2 个答案: