首页 > 解决方案 > 查询字符串模块中的字符串化在 Jest 测试中未按预期工作

问题描述

我正在用 Jest 编写单元测试。

在我正在导入的被测单元中

import queryString from 'query-string'

它正在执行代码:

queryString.stringify(ids)

其中 ids 是以下格式的数组:

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

此代码在我部署的网页中运行时运行良好,但在 JEST 测试中它提供以下输出:

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

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

id=123&id=321

根据查询字符串模块的要求,我使用的是节点 > 6 的版本。

我还补充说:

/* jest commonjs */

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

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

谁能告诉我为什么我在这些不同的环境中得到不同的结果以及如何让我的测试正常工作?即不将字符串呈现为“%5Bobject%20”。

当然,我可以实现自己的 stringify 方法,但是这个库就是为此而构建的!

标签: javascriptnode.jsunit-testingquery-stringjestjs

解决方案


您能否定义预期的行为?

根据文档stringify()将对象转换为查询。由于您传递ids的是一个元素数组,因此您可能会得到不同的可能行为。

请注意,在 javascript 中,数组是一个以数字为键的对象,所以[ { id: '123' }, { id: '456' } ]实际上看起来像{ '0': { 'id': '123' }, '1': { 'id': '456' } }(看看Object.keys数组,你会看到它['0','1'])。

因此,话虽如此,queryString 正在做的是将每对键值转换为key=value,其中keyvalues都已“字符串化”(我假设通过 String 构造函数)。由于该值是一个对象,因此它返回您所看到的东西(实际上String({})[object Object]。我期望(并且我确实得到)从对象数组的字符串化中得到的结果类似于0=[object Object]&1=[object Object](方括号已转换to%5B%5D和空格 to %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,则需要将数组转换为 object { id: ['123','456'] }。您可以通过以下方式做到这一点

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

因此,您需要将原始ids数组转换为适合stringify.


推荐阅读