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的原理是在开发功能代码之前,先编写 ...
随机推荐
- ES6语法:函数新特性(一)
ES6 函数 引言: 函数在任何语言中偶读很重要,java里面的函数通常叫做方法,其实是一个东西,使用函数可以简化更多的代码,代码结构看着更加清晰.今天我们来学学ES6语法中,函数有什么变化. 虽然现 ...
- Inception系列理解
博客:博客园 | CSDN | blog 写在前面 Inception 家族成员:Inception-V1(GoogLeNet).BN-Inception.Inception-V2.Inception ...
- JVM中内存分配策略及堆和栈的比较
最近愈发对JVM底层的运行 原理产生了兴趣,遂查阅相关资料以备忘. 内存分配策略 根据编译原理的观点,程序运行时的内存分配,有三种策略,分别为静态的.堆式的.栈式的. 静态存储分配指的是在编译时就能确 ...
- Cplex教育版申请
任何人:直接在公众号"毒书 彼记" ,“资源下载” 板块下载: 如果你的学校没有购买cplex软件没那么,你就不可以下载教育版的cplex软件,如过下载免费板,它的功能会有一些限制 ...
- python 开发工具简介
一.python 开发工具简介 1.IDLE IDLE是开发python程序的基本IDE(集成开发环境),具备基本的IDE的功能,是非商业Python开发的不错的选择.当安装好python以后,IDL ...
- C#中的字符串处理
C#中的字符串处理 是由多个单个字符组成的.字符串的关键字是string,而我们单个字符char型.也就是一个字符串可以分为很多个char的字符.注意 同时,我们在开发项目或者学习时.更多的操作不是数 ...
- Sql练习201908200916
表结构: 一条sql修改多条数据(Sql server),oracle,mysql请自行尝试: ; go 完成.
- 结合异步模型,再次总结Netty多线程编码最佳实践
更多技术分享可关注我 前言 本文重点总结Netty多线程的一些编码最佳实践和注意事项,并且顺便对Netty的线程调度模型,和异步模型做了一个汇总.原文:结合异步模型,再次总结Netty多线程编码最 ...
- mysql 5.7.18安装教程
安装之前 确认是否已安装旧版mysql.如有,则卸载(注意需要的数据备份). /etc/init.d/mysqld stop yum remove mysql mysql-* rm -rf /var/ ...
- I - 动物狂想曲 HDU - 6252(差分约束)
I - 动物狂想曲 HDU - 6252 雷格西桑和路易桑是好朋友,在同一家公司工作.他们总是一起乘地铁去上班.他们的路线上有N个地铁站,编号从1到N.1站是他们的家,N站是公司. 有一天,雷格西桑起 ...