Jest 的 `it.each()` 描述用于在引用 $predicate 时呈现箭头函数源代码

2024-01-21

问题定义

Jest 允许测试用例的数据用于it.each's name via $- 前缀变量。

下面的代码产生如下输出:

 PASS  src/array-functions/find-pairwise.spec.ts
  findPairwise
    √ should return [1, 2] for [1, 2, 3] and [Function anonymous] (7ms)
    √ should return [1, 2] for [1, 2, 3] and [Function anonymous] (1ms)
    √ should return [2, 3] for [1, 2, 3] and [Function anonymous]
    √ should return [2, 3] for [1, 2, 3] and [Function anonymous] (1ms)
    √ should return [undefined, undefined] for [1, 2, 3] and [Function anonymous]

Test Suites: 1 passed, 1 total
Tests:       5 passed, 5 total
Snapshots:   0 total
Time:        4.061s
Ran all test suites related to changed files.

如您所见,$expected and $array变量以人类友好的形式呈现(在本例中是基本的 JavaScript 数组)。 但是,那$predicate显示通用文本[Function anonymous]而不是它的实际代码。 我知道 JS 中的常规函数​​和箭头函数都可以暴露它们的源代码,如果你调用.toString()在他们。 有没有办法指示 Jest 渲染结果toString()称呼? 我确实尝试过$predicate.toString() and $(predicate.toString())但他们都没有工作。

Code

import { findPairwise } from './find-pairwise';

describe(findPairwise.name, () => {
  it.each`
    array        | predicate                                | expected
    ${[1, 2, 3]} | ${(l: number, r: number) => l === 1}     | ${[1, 2]}
    ${[1, 2, 3]} | ${(l: number, r: number) => r === 2}     | ${[1, 2]}
    ${[1, 2, 3]} | ${(l: number, r: number) => r === 3}     | ${[2, 3]}
    ${[1, 2, 3]} | ${(l: number, r: number) => l + r === 5} | ${[2, 3]}
    ${[1, 2, 3]} | ${(l: number, r: number) => l === r }    | ${[undefined, undefined]}
  `
  ('should return $expected for $array and $predicate', ({ array, predicate, expected }) => {
//                                         ^^^^^^^^^^
//                                         ||||||||||
//                                         I'd like this to be rendered
//                                         as the code of the arrow function.
//                                         E.g. "(l: number, r: number) => l === 1"
//                                         ...or something close to it.

    expect(findPairwise(array, predicate)).toEqual(expected);
  });
});

当您使用标记模板文字 https://jestjs.io/docs/en/api#2--testeachtablename-fn-timeout-版本为table的参数it.each,笑话正在使用漂亮的格式 https://www.npmjs.com/package/pretty-format后台库从测试数据生成标题(如果测试数据不是原始类型)。

不幸的是,对于您的目的而言,pretty-format图书馆似乎没有使用toString函数中的方法以格式化它们。

作为替代解决方案,您可以使用数组版本 https://jestjs.io/docs/en/api#testeachtablename-fn-timeout为了table范围:

it.each([
    [ [1, 2], [1, 2, 3], (l, r) => l === 1 ],
    [ [1, 2], [1, 2, 3], (l, r) => r === 2 ],
    [ [2, 3], [1, 2, 3], (l, r) => r === 3 ],
    [ [2, 3], [1, 2, 3], (l, r) => l + r === 5 ],
    [ [undefined, undefined], [1, 2, 3], (l, r) => l === r ],
])
('should return %p for %p and %s', (expected, array, predicate) => {
    expect(findPairwise(array, predicate)).toEqual(expected);
});

请注意,我更改了参数的顺序,以便预期值位于第一位。这是因为测试数据和标题中的占位符之间的映射是基于数组版本中的顺序table for it.each.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Jest 的 `it.each()` 描述用于在引用 $predicate 时呈现箭头函数源代码 的相关文章

  • 粘性页脚不粘在 AngularJS 中

    Im working an angular site and im trying to implement a sticky footer across all views but the footer stops sticking whe
  • LeafletJs只显示一个国家

    我使用 Leafletjs 和 D3 来显示地图 我只想在地图上显示英国 Leaflet和D3是否可以只显示英国 这当然是可能的 现在的解决方案取决于您是想使用 D3 绘制英国 还是想从 Tile Server 获取它 在后一种情况下 有一
  • d3 树 - 有相同孩子的父母

    我一直在将代码从 JIT 转换为 D3 并使用树布局 我已经复制了代码http mbostock github com d3 talk 20111018 tree html http mbostock github com d3 talk
  • 如何在D3节点中放置图像?

    到目前为止 我已经创建了这些 D3 节点 用于创建可折叠的层次树 到目前为止 这些节点的颜色为 AA1C1C 深红色 以表明如果您单击它们 它们将扩展到更多节点 我想要做的是在节点中使用图像中的位置 这对于所有用户来说都是一个加号 以知道它
  • javascript中.match和.test有什么区别[关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 在浏览 JavaScript 时 我刚刚遇到了 match test 和 exec有什么不同 这是最快的 首先 exec and test
  • 在 ASP.NET MVC 中使用 bootstrap 创建模式

    我在 ASP NET MVC 项目上使用 NET Framework 4 5 Bootstrap v3 3 6 我想做的是创建一个模态表单 我尝试了以下方法 在主布局中创建了一个模态容器 div class modal fade style
  • console.log 是如何工作的?

    第一个例子 在以下示例中 http jsfiddle net maniator ScTAW 4 http jsfiddle net maniator ScTAW 4 我有这个js var storage function var store
  • 在 Fabric.js 中进行裁剪的“toDataURL”函数中,Multiplier 属性无法正常工作

    我的原始尺寸canvas is 800X700 我在用clipTo要在画布的选定部分中工作 var rect new fabric Rect left 100 top 50 fill fff width 376 height 602 str
  • 获取 Firebase AngularFire 中项目的索引 ID

    这里提出了类似的问题 但接受的答案并没有真正回答这个问题 使用 AngularFire 是否可以创建关系型数据库 或者访问 UniqueID https stackoverflow com questions 16879484 using
  • 如何查明在 Chrome 控制台中按下按钮时会调用哪些函数?

    我正在尝试自学 Google Closure javascript 库 我正在检查 TreeControl UI 小部件 如何使用Chrome控制台分析当我点击下面演示中的 剪切 按钮时运行了哪些功能 例如 我可以为此设置一个断点吗 我尝试
  • 如何在 d3.js 中填充 svg 圆圈内的图像

    这是我在 svg 中填充圆圈的代码 var svgContainer d3 select body append svg attr width 1000 attr height 1000 var circles svgContainer s
  • d3 序数尺度的映射

    我正在使用 D3 的序数比例将数字映射到颜色 我用过这个 color d3 scale ordinal range 1f77b4 ff7f0e 2ca02c d62728 9467bd 8c564b e377c2 domain 0 6 co
  • 在 Jscript 中实例化 System.Threading.Thread 对象

    我正在尝试使用 Jscript 创建一个新的 System Threading Thread 对象 但我无法让构造函数工作 如果我只是执行以下操作 var thread new Thread threadFunc function thre
  • 如何控制谷歌地图标记的不透明度

    我需要根据时间使一些标记半透明 有什么方法可以控制标记的 CSS 不透明度吗 或者是否可以可靠地找出标记的 DOM 元素 我使用 Google 地图 API v3 标记的不透明度可以设置为marker setOptions opacity
  • 在 gulp 和 browsersync 问题中观看新文件

    我使用 browsersync 在文件更改时重新加载浏览器 而且它工作完美 但是当我创建新文件 例如 html scss js 时 bowsersync 不起作用 如何解决这个问题 gulpjs Browser Sync gulp task
  • 在 Mobile Safari 中点击

    敲击
  • 显示对象内容 - JS/jQuery

    With this data events 返回 object Object 我需要看看里面到底发生了什么 我找到了这个 var Finder each this data events function i n Finder Name i
  • 如何创建浏览器插件?

    我必须创建一个插件 当用户将鼠标悬停在某些术语上时 该插件必须显示信息 谁能告诉我如何做的方向 我对创建插件没有太多想法 我知道我想要做的事情可以通过java脚本来完成 但是java脚本文件可以作为浏览器插件安装吗 任何对此的想法将不胜感激
  • 在 Jasmine 测试中配置 Angular 服务提供者

    我的服务有someModule module someModule provider someService function this options this get function return options 我正在编写规范 到目
  • 如何选中表格中输入文本焦点上的复选框

    我试图在输入文本焦点上检查表 DOM 中的复选框 但无法访问复选框元素 但我的焦点正在工作 这是我的 jsfiddle 链接https jsfiddle net 9qha9vft https jsfiddle net 9qha9vft 这是

随机推荐