自动化浏览器的测试框架playwright 支持多种浏览器Chromium、Firefox 和 WebKit

Playwright 是一个用于自动化浏览器的测试框架,支持多种浏览器,包括 Chromium、Firefox 和 WebKit。在使用 Playwright 进行测试时,可能需要安装特定的浏览器,例如 Chrome。

如何安装Playwright Chrome

在使用 Playwright 时,可以通过以下步骤来安装 Chromium(Chrome 的开源版本):

  • 1 安装 Playwright

首先,如果你还没有安装 Playwright,可以通过 npm 或 pip 在 Node.js 或 Python 环境中安装它。

  • 对于 Node.js:

    npm install playwright

  • 对于 Python:

    pip install playwright

  • 2 安装浏览器

一旦 Playwright 安装完成,你可以使用以下命令安装 Chromium(Chrome 的一个分支)以及其他支持的浏览器(如果需要)。

复制代码
npx playwright install

或者,如果你只想安装特定浏览器(比如 Chromium),可以执行:

复制代码
npx playwright install chromium

运行测试

安装完成后,你可以开始编写和运行 Playwright 测试。以下是一个使用 Chromium 的简单示例:

复制代码
const { chromium } = require('playwright');

(async () => {
  // 启动浏览器
  const browser = await chromium.launch();
  const page = await browser.newPage();
  
  // 访问网站
  await page.goto('https://example.com');
  
  // 截图
  await page.screenshot({ path: 'example.png' });

  // 关闭浏览器
  await browser.close();
})();

将代码保存到example.js文件中,然后执行

node example.js

按照代码,在当前目录生成了一副图片

2025/03/27 13:45 17,117 example.png

调试通过

其他信息

  • 其他浏览器:除了 Chromium,Playwright 还支持 Firefox 和 WebKit(Safari 的引擎),可以通过相似的方式安装。

  • Headless 模式 :Playwright 可以在无头模式下运行,即不显示浏览器界面的情况下执行测试。你可以使用 headless: true 属性来启用这个特性。

    const browser = await chromium.launch({ headless: true });
    Copy

总结

playwright install chrome 是用于安装 Chrome(具体来说是 Chromium)浏览器的过程的一部分。通过 Playwright,你可以方便地进行跨浏览器的自动化测试,支持多种常见的浏览器以及无头模式,极大地提高了测试的灵活性和效率。

调试

playwright test测试的时候显示没playwright

感觉需要这样执行

npx playwright test

复制代码
npx playwright install
╔═══════════════════════════════════════════════════════════════════════════════╗
║ WARNING: It looks like you are running 'npx playwright install' without first ║
║ installing your project's dependencies.                                       ║
║                                                                               ║
║ To avoid unexpected behavior, please install your dependencies first, and     ║
║ then run Playwright's install command:                                        ║
║                                                                               ║
║     npm install                                                               ║
║     npx playwright install                                                    ║
║                                                                               ║
║ If your project does not yet depend on Playwright, first install the          ║
║ applicable npm package (most commonly @playwright/test), and                  ║
║ then run Playwright's install command to download the browsers:               ║
║                                                                               ║
║     npm install @playwright/test                                              ║
║     npx playwright install                                                    ║
║                                                                               ║

npx playwright test的时候显示没有test

这样安装

复制代码
npm install @playwright/test

然后

复制代码
(py311) E:\work\playwright>npx playwright test
Error: No tests found

不管怎么说,在经过这几步操作后,有playwright这个命令了

复制代码
playwright
Usage: playwright [options] [command]

Options:
  -V, --version                          output the version number
  -h, --help                             display help for command

Commands:
  open [options] [url]                   open page in browser specified via -b, --browser
  codegen [options] [url]                open page and generate code for user actions
  install [options] [browser...]         ensure browsers necessary for this version of Playwright are installed
  uninstall [options]                    Removes browsers used by this installation of Playwright from the system
                                         (chromium, firefox, webkit, ffmpeg). This does not include branded channels.
  install-deps [options] [browser...]    install dependencies necessary to run browsers (will ask for sudo permissions)
  cr [options] [url]                     open page in Chromium
  ff [options] [url]                     open page in Firefox
  wk [options] [url]                     open page in WebKit
  screenshot [options] <url> <filename>  capture a page screenshot
  pdf [options] <url> <filename>         save page as pdf
  run-server [options]
  show-trace [options] [trace...]        show trace viewer
  help [command]                         display help for command

这时候再执行测试:

复制代码
node example.js

哈哈,生成了一副图片呢:

2025/03/27 13:45 17,117 example.png

相关推荐
中微子3 分钟前
JavaScript 事件机制:捕获、冒泡与事件委托详解
前端·javascript
Whoisshutiao19 分钟前
网安-XSS-pikachu
前端·安全·网络安全
惊鸿28725 分钟前
Taro3+小程序Canvas动态生成海报和二维码分享到朋友圈
前端
做梦都在学习前端31 分钟前
发布一个monaco-editor 汉化包
前端·npm·vite
石小石Orz1 小时前
为什么推荐前端学习油猴脚本开发?
前端
XMAIPC_Robot1 小时前
基于ARM+FPGA的光栅尺精密位移加速度测试解决方案
arm开发·人工智能·fpga开发·自动化·边缘计算
珵煜ini1 小时前
wd-button组件阻止事件冒泡的
前端
炒毛豆1 小时前
vue3.4中的v-model的用法~
前端·vue.js
用户40812812003811 小时前
大文件分片上传和断点续传
前端
极客悟道1 小时前
颠覆传统虚拟化:在Docker容器中运行Windows系统的开源黑科技
前端·后端