web端自动测试工具xk6browse

这篇文章解释了如何开始使用xk6-browser，这是一个k6扩展，它添加了浏览器级API以与浏览器交互并收集网络性能指标作为k6测试的一部分。

超越协议级别的测试

多年来，k6已成为众所周知的性能测试工具，可提供最佳的开发人员体验。我们的大部分工作都集中在提供一种工具来帮助测试您的服务器或后端系统。我们全面的负载测试指南建议将用户牢记在心，后端性能测试只解决了性能测试工作的一半。

假设您测试网站的用户体验并验证在特定用户旅程中没有性能问题。在这种情况下，您需要从浏览器的角度推动一些性能测试工作，并考虑对用户流进行更现实的端到端测试。

大多数负载测试工具专注于测试API端点，但这与您的用户通常与之交互的不同。您的用户与浏览器进行交互，因此测试浏览器的性能以获取端到端的视角来了解与您的Web应用程序交互时发生的情况也很重要。

前端和后端性能测试在单独进行时各有利弊，我们在下面的视频中对此进行了更详细的讨论。

在k6，我们希望开始扩展我们的性能测试用例，并在协议级别之外进行测试。

这就是xk6-browser的用武之地。

什么是xk6浏览器？

xk6-browser为k6带来浏览器自动化和端到端web测试，同时支持核心k6功能。它使您能够在性能测试期间从前端应用程序中获得见解。

您可以使用xk6-browser在单个统一脚本中混合浏览器级别和协议级别的测试。这可以模拟来自协议级测试的大部分流量，并在浏览器级别运行一个或两个虚拟用户来模拟用户与您的网站交互的方式，从而利用混合方法进行性能测试。

xk6-browser提供了一个独特的解决方案，因为您不必使用单独的工具来测试您的前端和后端系统。xk6-browser还提供简化的体验和性能指标的聚合视图。

开始使用xk6-browser

要开始，您需要做的第一件事是安装xk6-browser。目前，它正在开发为k6扩展。但是，我们计划很快将其添加为k6核心中的实验模块。

编写测试

安装xk6-browser后，您可以复制我们的示例脚本之一作为xk6-browser文档的一部分开始使用。

脚本.js

import{chromium}fromk6/x/browser;exportdefaultfunction(){constbrowser=chromium.launch({headless:false});constpage=browser.newPage();}

让我们分析一下前面的代码发生了什么。

我们正在进口铬来自k6/x/浏览器模块。铬是类型浏览器类型，这是xk6-browser启动浏览器进程的入口点。接下来，我们使用场景函数，一个现有的k6功能，来定义我们的VU（虚拟用户）代码。要创建一个新的浏览器实例，我们使用发射的方法铬，返回一个浏览器目的。您可以在其中传递不同的参数发射您可以传递的参数之一是无头，您可以使用它来显示浏览器或不显示。要在您的浏览器实例中创建一个新页面，我们使用浏览器.newPage().

现在，进入有趣的部分！让我们模拟一个用户访问测试应用程序并登录。

脚本.js

import{chromium}fromk6/x/browser;import{check}fromk6exportdefaultfunction(){constbrowser=chromium.launch({headless:false});constpage=browser.newPage();page.goto(