首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

使用Jest测试原生TypeScript项目

通过官网的Getting started 我们可以在最下方找到 ts-jest 不难理解,我们需要配的其实就是jest加载到什么样类型的文件,使用什么预处理来处理文件。...如果是js文件我通过babel-jest处理,css则使用jest-css-modules。假如没有这些配置,那import了你的库,库里有引入了高特性的js文件,或者css文件就会编译报错。...关于rootDir 在进行技术选型的过程中,我看了最新版本的vue-cli里推荐用哪些框架进行测试,一个是jest,还一个是krama+mocha。...写完了测试,给我们的jest.config 多加一行配置,来生成我们的测试报告(Jest内置了 istanbul) javascript module.exports = { // ... collectCoverage...总结 至此,你应该对前端UI测试应该大致有一个宏观的了解。 本文没有过多得介绍Jest的用法或者语法,希望可以给不知道如何做测试的朋友们一点方向,自己去尝试找到适合自己项目的才是最好的。

2.8K60

使用jest进行单元测试

今年的不幸与坎坷使我有很长一段时间去思考人生,不想将就了,鲁棒健壮的程序,开发和测试应该是分得很开的,于是我选择jest去做单元测试这件事。...不扯犊子直接说吧,第一点,用数据、用茫茫多的测试用例去告诉使用者,你的程序是多么鲁棒健壮;第二点,把它作为一种素养去培养吧,当你按照一系列规范去做事,那么你做出来的东西,我想是有品质在的。...jest的相关配置 package.json中相关scripts 这里笔者罗列了常用的通用的一些关于jest的脚本,后面测试结果会陆续补充一些测试脚本,以上的脚本都编写在package.json文件下的.../test/caculator.test.js --watch": 单文件监视测试 "test:watchAll": "jest --watchAll": 监视所有文件改动,测试相应的测试。...大致基础类的脚本测试就总结到这里,接下来我们看下jest.config.js的相关配置。

3.5K60
您找到你想要的搜索结果了吗?
是的
没有找到

使用 Jest 进行前端单元测试

Jest 默认使用 Jasmine 语法,支持直接使用 Promise 和 async/await 进行异步测试,支持对 React 组件进行快照监控, 扩展和集成 Babel 等常用工具集也很方便。...目前 Jest 已经在 Facebook 开源的 React, React Native 等前端项目中被做为标配测试框架。 下面简单介绍一些 Jest 比较有用的功能和用法。...例如使用 jest.useFakeTimers() 把遇到的计时器挂起,在必要时再使用 jest.runOnlyPendingTimers() 执行掉已经挂起的计时器。...) jest.runOnlyPendingTimers() jest.useFakeTimers() jest.useRealTimers() React 支持 为了能够通过测试用例实现对 React...异步支持 如果有使用过 node-tap 之类的老测试框架,在遇到异步情况时候肯定感受过麻烦了。现代的测试框架对异步的支持都是必需的。

5.5K90

JavaScript 测试系列实战(一):使用 Jest 和 Enzyme 测试 React 组件

本篇教程是 JavaScript 测试系列实战 的第一篇教程,首先介绍了测试的类型,然后主要通过一个 React 项目教会你如何使用 Jest 编写第一个测试,然后使用 Enzyme 对 React 组件进行浅层渲染...,它接受一个表达式,然后后面可以调用 Matcher 来测试该表达式是否符合条件,例如这里我们就使用了最常用的 toBe Matcher;Jest 还提供了大量的 Matcher,可以帮助我们写出更简洁可读的断言语句...因此这里建议直接使用 npx jest 执行测试。 编写第一组测试 每个测试文件通常有多个测试用例。Jest 允许我们通过 describe 函数对测试用例进行分组,它创建了一个可以组合多个测试的块。...测试文件中使用它。...配置 jest-enzyme 你应该还记得,在刚才的测试代码中,我们还是使用Jest 自带的 Matcher(toEqual)。

2.9K10

Jest 进行 JavaScript 测试

测试分为三大类: 单元测试 集成测试 UI测试 在这个 Jest 教程中,我们将仅涵盖单元测试,但在文章的最后,你将找到更多用于其他类型测试的资源。 什么是Jest?...我们将使用 expect 和一个 Jest matcher 来检查这个函数在调用时返回的预期结果。...为了进行测试,我们将使用一个名为 filter 的原生 JavaScript 函数,它可以过滤掉数组中的元素。...Jest 具有内置代码覆盖率,你可以通过两种方式激活: 通过命令行传递标志“-coverage” 通过在 package.json 中配置 Jest使用 coverage 运行测试之前,请确保在 tests...Jest的HTML代码覆盖率报告 如果单击函数名称,你还会看到确切的未经测试的代码行: ? 单个文件的Jest代码覆盖率报告 很整洁不是吗?使用代码覆盖,你可以在有疑问时发现要测试的内容。

2.7K30

自动化测试 Jest使用总结基础篇

使用 jest 的原因 随着前端的发展,web的交互越来越复杂,自动化测试是非常有必要融入到开发的流程中,而目前界内普遍通用且比较火的就是有 facebook开发的 Jest 这套工具。...他可以创建测试用例,执行测试,自身还有驱动和mock,且用起来也是很方便,正如 jest 的官网这样描述 jestJest is a delightful JavaScript Testing Framework...同时, jest 也支持做不匹配的校验,也就是反向的校验。下面就是一些不同的匹配器。 简单类型的校验; 使用 tobe() 匹配器做简单类型的校验,校验结果是否正确。...jest 做回调操作测试需要注意,函数的回掉情况。...钩子函数的使用 钩子执行 再执行测试文件的时候,如果有需要对函数进行特殊处理的可以在执行前和执行后使用钩子函数,beforeEach and afterEach。

2.6K111

Jest实战:单元测试与服务测试

而最近刚到团队,被安排给 vemoJS 和 cloudbase-cli 写测试用例,并且要保证覆盖率! 这里主要以 vemojs 下的测试用例为主来讲解 Jest 要注意的地方。...以 index.js 中的 websocket 服务为代表的,模拟用户使用环境,测试 ws 是否正常 提供测试覆盖率 针对以上问题,解决思路总结如下: 函数功能测试:断言匹配功能 请求 API:mock...(内置无头浏览器)来模拟用户使用,监听数据变动 jest 自带覆盖率统计工具 测试过程 针对上面的步骤以及核心的 jest 配置,分别做讲解。...在做调研的时候发现,jest 的下载量和更新记录远远高于 supertest,而且更纯粹。为什么这么说呢?它提供一种测试的组织形式,其它可以借助第三方库和工具实现。...下的 puppeteer 由于 windows 下 puppeteer 无法通过 npm 下载安装(就是很麻烦),所以把 puppeteer 的加载代码进一步处理,同时在失败的时候给出友好的提示,引导使用者切换测试平台

3.3K10

使用Jest测试包含setTimeout调用的函数踩坑记录

前两天给一个包含setTimeout调用的函数写单元测试,在使用fake timer的时候遇到了问题,记录一下。...在启用fake timer的时候,setTimeout、setInterval都会使用Jest提供的假实现,他们不会真正阻塞住测试用例。...(2); }); 我们做了以下改动: 使用jest.runAllTicks代替await delay(0)。...根据Jest的官方文档,调用这个函数后,所有队列中的“微任务”都会被立刻执行,这里的目的就是保证catch回调能被立刻调用; 使用jest.advanceTimersByTime(6000)代替await...注意我们此时使用的是fake timer,因此是无法使用await delay(0)这个方案的,因此这会导致我们的测试用例在等待setTimeout被回调,而fake timer的setTimeout又在等待

6.6K60

React单元测试Jest + Enzyme(一)

Jest是Facebook开发的一个测试框架,它集成了测试执行器、断言库、spy、mock、snapshot和测试覆盖率报告等功能。...React项目本身也是使用Jest进行单测的,因此它们俩的契合度相当高。 Enzyme是由airbnb开发的React单测工具。...由于我的项目使用webpack作为打包工具,于是我在package.json里面做了以下的配置: "jest": { "moduleFileExtensions": [ "js",...我们来回顾下我们都做了些什么: 安装Jest并让其支持ES6语法 新建对应的单测文件夹并新建一个单测文件 针对项目的webpack做相应的Jest配置 配置运行测试脚本 万事开头难,你已经踏出万里长征的第一步了...在下一篇文章中,我将会详细介绍如何使用Jest来mock方法和数据,敬请期待。

1.4K20
领券