• Enzyme 来自 airbnb 公司,是一个用于 React 的 JavaScript 测试工具,方便你判断、操纵和历遍 React Components 输出。Enzyme 的 API 通过模仿 jQuery 的 API ,使得 DOM 操作和历遍很灵活、直观。Enzyme 兼容所有的主要测试运行器和判断库。

  • jest.spyOn : 当需要测试某些必须被完整执行的方法时,常常需要使用jest.spyOn()

    • 1) 如果是箭头函数的定义

      // react 组件中的一部分代码
      test = () => {}

      测试用例中mock此函数 方法如下

      const wrapper = mount(<Component />);
      const spyTest = jest.spyOn(wrapper.instance(), 'test'); // 在mount组件之后
      // mock 完成后可以被调用
      spyTest();
      1. 如果是bind 绑定的函数
      test() {}

      测试用例中mock此函数 方法如下

       const spyTest = jest.spyOn(Component.prototype, 'test'); //在mount组件之前
      mount(<Component />)
      // mock 完成后可以被调用
      spyTest();
  • antd form 设计到必填项时候mock方式如下

    wrapper.find('input#id').simulate('change', {target: {value: 'test'}});

react 项目 测试的更多相关文章

  1. 创建react项目的几种方法

    前言: 构建React项目的几种方式: 构建:create-react-app 快速脚手架 构建:generator-react-webpack 构建:webpack一步一步构建 1)构建:creat ...

  2. 创建react项目

    npm搭建React项目 React官网提供最简便的方法是使用create-react-app npx create-react-app my-app cd my-app npm start 也可以自 ...

  3. 使用 webpack 搭建 React 项目

    简评:相信很多开发者在入门 react 的时候都是使用 create-react-app 或 react-slingshot 这些脚手架来快速创建应用,当有特殊需求,需要修改 eject 出来的 we ...

  4. 简述--构建React项目的几种方式

    前言: 构建React项目的几种方式: 构建:create-react-app 快速脚手架 构建:generator-react-webpack 构建:webpack一步一步构建 1)构建:creat ...

  5. 从零开始搭建一个react项目

    Nav logo 120 发现 关注 消息 4 搜索 从零开始搭建一个react项目 96 瘦人假噜噜 2017.04.23 23:29* 字数 6330 阅读 32892评论 31喜欢 36 项目地 ...

  6. 优雅的在React项目中使用Redux

    概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与React没有任何关系,其他UI框架也可以使用Redux react-redux React插件,作用:方便在 ...

  7. DvaJS构建配置React项目与使用

    DvaJS构建配置React项目与使用 一,介绍与需求分析 1.1,介绍 dva 首先是一个基于redux 和redux-saga的数据流方案,然后为了简化开发体验,dva 还额外内置了react-r ...

  8. React项目使用Redux

    ⒈创建React项目 初始化一个React项目(TypeScript环境) ⒉React集成React-Router React项目使用React-Router ⒊React集成Redux Redux ...

  9. react项目使用antd

    在开始实践之前要确保搭建React单页面开发环境,如果还没有搭建好开发环境的朋友请移步到如何搭建React单页面开发环境. 首先在命令行模式下创建一个React项目(项目名使用小写字母命名):(win ...

随机推荐

  1. Ops: 高效组合命令集合

    简介 本篇博客收集一些常用的复杂命令组合,这些命令组合能够高效的定位.分析.处理一些问题,希望对需要的小伙伴有所帮助. 命令集合 批量备份文件 将名称为config.xml的文件查找出来,并在原目录备 ...

  2. 《C# 爬虫 破境之道》:第二境 爬虫应用 — 第四节:小说网站采集

    之前的章节,我们陆续的介绍了使用C#制作爬虫的基础知识,而且现在也应该比较了解如何制作一只简单的Web爬虫了. 本节,我们来做一个完整的爬虫系统,将之前的零散的东西串联起来,可以作为一个爬虫项目运作流 ...

  3. 微信小程序中的图表构建

    第一 html中的代码 <view class="container"> <canvas canvas-id="lineCanvas" bin ...

  4. Spring Cloud(六):服务网关zuul

    通过前面几篇文章的介绍,Spring Cloud微服务架构可通过Eureka实现服务注册与发现,通过Ribbon或Feign来实现服务间的负载均衡调用,通过Hystrix来为服务调用提供服务降级.熔断 ...

  5. 申请Let’s Encrypt通配符HTTPS证书(certbot ACME v2版)

    1.获取certbot-auto# 下载 # 下载 wget https://dl.eff.org/certbot-auto # 设为可执行权限 chmod a+x certbot-auto 2.开始 ...

  6. node基础 day1

    js为什么能在浏览器中运行 浏览器内部存在一个js解析器,解析ECMAscript 把引擎从浏览器中抽离出来,不再依赖浏览器,作为一个软件安装在电脑上,在命令行里面, 这个软件就是node node ...

  7. typescript点滴

    typescript比较优质的学习资料都放在前端资料汇总 这些都是为了自己更好的理解和记忆而不是为了学术性的博客. 这里讲的是一些容易忘记的.混淆的. #### typescript的模块的导入3种方 ...

  8. Blend 修改TreeViewItem样式

    Blend 修改TreeViewItem样式 1.用Blend for Visual Studio 2019 新建Wpf项目,拖动一个TreeView控件到Grid上 <Grid> < ...

  9. C语言:字符串拷贝(截取)、查找

    C语言:字符串拷贝(截取).查找 很惭愧,学了这么久别的语言,一直没有好好学C和C++,所以现在开始认真C/C++的一些特性和比较,这里记录下C语言拷贝和截取的一些方式,由于系统库带的函数不方便,所以 ...

  10. 异常 lock buffer failed for format 0x23

    02-11 21:21:45.669625 14804 14815 W Monkey : // java.lang.RuntimeException: lock buffer failed for f ...