当前位置: 首页 > 面试题库 >

Jest Enzyme测试一个在渲染方法中返回null的React组件

宗项禹
2023-03-14
问题内容

我有一个在某些情况下在渲染中返回null的组件:

render() {
  if (this.props.isHidden) {
      return null;
  }

  return <div>test</div>;
}

我想用笑话和酶检查isHidden为true时组件是否为null:

describe('myComp', () => {
    it('should not render if isHidden is true', () => {
        const comp = shallow(<myComp isHidden={true} />);
        expect(comp.children().length).toBe(0);
    });
});

这可行,但是有没有更惯用的方式编写此测试?测试呈现为null的组件是很常见的情况。


问题答案:
   expect(comp.type()).toEqual(null)

而已!

要么: expect(comp.get(0)).toBeFalsy()



 类似资料:
  • 问题内容: 我有一个组件,该组件获取作为道具的项目集合,并将其作为呈现为父组件子项的组件集合。我们使用以字节数组形式存储的图像。在函数中,我从项目中获取图像ID,并异步调用,以获取图像的字节数组。我的问题是我不能将诺言传播到React中,因为它不是设计来处理渲染中的诺言的(无论如何我还是不能说的)。我来自背景,所以我猜我在寻找类似关键字的内容来重新同步分支代码。 该函数看起来像这样(简化): 该方

  • 问题内容: 我创建了一个简单的React组件,其中显示了另一个React组件。但是它不会在浏览器中呈现: 我期望出现在屏幕上,但是什么也没有出现,当我检查元素时,我只能看到 请问任何一点我们可能有什么问题。 问题答案: JSX希望组件标签大写。否则,它将仅使用提供的标签创建一个DOM元素。参见HTML标签与React组件。 编译为同时编译成。 只要重命名为,您就很好。

  • 问题内容: 我正在尝试使用setState()方法将容器中的React状态变量重置为默认值。但是出现以下错误 最后:超出最大调用堆栈大小。 我的代码如下: 当Redux状态的变量为true时,我正在调用resetMsg()。 我在其中调用resetMsg的代码(resetMessages的值最初为false,当它为true时,我需要重置React状态): 问题答案: 您可能要研究功能。根据官方文档

  • 问题内容: 我正在遵循此教程:http : //reactkungfu.com/2015/07/approaches-to-testing- react-components-an-overview/ 尝试学习“浅渲染”的工作原理。 我有一个更高阶的组件: 和一个组件: 和一个测试: 该变量保存 在本教程中,测试如下: 就我而言,如果我登录,它是: 所以我像这样更改了测试: 现在它给了我这个错误:

  • 我有一个spring boot应用程序,它有一个endpoint测试配置类和一个单元测试来测试我的http客户端。我正在尝试从应用程序中获取服务器地址和端口。位于我的src/测试中的属性。(所有类都在我的src/测试中。) 这是我的配置类代码: 我对我的中的值进行了注释。属性,然后创建一个方法,我用bean实例化该方法以返回我的服务器地址字符串。 然后,我在HttpClientTest类中使用该字

  • 问题内容: 我在尝试使用数据数组呈现元素时遇到问题。在的下面的代码中,可以正常工作,但列表项未出现。 我究竟做错了什么?请随时指出并非最佳做法的任何内容。 问题答案: GoshaArinich是正确的,您应该返回您的元素。但是,在这种情况下,您应该在浏览器控制台中收到讨厌的红色警告 数组或迭代器中的每个子代都应具有唯一的“键”道具。 因此,您需要在列表中添加“键”: 或使用es6 箭头功能放下并做