优秀的编程知识分享平台

网站首页 > 技术文章 正文

Playwright使用小记(right play)

nanyue 2024-10-11 13:34:13 技术文章 10 ℃

Playwright是微软开源的一个Web自动化测试的开源工具,目前版本1.12.3

官网:https://playwright.dev/

github:https://github.com/microsoft/playwright

支持所有的主流的现代浏览器:Google Chrome 和 Microsoft Edge (内核均为 Chromium), Apple Safari (内核 WebKit) 及 Mozilla Firefox

本文简单记录使用方法!

1、安装

新建一个目录,如 playwright-demo,然后进入目录,执行命令:

npm i -D playwright

此时会在当前目录生成 node_modulespackage-lock.json,包含了playwright 的文件和依赖文件以及依赖信息。

2、安装测试包

默认没有拉取 playwright 的测试依赖包,执行下面命令安装依赖。因为录制的脚本默认都是测试文件,当然,也可以生成JavaScript或Python风格代码,然后直接用npm或python执行。

npm i -D @playwright/test

3、录制一个代码尝试

做个简单的录制测试吧,执行命令:

npx playwright codegen https://playwright.dev

codegen 命令会以隐私模式打开默认浏览器(可以具体指定哪个浏览器),进入playwright官网,录制页面上的操作,并在Inspector窗口显示当前操作录制后的代码细节。

const { test, expect } = require('@playwright/test');
test('test', async ({ page }) => {
  // Go to https://playwright.dev/
  await page.goto('https://playwright.dev/');
  // Click text=Get started
  await page.click('text=Get started');
  expect(page.url()).toBe('https://playwright.dev/docs/intro');
  // Click text=InstallationUsageFirst scriptRecord scriptsTypeScript supportSystem requirements >> a
  await page.click('text=InstallationUsageFirst scriptRecord scriptsTypeScript supportSystem requirements >> a');
  expect(page.url()).toBe('https://playwright.dev/docs/intro#installation');
});

Inspector 同时支持多种语言格式/风格的脚本输出(Playwright Test/Java/JS/Python/Python Async/C#):


点击“复制”按钮就可以将JavaScript脚本拷贝出来(这里采用的脚本输出类型是Playwright Test)。

看看生成的代码,基本上就是两类操作:playwright封装好的各种浏览器对象(如page,browser等);页面DOM的各种selector操作。

4、运行录制的脚本

将拷贝的脚本保存为test.js,然后开始运行(--headed是以UI方式进行测试,对应的默认的是headless无UI测试):

npx playwright test --headed

能看到脚本会自动启动浏览器,并进入到 https://playwright.dev/ 网站,然后再点击Get started按钮进入github网站。

如果生成的JS格式,可以直接用npm test.js 运行。

5、应用场景

5.1 Web前端自动化测试,自动化测试都是采用headless模式后台运行的。

5.2 RPA系统,可以将自动操作业务录制下来,然后针对录制的脚本修改,进行业务自动完成,可以完成一个基本功能的RPA所需的功能。


6、其他

Playwright提供了UI测试所需的完整的对象封装,支持等待,弹出窗口捕获,文字及鼠标输入,文件下载,事件捕获及响应等等,详情可以参考在线文档:https://playwright.dev/docs/why-playwright,通过这些API可以更精细的控制UI测试的各个方面。


最近发表
标签列表