”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 使用 Jest 测试您的 JavaScript 应用程序

使用 Jest 测试您的 JavaScript 应用程序

发布于2024-09-01
浏览:846

Test Your JavaScript App With Jest

测试是软件开发的关键部分,可确保您的应用程序按预期运行。 Jest 是 JavaScript 生态系统中最流行的测试框架之一。 Jest 由 Facebook 开发,以其简单易用而闻名,使其成为初学者和经验丰富的开发人员的绝佳选择。

开始使用 Jest

在我们深入示例之前,让我们在您的项目中设置 Jest。如果尚未安装,可以使用 npm 安装它:

npm install --save-dev jest

接下来,将测试脚本添加到您的 package.json 中:

"scripts": {
  "test": "jest"
}

现在您已经准备好编写一些测试了!
让我们创建一个简单的函数来测试。创建一个名为 math.js 的文件:

// math.js
function add(a, b) {
  return a   b;
}
module.exports = add;

现在,让我们为这个函数编写一个测试。创建一个名为 math.test.js 的文件:

// math.test.js
const add = require('./math');

test('adds 1   2 to equal 3', () => {
  expect(add(1, 2)).toBe(3);
});

在这个测试中,我们使用测试函数来定义测试用例。 Expect函数用于断言add(1, 2)的结果等于3。

运行测试

您可以通过在终端中执行以下命令来运行测试:

npm test

您应该看到表明您的测试已通过的输出。

测试异步代码

Jest 还支持测试异步代码。让我们修改 math.js 文件以包含异步函数:

// math.js
function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('peanut butter');
    }, 1000);
  });
}

module.exports = { add, fetchData };

现在,让我们为 fetchData 编写一个测试:

// math.test.js
const { add, fetchData } = require('./math');

test('adds 1   2 to equal 3', () => {
  expect(add(1, 2)).toBe(3);
});

test('fetches data', async () => {
  const data = await fetchData();
  expect(data).toBe('peanut butter');
});

在此测试中,我们将测试函数标记为异步并使用await 等待promise 解析。

模拟函数

Jest 提供了强大的模拟功能。假设您有一个进行 API 调用的函数。您可以模拟此函数以在测试期间控制其行为。
这是一个例子:

// api.js
const axios = require('axios');

async function getUser() {
  const response = await axios.get('https://api.example.com/user');
  return response.data;
}

module.exports = getUser;

您可以在测试中模拟 axios:

// api.test.js
const axios = require('axios');
const getUser = require('./api');

jest.mock('axios');

test('fetches user data', async () => {
  const user = { name: 'John Doe' };
  axios.get.mockResolvedValue({ data: user });

  const result = await getUser();
  expect(result).toEqual(user);
});

在此测试中,我们模拟 axios.get 方法以返回预定义的响应,从而允许我们在不进行实际 API 调用的情况下测试 getUser。

Jest 是一个功能强大的测试框架,可以轻松为 JavaScript 应用程序编写和运行测试。凭借其简单的语法、对异步代码的支持以及内置的模拟功能,Jest 可以帮助您确保代码的可靠性和可维护性。立即开始将 Jest 集成到您的项目中,享受自动化测试的好处。

版本声明 本文转载于:https://dev.to/jospin6/test-your-javascript-app-with-jest-314c?1如有侵犯,请联系[email protected]删除
最新教程 更多>
  • PHP未来:适应与创新
    PHP未来:适应与创新
    PHP的未来将通过适应新技术趋势和引入创新特性来实现:1)适应云计算、容器化和微服务架构,支持Docker和Kubernetes;2)引入JIT编译器和枚举类型,提升性能和数据处理效率;3)持续优化性能和推广最佳实践。 引言在编程世界中,PHP一直是网页开发的中流砥柱。作为一个从1994年就开始发展...
    编程 发布于2025-05-14
  • 左连接为何在右表WHERE子句过滤时像内连接?
    左连接为何在右表WHERE子句过滤时像内连接?
    左JOIN CONUNDRUM:WITCHING小时在数据库Wizard的领域中变成内在的加入很有趣,当将c.foobar条件放置在上面的Where子句中时,据说左联接似乎会转换为内部连接。仅当满足A.Foo和C.Foobar标准时,才会返回结果。为什么要变形?关键在于其中的子句。当左联接的右侧值...
    编程 发布于2025-05-14
  • 如何解决由于Android的内容安全策略而拒绝加载脚本... \”错误?
    如何解决由于Android的内容安全策略而拒绝加载脚本... \”错误?
    Unveiling the Mystery: Content Security Policy Directive ErrorsEncountering the enigmatic error "Refused to load the script..." when deployi...
    编程 发布于2025-05-14
  • 找到最大计数时,如何解决mySQL中的“组函数\”错误的“无效使用”?
    找到最大计数时,如何解决mySQL中的“组函数\”错误的“无效使用”?
    如何在mySQL中使用mySql 检索最大计数,您可能会遇到一个问题,您可能会在尝试使用以下命令:理解错误正确找到由名称列分组的值的最大计数,请使用以下修改后的查询: 计数(*)为c 来自EMP1 按名称组 c desc订购 限制1 查询说明 select语句提取名称列和每个名称...
    编程 发布于2025-05-14
  • Python中何时用"try"而非"if"检测变量值?
    Python中何时用"try"而非"if"检测变量值?
    使用“ try“ vs.” if”来测试python 在python中的变量值,在某些情况下,您可能需要在处理之前检查变量是否具有值。在使用“如果”或“ try”构建体之间决定。“ if” constructs 结果= function() 如果结果: 对于结果: #处理项...
    编程 发布于2025-05-14
  • Python中嵌套函数与闭包的区别是什么
    Python中嵌套函数与闭包的区别是什么
    嵌套函数与python 在python中的嵌套函数不被考虑闭合,因为它们不符合以下要求:不访问局部范围scliables to incling scliables在封装范围外执行范围的局部范围。 make_printer(msg): DEF打印机(): 打印(味精) ...
    编程 发布于2025-05-14
  • 为什么我的CSS背景图像出现?
    为什么我的CSS背景图像出现?
    故障排除:CSS背景图像未出现 ,您的背景图像尽管遵循教程说明,但您的背景图像仍未加载。图像和样式表位于相同的目录中,但背景仍然是空白的白色帆布。而不是不弃用的,您已经使用了CSS样式: bockent {背景:封闭图像文件名:背景图:url(nickcage.jpg); 如果您的html,css...
    编程 发布于2025-05-14
  • Android如何向PHP服务器发送POST数据?
    Android如何向PHP服务器发送POST数据?
    在android apache httpclient(已弃用) httpclient httpclient = new defaulthttpclient(); httppost httppost = new httppost(“ http://www.yoursite.com/script.p...
    编程 发布于2025-05-14
  • 大批
    大批
    [2 数组是对象,因此它们在JS中也具有方法。 切片(开始):在新数组中提取部分数组,而无需突变原始数组。 令ARR = ['a','b','c','d','e']; // USECASE:提取直到索引作...
    编程 发布于2025-05-14
  • 人脸检测失败原因及解决方案:Error -215
    人脸检测失败原因及解决方案:Error -215
    错误处理:解决“ error:( - 215)!empty()in Function openCv in Function MultSiscale中的“检测”中的错误:在功能检测中。”当Face Cascade分类器(即面部检测至关重要的组件)未正确加载时,通常会出现此错误。要解决此问题,必须...
    编程 发布于2025-05-14
  • HTML格式标签
    HTML格式标签
    HTML 格式化元素 **HTML Formatting is a process of formatting text for better look and feel. HTML provides us ability to format text without us...
    编程 发布于2025-05-14
  • 在细胞编辑后,如何维护自定义的JTable细胞渲染?
    在细胞编辑后,如何维护自定义的JTable细胞渲染?
    在JTable中维护jtable单元格渲染后,在JTable中,在JTable中实现自定义单元格渲染和编辑功能可以增强用户体验。但是,至关重要的是要确保即使在编辑操作后也保留所需的格式。在设置用于格式化“价格”列的“价格”列,用户遇到的数字格式丢失的“价格”列的“价格”之后,问题在设置自定义单元格...
    编程 发布于2025-05-14
  • 对象拟合:IE和Edge中的封面失败,如何修复?
    对象拟合:IE和Edge中的封面失败,如何修复?
    To resolve this issue, we employ a clever CSS solution that solves the problem:position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%)...
    编程 发布于2025-05-14
  • C++20 Consteval函数中模板参数能否依赖于函数参数?
    C++20 Consteval函数中模板参数能否依赖于函数参数?
    [ consteval函数和模板参数依赖于函数参数在C 17中,模板参数不能依赖一个函数参数,因为编译器仍然需要对非contexexpr futcoriations contim at contexpr function进行评估。 compile time。 C 20引入恒定函数,必须在编译时进行...
    编程 发布于2025-05-14

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3