• 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. 题解【[HNOI2010]弹飞绵羊】

    \[ \texttt{Description} \] 有 \(n\) 个弹力装置排成一排,第 \(i\) 个弹力装置的弹力系数是 \(k_i\) ,绵羊到第 \(i\) 个装置时,会被弹到第 \(i+ ...

  2. Kafka系列3:深入理解Kafka消费者

    上面两篇聊了Kafka概况和Kafka生产者,包含了Kafka的基本概念.设计原理.设计核心以及生产者的核心原理.本篇单独聊聊Kafka的消费者,包括如下内容: 消费者和消费者组 如何创建消费者 如何 ...

  3. 移植freertos到stm32 f103 的基本流程和总结

    为什么要在stm32 f103上面移植freertos   stm32 f103 以他的全面的文档,亲民的价格,强大的功能.成为无数微设备的方案首选.在市场上有极大的使用量.市场占有率也是非常的高.f ...

  4. 01-Maven

    今日知识 1. Maven 2. 依赖管理 2. 项目构建 Maven 1. Maven是基于项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的软件项目管理工具. 2. Ma ...

  5. STM32F4相关

    常用术语 AHB与APB的地位相当于PC中的南北桥,是两道独立的片内总线.AHB:advanced high-performance bus:APB: advanced peripherals bus

  6. Github搜索技巧

    按仓库名称.说明或自述文件内容搜索 通过 in 限定符,您可以将搜索限制为仓库名称.仓库说明.自述文件内容或这些的任意组合. 如果省略此限定符,则只搜索仓库名称和说明. 限定符 示例 in:name ...

  7. clr via c# 程序集加载和反射(2)

    查看,clr via c# 程序集加载和反射(1) 8,发现类型的成员: 字段,构造器,方法,属性,事件,嵌套类型都可以作为类型成员.其包含在抽象类MemberInfo中,封装了所有类型都有的一组属性 ...

  8. yum的repo的配置文件说明

    [base]:容器名称,一定要放在[]中.name:容器说明,可以自己随便写.mirrorlist:镜像站点,这个可以注释掉.baseurl:我们的 yum 源服务器的地址.默认是 CentOS 官方 ...

  9. 类加载机制与JVM调优命令

    一.类加载过程 类加载:类加载器将.class字节码文件加载进Java虚拟机的内存中. 加载:在硬盘上查找并通过IO读入字节码文件 连接:执行校验.准备.解析(可选)步骤 校验:校验字节码文件的正确性 ...

  10. VUE中使用XLSX实现导出excel表格

    简介 项目中经常会用导出数据的场景,这里介绍 VUE 中如何使用插件 xlsx 导出数据 安装 ## 1.使用 npm 或 yarn 安装依赖(三个依赖) npm install -S file-sa ...