react: typescript jest && enzyme
Install Jest
1、install jest dependencies
jest @types/jest ts-jest -D
2、jest.config.js
module.exports = {
"roots": [
"<rootDir>/src"
],
"transform": {
"^.+\\.tsx?$": "ts-jest"
},
"testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
]
}
3、test jest
foo.ts
export const sum = (...args) => args.reduce((acc, val) => acc+val, 0)
foo.test.ts
import {sum } from "./foo";
test("basic", () => {expect(sum()).toBe(0)})
test("basic begin", () => {expect(sum(1,2,3)).toBe(6)})
Install Enzyme
1、install enzyme dependencies
enzyme @types/enzyme enzyme-to-json enzyme-adapter-react-16@types/enzyme-adapter-react-16
2、configue enzyme setup-test.ts
import { configure } from 'enzyme';
import * as Adapter from 'enzyme-adapter-react-16';
configure({ adapter: new Adapter() });
3、update jest.config.js
module.exports = {
"roots": [
"<rootDir>/src"
],
"setupFileAfterEnv": ["<rootDir>/setup-test.ts"]
"transform": {
"^.+\\.tsx?$": "ts-jest"
},
"testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
"snapshotSerializers": ["enzyme-to-json/serializer"],
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
]
}
4、update tsconfig.js
"exclude": **/*.test.ts""
react: typescript jest && enzyme的更多相关文章
- react typescript jest config (一)
1. initialize project create a folder project Now we'll turn this folder into an npm package. npm in ...
- react 单元测试 (jest+enzyme)
为什么要做单元测试 作为一个前端工程师,我是很想去谢单元测试的,因为每天的需求很多,还要去编写测试代码,感觉时间都不够用了. 不过最近开发了一个比较复杂的项目,让我感觉一旦项目大了.复杂了,而且还是多 ...
- 搭建 Jest+ Enzyme 测试环境
1.为什么要使用单元测试工具? 因为代码之间的相互调用关系,又希望测试过程单元相互独立,又能正常运行,这就需要我们对被测函数的依赖函数和环境进行mock,在测试数据输入.测试执行和测试结果检查方面存在 ...
- react + typescript 学习
react,前端三大框架之一,也是非常受开发者追捧的一门技术.而 typescript 是 javascript 的超集,主要特点是对 类型 的检查.二者的结合必然是趋势,不,已经是趋势了.react ...
- React + Typescript领域初学者的常见问题和技巧
React + Typescript领域初学者的常见问题和技巧 创建一个联合类型的常量 Key const NAME = { HOGE: "hoge", FUGA: "f ...
- 【每天学一点-04】使用脚手架搭建 React+TypeScript+umi.js+Antd 项目
一.使用脚手架搭建项目框架 1.首先使用脚手架搭建React项目(React+TypeScript+Umi.js) 在控制台输入命令:yarn create @umijs/umi-app 2.引入An ...
- Jest+Enzyme React js/typescript测试环境配置案例
本文案例github:https://github.com/axel10/react-jest-typescript-demo 配置jest的react测试环境时我们可以参考官方的配置教程: http ...
- jest enzyme unit test react
1. 测试类型 单元测试:指的是以原件的单元为单位,对软件进行测试.单元可以是一个函数,也可以是一个模块或一个组件,基本特征就是只要输入不变,必定返回同样的输出.一个软件越容易些单元测试,就表明它的模 ...
- 前端自动化测试 —— TDD环境配置(React+TypeScript)
欢迎讨论与指导:) 前言 TDD -- Test-Drive Development是测试驱动开发的意思,是敏捷开发中的一项核心实践和技术,也是一种测试方法论.TDD的原理是在开发功能代码之前,先编写 ...
随机推荐
- OpenCV-Python | 图像的基本操作 十
目标 学会: 访问像素值并修改它们 访问图像属性 设置感兴趣区域(ROI) 分割和合并图像 本节中的几乎所有操作都主要与Numpy相关,而不是与OpenCV相关.要使用OpenCV编写更好的优化代码, ...
- PHP7内核(八):深入理解字符串的实现
在前面大致预览了常用变量的结构之后,我们今天来仔细的剖析一下字符串的具体实现. 一.字符串的结构 struct _zend_string { zend_refcounted_h gc; /* 字符串类 ...
- PHP7内核(一):发展史
PHP1 1994年,一位名叫Rasmus lerdorf的兄台为了在网上展示自己的履历和网页流量的统计,用Perl开发了一套脚本,后来因与日俱增的需求无法得到满足,lerdorf便使用c语言进行了重 ...
- Java 注解 So Easy!!!
Java注解 Annotations, a form of metadata, provide data about a program that is not part of the program ...
- Linux/CentOS7搭建Anaconda运行环境
1. 安装miniconda 下载并安装miniconda到$HOME/.miniconda/ #从官网下载 wget -c "https://repo.anaconda.com/minic ...
- spring @EnableAspectJAutoProxy背后的那些事(spring AOP源码赏析)
在这个注解比较流行的年代里,当我们想要使用spring 的某些功能时只需要加上一行代码就可以了,比如: @EnableAspectJAutoProxy开启AOP, @EnableTransaction ...
- 火焰图--记一次cpu降温过程
引子 正值周末,娃儿6:30又如闹铃般准时来叫醒了我们.年前离开美菜,又回到了杭州.原本是想有更多时间陪伴娃儿,然而新的工作节奏与工作地点,让我们每天都是早上见面:这不,为了周末可以多玩一会儿,早早就 ...
- Docker容器入门-基本命令的使用
目前容器技术使用相当广泛 不会或者没有使用过容器感觉都不像是个搞技术的 所以,我也就docker相关内容做一个整理 只有不断的学习,才能保持自己的竞争力 什么是容器? 容器是一种轻量级.可移植.自包含 ...
- cento升级openssl依旧显示老版本
不久前拿到了一季度的服务器漏洞扫描报告,还是一些老生常谈的软件.按照报告上的漏洞一个个处理,开始升级openssl的时候一切都很顺利,上传源码包,解压,编译,安装,全部都没有报错.opessl --v ...
- 普通企业的规划类项目中,OptaPlanner更适合作为APS的规划优化引擎
在企业的规划.优化场景中,均需要开发规划类的项目,实现从从种可能方案中找出相对最优方案.如排班.生产计划(包括高层次的供应链优化,到细粒度的车间甚至机台作业指令).车辆调度等.因为这类场景需要解决的问 ...