javascript – 在对象数组上使用Jest属性匹配器

我试图使用Jest的新 Property Matcher功能(自 Jest 23.0.0起)来匹配包含生成字段的对象数组.我尝试使用expect.arrayContaining和expect.objectContaining同时手动匹配,同时使用普通对象和匹配器定义.目前有什么办法吗?
const sportsBallPeople = [
  {
    createdAt: new Date(),name: 'That one famous guy from Cleveland'
  },{
    createdAt: new Date(),name: 'That tall guy'
  }
];
expect(sportsBallPeople).toMatchSnapshot(<something goes here>);

解决方法

版本信息

正如问题中所指出的,财产匹配器是在Jest 23.0.0中引入的.请注意,截至今天(2018年8月5日),使用create-react-app引导的应用仍然是< 23. 宾语 以下是使用属性匹配器对单个对象的示例:

test('sportsBallPerson',() => {
  expect(sportsBallPeople[0]).toMatchSnapshot({
    createdAt: expect.any(Date)
  })
});

生成的快照:

exports[`sportsBallPerson 1`] = `
Object {
  "createdAt": Any<Date>,"name": "That one famous guy from Cleveland",}
`;

这将正确地将createdAt与任何日期和名称完全匹配为“那个来自克利夫兰的名人”.

ARRAY

要使用属性匹配器测试对象数组,请使用forEach循环遍历数组并快照单独测试每个对象:

test('sportsBallPeople',() => {
  sportsBallPeople.forEach((sportsBallPerson) => {
    expect(sportsBallPerson).toMatchSnapshot({
      createdAt: expect.any(Date)
    });
  });
});

生成的快照:

exports[`sportsBallPeople 1`] = `
Object {
  "createdAt": Any<Date>,}
`;

exports[`sportsBallPeople 2`] = `
Object {
  "createdAt": Any<Date>,"name": "That tall guy",}
`;

forEach确保按顺序测试对象,并且如上所述对每个对象进行适当的快照测试.

附加信息

有趣的是,使用属性匹配器直接测试数组不能正常工作并且具有意外的副作用.

我第一次尝试测试数组是为了创建以下测试:

test('sportsBallPeople as array',() => {
  expect(sportsBallPeople).toMatchSnapshot([
    { createdAt: expect.any(Date) },{ createdAt: expect.any(Date) }
  ]);
});

它生成了以下快照:

exports[`sportsBallPeople as array 1`] = `
Array [
  Object {
    "createdAt": Any<Date>,},Object {
    "createdAt": Any<Date>,]
`;

这是不正确的,因为缺少名称属性,但测试仍然通过(Jest v23.4.2).即使更改了名称并添加了其他属性,测试也会通过.

更有趣的是,一旦执行此测试,使用属性匹配器的任何后续测试都会受到不利影响.例如,将此测试放在测试循环对象之前将这些快照更改为以下内容:

exports[`sportsBallPeople 1`] = `
Object {
  "createdAt": Any<Date>,}
`;

总之,直接传递数组以与属性匹配器一起使用不起作用,并且可能会使用属性匹配器对其他快照测试产生负面影响.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


kindeditor4.x代码高亮功能默认使用的是prettify插件,prettify是Google提供的一款源代码语法高亮着色器,它提供一种简单的形式来着色HTML页面上的程序代码,实现方式如下: 首先在编辑器里面插入javascript代码: 确定后会在编辑器插入这样的代码: <pre
这一篇我将介绍如何让kindeditor4.x整合SyntaxHighlighter代码高亮,因为SyntaxHighlighter的应用非常广泛,所以将kindeditor默认的prettify替换为SyntaxHighlighter代码高亮插件 上一篇“让kindeditor显示高亮代码”中已经
js如何实现弹出form提交表单?(图文+视频)
js怎么获取复选框选中的值
js如何实现倒计时跳转页面
如何用js控制图片放大缩小
JS怎么获取当前时间戳
JS如何判断对象是否为数组
JS怎么获取图片当前宽高
JS对象如何转为json格式字符串
JS怎么获取图片原始宽高
怎么在click事件中调用多个js函数
js如何往数组中添加新元素
js如何拆分字符串
JS怎么对数组内元素进行求和
JS如何判断屏幕大小
js怎么解析json数据
js如何实时获取浏览器窗口大小
原生JS实现别踩白块小游戏(五)
原生JS实现别踩白块小游戏(一)