- 综合排序
- 最热优先
- 最新优先
- 来自专栏前后两端不设限
前端自动化测试
前言 本文主要是介绍基于React+Ant Design（以下用Antd表示Ant Design）的项目，在对于自己封装的，或者基于Antd封装的公共组件的自动化测试技术的选型和实践。 背景 当前前端项目越来越大，业务逻辑日益繁杂，协同开发的同事也越来越多，迭代频繁，许多页面有一些相似的功能，会复用一些组件，这些组件被剥离出来，一般放在component文件夹下，大家共同维护，这时会出现一些常见问题 技术选型 目前前端整体的测试框架较为常用的有： Jest Mocha Jest 源自Facebook，Jest 的一个理念是提供一套完整集成的 “零配置” 测试体验。 这里可以首先简单的看一下，Jest+Enzyme的基本语法： Jest的API更多着力于定义测试、断言、mock库 定义测试： describe: 定义一个测试套件（test suite） it: 定义一个测试 测试默认值，即检查输入框的值是否为默认值 测试清除按钮是否可用，通过模拟点击清除按钮，测试是否能按照预期清除输入框内填充的默认值 测试设置值，点击输入框，弹出选择框，选择值，检查输入框中的值是否为选择的值
2.6K20编辑于 2022-12-24 - 来自专栏愧怍的技术学习与分享
前端自动化测试
UI 测试 （UI Testing） 对于前端的测试，是脱离真实后端环境的，仅仅只是将前端放在真实环境中运行，而后端和数据都应该使用 Mock 的。 备注 其实还有个接口测试，不过这就不是前端要关心的内容了，所以就没列举在这上面。 自动化测试的误区 自动化测试和普通说的测试是有些不大一样的，有很多测试，其实都不能归类为前端自动化测试。 像这些 不稳定因素 在前端自动化测试中就会使用 mock 的方式，强制返回一定格式的数据给测试框架。到这里你可能会好奇，为什么要这么做？ 想想看，如果因为接口失效导致测试失败，是因为测试代码的问题吗？ 那跟测试代码有毛关系，明显是后端或者服务器的问题。我们要测试的是获取博客列表的函数，而不是在测试接口（接口自动化测试）。测试接口不应该是前端要做的事情。 编写这篇文章主要解惑我自己对往常对测试的看法，也借此机会养成 TDD 模式的开发的习惯。 参考文章 试试前端自动化测试！（基础篇） - 掘金 (juejin.cn)
94820编辑于 2022-12-27 Playwright前端自动化测试
Playwright 是一个强大的前端自动化测试工具。 二、强大的自动化能力模拟用户交互：Playwright 可以模拟各种用户操作，如点击、输入、滚动、拖拽等。这使得测试可以更加真实地模拟用户行为，发现潜在的问题。 这使得开发者可以根据自己的项目需求和团队的技术栈选择合适的测试框架，并轻松地引入 Playwright 进行自动化测试。 使用 Playwright 进行前端自动化测试的步骤：快速安装一个 Playwrightpnpm dlx create-playwright文件目录e2e-auto ┣ node_modules ┣ 测试CI Demo代码地址自动化测试结果，还可以保存录屏回放。同时VSCode也有相应Playwright的插件Playwright Test for VSCode
1K10编辑于 2024-10-03- 来自专栏三掌柜的技术空间
前端自动化测试入门
目录前言关于自动化测试框架选择基本原则编写测试用例实施自动化测试最后前言做大前端的小伙伴想必都知道，在当今快速发展的Web开发领域，随着各类型企业的降本增效的持续推进，对前端领域的要求就是快捷，如果想要前端高效 那么本文就来为大家分享前端自动化测试的整个流程和规范，帮助读者深入理解和掌握前端自动化测试的方法和技巧。关于自动化测试先来了解一下什么是自动化测试？ 再来了解一下什么是前端自动化测试，可能大部分前端开发者都听说过，但是使用它的人却不多。 框架选择关于前端自动化测试框架选择， 也就是说在进行前端自动化测试之前，我们需要选择一个适合的测试框架，由于篇幅原因这里只分享几个在日常前端开发中常用的几个框架，掌握这几个都其中一个到两个，就够用了，以下是一些常用的前端自动化测试框架 修改测试脚本：根据失败用例的原因，修改测试脚本。可能需要增加断言、调整操作步骤或优化代码逻辑等。重新运行测试脚本：重新运行修改后的测试脚本，验证修改后的脚本是否能够通过测试。7.
72712编辑于 2024-09-19 - 来自专栏互联网杂技
前端自动化测试探索
由于前端偏向GUI软件的特殊性，尽管测试领域工具层出不穷，在前端的自动化测试上面却实施并不广泛，很多人依旧以手工测试为主。本文试图探讨前端自动化测试领域的工具和实践。 前端自动化测试可以在几个方向进行尝试： 界面回归测试 测试界面是否正常，这是前端测试最基础的环节 功能测试 测试功能操作是否正常，由于涉及交互，这部分测试比界面测试会更复杂 性能测试 页面性能越来越受到关注 多浏览器测试最出名的当属selenium , selenium可以自动化的获取多个浏览器下的截图，前端工程师来说还可以借助Node的webdriver 来轻松开发测试脚本。 当然如果你要自己实现一套类似ci的流程也不复杂，因为对于上面提到的自动化测试来说只需要一个队列系统处理批量提交的测试任务然后将运行结果反馈给用户即可。当然前端测试可能对于自定义的报表输出要求更高点。 实践经验 前端自动化测试可以说还是一个在不断探索的领域，实施过程中也难免遇到问题。有些需要注意的点可以作为经验参考。
1.8K100发布于 2018-04-03 - 来自专栏javascript艺术
前端自动化测试框架cypress
前端自动化测试框架cypress 自动化测试 为了保障软件质量，并减少重复性的测试工作，自动化测试已经被广泛运用。 关于自动化测试，有一个测试金字塔模型，该模型把测试从下到上分为了单元测试、集成测试和UI自动化测试（E2E测试/UI界面测试）。 UI自动化测试（端到端测试） UI测试的主要目的是，从软件使用者的角度来检验软件的质量，而UI自动化测试则是以自动化的方式来代替人工执行测试。 Cypress简介 Cypress是为现代网络打造的，基于JavaScript的下一代前端测试工具。他可以对浏览器中运行的任何内容进行快速，简单和可靠的测试。 不同于其他只能测试UI层的前端测试工具，Cypress允许你编写所有类型的测试，覆盖了测试金字塔模型涉及的所有测试类型：端到端测试、集成测试、单元测试。
2.7K40编辑于 2022-01-11 - 来自专栏IMWeb前端团队
前端自动化测试工具 overview
本文作者：IMWeb 邝伟科 原文出处：IMWeb社区 未经同意，禁止转载 总结最近了解的前端测试的相关内容，如有问题，欢迎指出。 前端测试化工具简单汇总和比较 Qunit jquery出的自动化测试库，没什么好说的，可以想象其跟jquery UI及jquery animation等库结局一样，逃脱不了各种被后来的库全方位的比较和“ 超越” Mocha && Jasmine Mocha 跟 Jasmine 是目前最火的两个单元测试框架，基本上目前前端单元测试就在这两个库之间选了，下面是这两个库的区别，大家可以根据自己的需求进行选择： Karma 是 Google Angular 团队开源的 JavaScript测试执行过程管理工具，其提供了强大的自动化测试功能，其主要提供能力如下： 提供真实环境，可以配置 各种chrome, firefox 等各种浏览器环境或者 Phantomjs等无头浏览器环境 可控制自动化测试流程，比如编辑器保存时自动全部全部测试用例 强大适配器，可以在karma上面配置jasmine，mocha等单元测试框架。
3.1K110发布于 2018-01-08 - 来自专栏IMWeb前端团队
前端自动化测试工具 overview
本文作者：IMWeb 邝伟科 原文出处：IMWeb社区 未经同意，禁止转载 总结最近了解的前端测试的相关内容，如有问题，欢迎指出。 前端测试化工具简单汇总和比较 Qunit jquery出的自动化测试库，没什么好说的，可以想象其跟jquery UI及jquery animation等库结局一样，逃脱不了各种被后来的库全方位的比较和“ 超越” Mocha && Jasmine Mocha 跟 Jasmine 是目前最火的两个单元测试框架，基本上目前前端单元测试就在这两个库之间选了，下面是这两个库的区别，大家可以根据自己的需求进行选择： Karma 是 Google Angular 团队开源的 JavaScript测试执行过程管理工具，其提供了强大的自动化测试功能，其主要提供能力如下： 提供真实环境，可以配置 各种chrome, firefox 等各种浏览器环境或者 Phantomjs等无头浏览器环境 可控制自动化测试流程，比如编辑器保存时自动全部全部测试用例 强大适配器，可以在karma上面配置jasmine，mocha等单元测试框架。
2K10发布于 2019-12-04 - 来自专栏QQ音乐前端团队专栏
Puppeteer 初探之前端自动化测试
puppeteer功能 1.利用网页生成PDF、图片 2.爬取SPA应用，并生成预渲染内容（即“SSR” 服务端渲染） 3.可以从网站抓取内容 4.自动化表单提交、UI测试、键盘输入等 5.帮你创建一个最新的自动化测试环境 体验第一个demo,数字专辑自动购买的UI自动化测试 这里测试的功能是自动拉登录购买一张数字专辑，并在购买成功后跳转到铭牌页，先看下整个流程吧。 ("#wrap .fpm-default"); await $dom.tap(); await timeout(5000); await page.screenshot({ path: '7. png' }); 第七步:点击完成进入铭牌页，测试完毕，关闭浏览器实例 console.log("点击 米大师支付浮层 支付完成"); $dom = await midas_frame. trace.json 接下来我们打开Chrome的开发者工具，进入到Performance栏目下，把刚才的trace.json拖上去就能看到数据了 总结 通过上面两个例子，我们看到了puppeteer可以做UI自动化测试和页面性能检测
13.7K64发布于 2017-09-25 - 来自专栏全栈工程师修炼之路
Phantomjs网页前端自动化测试之利器
[TOC] 0x00 前言基础 描述:Phantomjs /ˈfæntəm/js是一个基于webkit的JavaScript API实现网页前端自动化测试。 PhantomJS的用处可谓非常广泛，诸如网络监测、网页截屏、无需浏览器的 Web 测试、页面访问自动化等。 Expand-Archive -Path "${InstallPath}/phantomjs-2.1.1-windows.zip" -DestinationPath $InstallPath -Force CentOS7 src/phantomjs ln -sf /usr/local/src/phantomjs/bin/phantomjs /usr/local/bin/phantomjs phantomjs -v # 测试版本号
86231发布于 2020-10-26 - 来自专栏全栈工程师修炼之路
Phantomjs网页前端自动化测试之利器
[TOC] 0x00 前言基础 描述:Phantomjs /ˈfæntəm/js是一个基于webkit的JavaScript API实现网页前端自动化测试。 PhantomJS的用处可谓非常广泛，诸如网络监测、网页截屏、无需浏览器的 Web 测试、页面访问自动化等。 Expand-Archive -Path "${InstallPath}/phantomjs-2.1.1-windows.zip" -DestinationPath $InstallPath -Force CentOS7 usr/local/phantomjs ln -sf /usr/local/phantomjs/bin/phantomjs /usr/local/bin/phantomjs phantomjs -v # 测试版本号
77520编辑于 2022-09-29 - 来自专栏IMWeb前端团队
前端自动化测试解决方案探析
本文作者：IMWeb ouven 原文出处：IMWeb社区 未经同意，禁止转载 前端测试一直是前端项目开发过程中机器重要的一个环节，高效的测试方法可以减少我们进行代码自测的时间，提高我们的开发效率 ，如果你的代码涉及的测试用例较多，而且项目需要长期维护，这时就可以考虑使用一下自动化测试了。 一、前端自动化测试 前端自动化测试一般是指是在预设条件下运行前端页面或逻辑模块，评估运行结果。预设条件应包括正常条件和异常条件，以达到自动运行测试过程、减少或避免人工干预测试的目的。 在前端自动化测试中，我们通常是通过不同的工具来解决不同场景下不同的问题的。 三、集成化测试解决方案 除了模块单元的测试驱动开发，在系统功能测试阶段，我们希望自动化完成业务功能正确性的检测，此时我们就要考虑集成测试方案了。目前前端集成化测试自动化工具也有比较多。
1.4K21发布于 2019-12-04 - 来自专栏IMWeb前端团队
前端自动化测试解决方案探析
前端测试一直是前端项目开发过程中机器重要的一个环节，高效的测试方法可以减少我们进行代码自测的时间，提高我们的开发效率，如果你的代码涉及的测试用例较多，而且项目需要长期维护，这时就可以考虑使用一下自动化测试了 一、前端自动化测试 前端自动化测试一般是指是在预设条件下运行前端页面或逻辑模块，评估运行结果。预设条件应包括正常条件和异常条件，以达到自动运行测试过程、减少或避免人工干预测试的目的。 在前端自动化测试中，我们通常是通过不同的工具来解决不同场景下不同的问题的。 除了模块单元的测试驱动开发，在系统功能测试阶段，我们希望自动化完成业务功能正确性的检测，此时我们就要考虑集成测试方案了。目前前端集成化测试自动化工具也有比较多。 自动化测试不可避免地要求我们去编写测试用例，会花去一定的事件，我们在实际的项目开发过程中，决定要不要使用自动化的测试方案应该根据具体的场景来决定，如果业务规模并不复杂，而且系统功能流程清晰，则不建议使用测试用例
2.2K70发布于 2017-12-29 - 来自专栏code秘密花园
前端自动化测试探索和实践
前言 ❝这篇文章是前端自动化测试系列的开始，自动化测试系列会从理论走向实践，真正带领大家学会使用前端自动化测试框架，并能在业务中落地。 看完整个系列，还不会使用自动化测试工具为生产提效，请来找我！ ❞ 众所周知的原因，前端作为一种特殊的 GUI 软件，做自动化测试困难重重。在快速迭代，UI 变动大的业务中，自动化测试想要落地更是男上加男 ?。 近期的学习过程中，翻阅了众多前端自动化测试相关的文章，「大多数都在讲如何使用自动化测试框架对前端代码进行测试，很少讲解为什么要引入自动化测试，引入自动化测试有哪些好处，哪些项目适合引入自动化测试」，但这些才是真正我们想要知道的 ❞ 「同理，在前端自动化测试方面，抛开项目类型、软件开发的人员配置和生命周期而谈论自动化测试的好处和必要性，也是耍流氓。」 : https://www.codenong.com/j5e21674ce51d451ccf6/ [4] 美团点评技术团队：点餐前端测试最佳实践: https://juejin.im/post/5db7f25751882564a4095ca7
4.9K11发布于 2020-07-21 - 来自专栏前端Q
为什么需要前端自动化测试呢？
而接入前端自动化测试，可以帮助我们提前暴露bug并修复、降低bug产生的成本/提升测试的覆盖率，降低对其他功能原有逻辑的干扰。 接下来我们进入正题，向大家介绍前端自动化测试 前端自动化测试的种类 共四类： 单元测试 单元测试是最基础的自动化测试，用来检测项目当中的最小可测单元，例如工具函数、基础组件等 集成测试 在单元测试的基础上 自动化测试金字塔 介绍完自动化测试的种类，我们来简单比较一下这四种测试 有下之上，测试用例的数量逐步减少、粒度变粗、验证的功能变多变复杂。 满足自动化测试的条件 说了那么多，哪什么情况下，我们适合使用前端自动化测试呢？ $emit('click', evt) } } } </script> <style> //省略样式 </style> 总结 在开发中引入前端自动化测试，可以帮我们带来很多好处
1.6K30发布于 2021-11-26 - 来自专栏腾讯IMWeb前端团队
前端自动化测试解决方案探析
原文链接：http://jixianqianduan.com/frontend-javascript/2016/11/22/front-end-auto-test.html 前端测试一直是前端项目开发过程中机器重要的一个环节 一、前端自动化测试 前端自动化测试一般是指是在预设条件下运行前端页面或逻辑模块，评估运行结果。预设条件应包括正常条件和异常条件，以达到自动运行测试过程、减少或避免人工干预测试的目的。 在前端自动化测试中，我们通常是通过不同的工具来解决不同场景下不同的问题的。 三、集成化测试解决方案 除了模块单元的测试驱动开发，在系统功能测试阶段，我们希望自动化完成业务功能正确性的检测，此时我们就要考虑集成测试方案了。目前前端集成化测试自动化工具也有比较多。 自动化测试不可避免地要求我们去编写测试用例，会花去一定的事件，我们在实际的项目开发过程中，决定要不要使用自动化的测试方案应该根据具体的场景来决定，如果业务规模并不复杂，而且系统功能流程清晰，则不建议使用测试用例
1.9K10编辑于 2022-06-29 - 来自专栏测试游记
Java自动化测试(HashSet和HashMap 7)
public static void main(String[] args) { HashSet<String> set = new HashSet<>(); set.add("测试 "); set.add("测试"); set.add("a"); set.add("b"); set.add("c"); set.add("2"); set.add("3"); System.out.println(set); // [a, 1, b, 2, c, 3, 测试
34610发布于 2020-07-20 - 来自专栏FunTester
成为自动化测试的7种技能
这就是为什么自动化测试正在兴起的原因，并且作为一个熟练的自动化测试员，每个组织都希望您在以下自动化工具方面拥有知识和经验。 同样，在测试阶段开始之前，熟练的自动化测试人员必须从前端和服务层全面了解应用程序。他们必须知道 开发团队使用的编程语言。 应用程序应由最终用户运行的平台或设备要求。 5.自动化测试员技能–自动化工具故障排除 流行的测试自动化工具非常大且复杂，在项目开始使用它们之前，它要求测试人员具有有关工具本身的详细技术知识。 6.自动化测试员技能–具有测试管理工具的经验 自动化测试的主要目标是减少整个测试过程的时间复杂度。 拥有测试管理工具将确保与测试阶段有关的所有重要信息得到保护，并且仅由您的团队和管理人员访问。 7.自动化测试员技能–了解不同的开发方法 请记住，您的组织不仅希望您具有测试知识。
91720发布于 2019-10-23 - 来自专栏优测Utest
测试人员必看-做好自动化测试的7大技能
而不是取决于一个自动化的脚本找到视觉差异,你可以手动检查的问题通过真正的浏览器和设备上的测试。 （3）自动化测试可能存在漏洞 自动化脚本就像另一段代码。无论多么优秀的程序员，错误总是存在的。 这就是自动化测试应用趋势上升的原因，每个厂商都希望自动化测试人员能够具备以下自动化工具的知识和经验。 1. 四、具备充分理解业务需求 一个熟练的自动化测试人员必须在测试阶段开始之前从前端和服务层的全面了解应用程序。 （7）手动测试人员在测试应用程序时所花费的预期时间； （8）在上一个版本中是否有任何重要的bug没有得到修复，以及它将如何影响业务； （9）测试阶段需要完成的预期交付日期； （10）浏览器差异 五、具备排除自动化工具故障的能力 六、具备使用测试管理工具的经验 自动化测试的主要目的是降低整个测试过程的复杂度。如果你是一个自动化测试人员，你应该具备一些测试管理工具的经验。
2.8K00发布于 2019-12-31 - 来自专栏禅林阆苑
前端自动化测试实践02—jest基本语法
前端自动化测试实践02—jest基本语法 TOC Write By CS逍遥剑仙 我的主页: www.csxiaoyao.com GitHub: github.com/csxiaoyaojianxian Email: sunjianfeng@csxiaoyao.com 本节代码地址 https://github.com/csxiaoyaojianxian/JavaScriptStudy 下的自动化测试目录 1. matchers 匹配器 测试工具中最基本的就是断言匹配器，下面是 jest 中常用的匹配器。 ，跳过其他 case', () =>{ /* ... */ }) test('该 case 被跳过', () => { /* ... */ }) 5. snapshot 快照测试 快照测试适用于配置文件 DOM 测试 dom 测试一般用于测试 UI，例如需要测试下面 jquery 操作 dom 的代码 dom.js import { jsdom } from 'jsdom' import $ from
2.1K75发布于 2019-10-31
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号