在 jest 单元测试中使用快照、API-mock 和 DOM 样式状态断言已经能够实现基础的 UI 测试，但是单元测试属于白盒测试，更关注数据的流动，而端到端测试(End To End Test)属于黑盒测试，更关注操作结果的展示，因此测试效果自然不同。端到端测试更贴近真实用户操作，页面运行在真实的浏览器环境中，因此端到端测试是从用户角度出发的测试。
最近两年测试界最火的测试工具莫过于Cypress，作为测试工程师弯道超车必备、下一代UI自动化测试利器，Cypress开发团队也一直在拼命做事，这不，Cypress10.x重磅发布了。
原文地址：https://vuejsdevelopers.com/2020/07/20/code-coverage-vue-cypress/ 原文作者：Gleb Bahmutov 译文出自："掘金翻译
之前小伙伴写了一个性能上报的 SDK，近期做重构了之后要兼容 script import 方式的引入，同时还要引入 Google 新推出的性能衡量指标，肉眼可见随着该项目的发展，项目体积、文件数量都会与日俱增。在此大背景下，我尝试了 Cypress 添加了集成测试。
https://www.cnblogs.com/poloyy/category/1768839.html
最近两年测试界最火的测试工具莫过于Cypress，作为测试工程师弯道超车必备、下一代UI自动化测试利器，Cypress开发团队也一直在拼命做事，这不，Cypress10.x重磅发布，将“Component Testing”重磅引入到了测试团队。测试人员又可以将自己的势力版图向开发侧移动一下啦 ：）
如果你的程序有数百行代码，但封装得很好，完美的践行了模块化的理念。每个模块功能单一、代码少，也可以不用写测试。
Cypress 是一个前端自动化测试工具，专门为现代 web 应用设计。它不仅可以用来做自动化测试，还能处理各种自动化操作，比如模拟用户行为、填写表单、点击按钮等。Cypress 提供了一套丰富的 API，可以轻松地与网页元素交互，执行断言，并监控应用的行为。
在这一节中，我们将学习如何使用不同的测试方法来测试我们的应用程序。这将使我们有信心对应用程序进行重构、构建新功能和修改现有功能，而不用担心破坏当前的应用程序行为。
😏作者简介：博主是一位测试管理者，同时也是一名对外企业兼职讲师。 📡主页地址：【Austin_zhai】 🙆目的与景愿：旨在于能帮助更多的测试行业人员提升软硬技能，分享行业相关最新信息。 💎声明：博主日常工作较为繁忙，文章会不定期更新，各类行业或职场问题欢迎大家私信，有空必回。
Cypress 是在 Mocha API 的基础上开发的一套开箱即用的 E2E 测试框架，并不依赖前端框架，也无需其他测试工具库，配置简单，并且提供了强大的 GUI 图形工具，可以自动截图录屏，实现时空旅行并在测试流程中 Debug。
测试在每个 Web 应用程序中都非常重要，即使在 React 中也是如此，特别是在其组件方面。
在2017年第17期和2018年19期技术雷达中，分别出现了两个新的工具——cypress,testcafe，之前只接触过webdriver框架的同学可能会有些陌生。而cypress已经在最新一期的技术雷达中进入了评估阶段，并在多个项目得到了应用，总体反馈利大于弊。
对于测试从业者来说，手工测试是一个绕不过去的坎。当年我校招毕业以测试工程师岗位进了一家互联网公司。入职第一天就被师父"拉去干活"，至今印象深刻，是一个投顾管理平台（投资顾问管理客户的平台，主要功能是为用户做理财资讯推荐）。主要工作就是让我结合测试用例对这个web页面进行测试，说白了就是点点点。测试新人嘛，这些对于我来说挺新鲜的，但是随着时间的流逝，不到几个月就感觉有点不对了，手工测试完全是个机械化的工作，在执行用例过程大脑是没有思考的，长此以往，会让你的大脑形成固化思维，在测试过程中大脑能得到的测试价值边际效应是递减的，所以这也就解释了大部分手工测试人员普遍测试积极性不高，对未来充满焦虑。
cypress 我们直接去Cypress的官网，根据教程我们先进入我们项目的根目录，执行npm install cypress --save-dev，在安装完成之后是没有任何的动静的，除了我们的package.json中会多一个版本号的记录，在这里我们根据指引在控制台中输入node_modules/.bin/cypress open这一条命令主要是让我们进入这个目录后去执行cypress的一个可执行文件，在等待片刻后页面上会弹出一个熟悉的控制台，在控制台中会有一个Alert，我们点击按钮got it 就可以看到我们项目的根目录中生成了一个cypress.json文件和一个Cpress的文件夹，在文件夹的intergration中会有一些默认写好的spec，这些用例是框架在找不到指定路径时就会默认生成这么一个目录去提供整体结构的示例的，在cypress\integration 文件夹下写测试用例，可根据情况分文件夹存放 然后我们在cypress.json中填入我们需要修改的信息
一直以来，端到端的测试都是前端开发最头疼的事情。如果没有好的测试工具，一旦需求发生改变，就需要手工测试，费时费力，还会有漏网的 bug。最近接触了一款开箱即用的端到端测试工具——Cypress，真心不错，Cypress可以对在浏览器中运行的任何东西进行快速、简单和可靠的测试。
前端工程化，是面向公司的代码模块化、系统化、规范化的一个过程，在这个过程中，经过了这个过程，我们才能称得上是“正规军”。
自动化测试是一种测试方法，是指使用特定的软件，去控制测试流程，并比较实际结果与预期结果之间的差异。通过将测试自动化，可以把人对软件的测试行为转化为由机器自动执行测试的行为，从而替代大量的手工测试操作，使得测试可以快速，反复的进行。
create-vue 是 Vue3 的专用脚手架，使用 vite 创建 Vue3 的项目，也可以选择安装需要的各种插件，使用更简单。
众所周知，一个 Javasript 项目的脚本类工具，可以使用 package.json 中的 scripts 字段来组织，简单来说，这就是 npm script。
create-vue使用npm init vue@next一行命令，就能快如闪电般初始化好基于vite的Vue3项目。
美国时间 2021 年 10 月 7 日早晨，This Dot Media 邀请了 Vue 的核心成员和 Vue Community （例如 Quasar, Ionic 开发者等）的一些主要贡献者举办了一个 Vue Contributor Days 在线会议，长达两个半小时，会上 vue-cli 的核心贡献者胖茶也在同一天公开了全新的脚手架工具 create-vue[1]，我也是看到 antfu 发推就关注了一下，看完直播回放[2]之后收获很大，这里做一些总结并且分析一下最新发布的 create-vue 的源码。
导读：在软件开发的大潮中，重写项目常常被视为一项既常见又充满挑战的任务。本文作者结合自身多年的实战经验，深入剖析了前端与后端重写之间的异同，并特别分享了从 React 向 Svelte 迁移的历程，其中遇到的种种难题与收获均一一呈现。通过对比 Svelte 与 React 在性能、开发速度及开发者满意度等方面的表现，作者认为 Svelte 具有成为新项目首选框架的潜力，并分享了自己对 Svelte 的独特见解与热切期待。此外，文章还着重强调了项目重写的必要性及其所面临的挑战，同时列举了一些成功的重写案例与失败的教训。若你对软件重写、前端框架的选择以及 Svelte 的优势抱有浓厚兴趣，那么本文定能为你带来深刻的见解与启发。
来源：https://cucumber.io/docs/guides/overview/
页面对象模型(Page Object Model)是一种设计模式,用于表示网页中的对象。在Playwright中,我们可以通过Page对象的Query Selector API 查找页面元素,并用它们创建页面对象模型。
在简单看了cypress 官方文档后，就开始用上了，越用感觉越爽。 顺便提一句，官方文档太良心了，方方面面都讲到了，而且还有视频，可以切换语言。 下面就讲讲如何使用cypress搭建一个自动化框架。当然我还是初学者，市面上也没有太多的资料，都是入门级的，官方文档也只给你渔，不会提供鱼，自己折腾出来的，感觉像那么回事。
在本节中，我们将学习什么是 CI/CD 。然后，我们将学习 GitHub Actions 是什么以及 GitHub Actions 流水线的主要部分是什么。然后，我们将学习如何创建一个 CI/CD 流水线，将自动验证并将应用程序部署到 Vercel。
近期接触了Cypress和TestCafe，两个测试框架都基于Node.js，都不再使用Selenium+WebDriver，而且开箱即用，非常轻量级，就凭不再使用WebDriver这一点，极大地勾起了我的好奇心。所以今天就来初略的学习一下，并以学习笔记成此文。
如果你的项目要长期使用并维护的话，那么代码自动测试就非常有必要使用。因为没人能保证在修改代码后，不会引发其他额外 bug（功能失效，渲染失败），而在修改完代码后，跑一遍测试就能很大程度让开发者发现自己所修改的代码是否存在问题，是否会导致原有功能失效。
React 已经诞生很久了，自从它诞生开始，围绕组件驱动形成了一个非常全面的生态，但是来自其他编程语言或者框架的开发人员很难找到要构建一个 React 系统的所有组件。如果你是来自于像 Angular 这样的框架的开发者，你可能已经习惯了框架包含了所需要的所有功能，
2019 年前端测试依然是一个炙手可热的话题。笔者在今年 5 月份参加 Vueconf 的时候，Vue 单元测试的主题演讲者曾向现场的参与者发出提问，有多少团队引入了单元测试，意外的是只有寥寥数人举起了手。尽管，那个时候笔者的团队也还没有引入前端测试，但是考虑到测试的必要性，且团队正在着手一个新项目，所以回去之后在这个新项目全量地接入了前端测试。
React Native (RN) 是 Facebook 开源的跨平台应用开发框架，由于 RN 提供的高效直观的跨平台开发模式和不错的性能，我们在开发 Glow 的中文 App - 共乐孕的时候选择了以 RN 为主要框架进行开发。
Cypress是新一代前端测试框架，它基于node js。解决了开发人员和QA工程师在测试现代应用程序时面临的关键难点问题。 Cypress包含免费的、开源的、可本地安装的Test Runner 和 能够记录测试的控制面板服务。
Behavioural Driven Development (BDD)是从TDD发展来的（什么，TDD你都不知道？！），它通过自然语言定义系统行为，以功能使用者的角度，编写需求场景，且这些行为描述可以直接形成需求文档，同时也是测试标准。
领取专属 10元无门槛券
手把手带您无忧上云
