我有一个组件在特定条件下在渲染时返回null:

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

  return <div>test</div>;
}

当isHidden在jest和Ezyme中为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()

Reactjs相关问答推荐

通过React/Esri应用程序中的SON配置时,小部件不会添加层

重新加载页面时始终出现汉堡菜单

使用useReducer时,props 未从父级传递给子或孙级

ReactJs;Reaction-Hook-Form:仅当 Select 了特定 Select 列表选项时才显示文本输入

透明MOV文件未出现在我的React网页中

Antd V5组件自定义主题

为什么我的react 简单计时器项目不起作用?

使用 MUI 菜单时添加新 html 元素时布局意外滚动跳转

我无法通过 useContext 显示值

FabricJS反序列化问题

是的验证:使用 useFieldArray 访问表单值

i18next中复数键的理解

CORS策略:对预检请求的响应未通过访问控制判断:没有Access-Control-Allow-Origin

React Router v6 路径中的符号

卸载 React 组件时未清除本地存储项目

使用 MuiCssBaseline 在所有 MUI v5 标签上设置边距 0

在 React 的父级中多次调用子级时从子级获取数据到父级

渲染的钩子比预期的少.这可能是由 React Hooks 中意外的提前返回语句引起的

如何跨微前端 React 应用管理状态管理?

ClearInterval 在 React 中的 useRef 没有按预期工作