首页
学习
活动
专区
圈层
工具
发布

使用Jest测试原生TypeScript项目

webpack.config 自动编译ts+css tsconfig.config ts的配置文件 tslint.json tslint的配置文件 jest.config 配置jest .babelrc...通过官网的Getting started 我们可以在最下方找到 ts-jest 不难理解,我们需要配的其实就是jest加载到什么样类型的文件,使用什么预处理来处理文件。...transform 就是专门用来匹配各种文件后缀,然后进行对应的预处理,你可以理解为webpack里的loader 我在TS中引入了.css文件咋办?...同上 既然有transform,那我们任何文件都可以通过transform进行预处理了。 如果是js文件我通过babel-jest处理,css则使用jest-css-modules。...我选择了jest,jest本身是fb出的,对于react非常友好。本身也做了许多环境上的封装切换jsdom环境或者node环境非常方便。我最后选择了这个。

3.5K60

使用jest进行单元测试

不扯犊子直接说吧,第一点,用数据、用茫茫多的测试用例去告诉使用者,你的程序是多么鲁棒健壮;第二点,把它作为一种素养去培养吧,当你按照一系列规范去做事,那么你做出来的东西,我想是有品质在的。...jest的安装 在确保你的电脑装有node环境的情况下,我们通过mkdir jest-study && npm init -y来初始化项目,然后我们通过cd jest-study进入到这个目录。...to_contain.test.js test('#toContain', () => { expect([1, 2, 3, 4]).toContain(1) expect([[1, 2], [...defined').toBeDefined() expect(true).toBeTruthy() expect(false).toBeFalsy() }) ToThrow(expected) 这里是处理相关异常的....exec()).toBe(1) expect(caculator.clear().add(1, 2, 3).exec()).toBe(6) caculator.clear() })

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

    前端自动化测试实践03—jest异步处理&mock

    前端自动化测试实践03—jest异步处理&mock TOC Write By CS逍遥剑仙 我的主页: www.csxiaoyao.com GitHub: github.com/csxiaoyaojianxian.../async'; ... 【1】callback 中处理,需要手动结束 done,否则可能走不到 callback test('fetchData1 返回结果为 { success: true }',.../mock'); 4. mock - function 模拟函数调用 对于单元测试,无需关心外部传入的函数的实现,使用 jest.fn 生成一个 mock 函数,可以捕获函数的调用和返回结果,以及this.../mock' test('测试 callback', () => { // 【1】使用 jest 生成一个 mock 函数 func1,用来捕获函数调用 const func1 = jest.fn...时间,对于本案例 【1】定时器立即执行 jest.runAllTimers() // 执行2次 【2】只运行队列中的timer jest.runOnlyPendingTimers() // 执行1次 【

    6K85

    原生小程序之工程化探索

    前言 习惯用webpack对项目开发工程化,接触小程序后,稍微有点不适应,市面上有taro等优秀的小程序框架可以使用,由于负责项目历史背景,而无法大规模改造,因此只能做一些简单的工程化方案 规范代码...1.安装 jest、@babel/core、@babel/preset-env、babel-jest 2.配置package.json "scripts": { "test": "jest ....(sum(1, 2)).toBe(3); }); }); 注入环境变量 方案一:rollup 1.安装 rollup、@rollup/plugin-replace 2.配置 package.json...正在设置环境变量....`); }); ws.on('finish', function () { console.log(`设置环境变量成功: ${CUR_ENV || '线上环境'}`); process.exit...(); }); ws.on('error', function () { process.exit(1); }); ws.write(content); ws.end(); 4.npm run

    1.1K10

    JavaScript 测试教程 part 1:用 Jest 进行单元测试

    本文是 JavaScript 测试教程 系列中的第1部分 1. JavaScript测试教程-part 1:用 Jest 进行单元测试 2....首先,我将介绍单元测试的基础知识,即测试应用程序的每个部分并检查它们是否适合使用。为此我们将使用 Facebook 开发的测试框架 Jest。它已经准备就绪,并具有进行测试所需的功能。...package.json 1"scripts": { 2 "test": "jest" 3} 为了简单起见,我在这里将 Jest 与简单的纯 Node.js 模块一起使用(不包括 webpack)。...稍后我们将学习如何在 React 中使用 Jest 首先,让我们创建一些可以测试的简单函数。...使用 Jest,你可以使用 describe 函数对它们进行分组。它创建了一个可以合并多个测试的块。

    3.6K20

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

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

    3.5K111

    create-react-app初探

    (1); } process.exit(result.status); break; } default: console.log('Unknown script...process.env.NODE_ENV = 'development'; 因为是开发模式,所以这里把babel,node的环境变量都设置为development,然后是全局错误的捕获,这些都是一个cli脚本通常的处理方式...checkRequiredFiles([paths.appHtml, paths.appIndexJs])) { process.exit(1); } 下面这部分是涉及C9云部署时的环境变量检查,不在我们考究范围...chrome version", "last 1 firefox version", "last 1 safari version" ] } 检查完devServer端口后,进入我们核心逻辑执行...其实是因为CRA把复杂的webpack config配置封装起来了,把babel plugins预设好了,把开发时会常用到的一个环境检查,polyfill兼容都给开发者做了,所以使用起来会比我们直接使用

    1.6K10

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

    在启用fake timer的时候,setTimeout、setInterval都会使用Jest提供的假实现,他们不会真正阻塞住测试用例。...(); expect(job.run).toHaveBeenCalledTimes(1); jest.advanceTimersByTime(6000); expect(job.run).toHaveBeenCalledTimes...(2); }); 我们做了以下改动: 使用jest.runAllTicks代替await delay(0)。...根据Jest的官方文档,调用这个函数后,所有队列中的“微任务”都会被立刻执行,这里的目的就是保证catch回调能被立刻调用; 使用jest.advanceTimersByTime(6000)代替await...咳咳……也就是说,Promise所使用的微任务队列又是另外一个微任务队列,并且不归Jest控制! 因此,问题也明确了:runAllTicks什么作用也没有发挥,我们回到了最初遇到的问题。

    8.2K60

    create-react-app初探

    (1); } process.exit(result.status); break; } default: console.log('Unknown script "' +...process.env.NODE_ENV = 'development'; 因为是开发模式,所以这里把babel,node的环境变量都设置为 development,然后是全局错误的捕获,这些都是一个cli脚本通常的处理方式...checkRequiredFiles([paths.appHtml, paths.appIndexJs])) { process.exit(1);} 下面这部分是涉及C9云部署时的环境变量检查,不在我们考究范围...chrome version", "last 1 firefox version", "last 1 safari version" ]} 检查完devServer端口后,进入我们核心逻辑执行...其实是因为CRA把复杂的webpack config配置封装起来了,把babel plugins预设好了,把开发时会常用到的一个环境检查,polyfill兼容都给开发者做了,所以使用起来会比我们直接使用

    1K20

    java使用jest连接操作Elasticsearch2.2.0中的索引

    前言 在了解jest框架前,楼主一直尝试用官方的Elasticsearch java api连接es服务的,可是,不知何故,一直报如下的异常信息,谷歌了很久,都说是jvm版本不一致导致的问题,可我是本地测试的...).get("content")); } client.close(); 如果有人知道怎么回事,告诉一下楼主吧,让楼主坑的明白,感激不尽了,我的es版本是2.2.0 进入正题 了解jest...jest是一个基于 HTTP Rest 的连接es服务的api工具集,功能强大,能够使用es java api的查询语句,项目是开源的,github地址:https://github.com/searchbox-io.../Jest 我的测试用例 分词器:ik,分词器地址:https://github.com/medcl/elasticsearch-analysis-ik ,es的很多功能都是基于插件提供的,es...--jest依赖--> io.searchbox jest <version

    74620

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

    本篇教程是 JavaScript 测试系列实战 的第一篇教程,首先介绍了测试的类型,然后主要通过一个 React 项目教会你如何使用 Jest 编写第一个测试,然后使用 Enzyme 对 React 组件进行浅层渲染...因此这里建议直接使用 npx jest 执行测试。 编写第一组测试 每个测试文件通常有多个测试用例。Jest 允许我们通过 describe 函数对测试用例进行分组,它创建了一个可以组合多个测试的块。...测试文件中使用它。...来判断渲染后的 App 组件是否包含 1>Hello world!...配置 jest-enzyme 你应该还记得,在刚才的测试代码中,我们还是使用了 Jest 自带的 Matcher(toEqual)。

    4.1K10

    使用 Cloudera 流处理进行欺诈检测-Part 1

    我们讨论了如何使用带有 Apache Kafka 和 Apache Flink 的Cloudera 流处理(CSP) 来实时和大规模地处理这些数据。...在这个用例中,我们创建了一个相对简单的 NiFi 流程,它实现了上述步骤 1 到 5 的所有操作,我们将在下面更详细地描述这些操作。 在我们的用例中,我们正在处理来自外部代理的金融交易数据。...对于这个例子,我们可以简单地将 ListenUDP 处理器拖放到 NiFi 画布中,并使用所需的端口对其进行配置。可以参数化处理器的配置以使流可重用。...为此,我们使用 NiFi 的 LookupRecord,它允许针对 REST 服务进行查找。CML 模型的响应包含一个欺诈分数,由一个介于 0 和 1 之间的实数表示。...流执行可以自动向上和向下扩展,以确保有适量的资源来处理当前正在处理的数据量。这避免了资源匮乏,并通过在不再使用时重新分配不必要的资源来节省成本。

    2.1K20

    工作笔记——使用Jest时遇到的一些问题

    嗯..你的报错信息应该可能大概也许是下面这个样子:   这是我们在使用Jest时遇到的第一个问题,解决的方式很简单,在test目录下的jest.config.js的配置中添加一项:   然后,再试一下...在测试环境下,我们使用jest也需要引入开发环境下的各种插件,形成一个独立的环境体系,当然,我们也可以通过其它手段来造假数据。这个我们后面再说,既然找不到BMap,那么怎么办呢?   ...比如:   就像这样,实际上就是为jest的全局环境挂载上相应的对象。但是,个人觉得这种方法有点取巧。并不是特别的好的处理方式,比如说我用了几十个方法难道要写几十个假的构造函数么?...这种处理方式还是比较简单易懂的。   ...实际上在使用过程中,主要有两类问题,一个是环境配置的问题,要记住在写jest测试用例的时候,需要引入各依赖的文件,就像在main.js中那样。

    1.9K20
    领券