Playwright安装教程:从 Node.js 环境到第一个自动化脚本
交流讨论欢迎加入我们一起学习 资源分享软件测试学习提升资料包 教程推荐自动化测试从入门到精通全套保姆级教程欢迎点赞 收藏 ⭐留言laywright 安装Playwright 是一个 Node.js 库所以需要我们本地安装 Node.js如果你已经安装了可以跳过。1、安装 Node.jsPlaywright 官方推荐使用 Node.js。打开 Node.js 官网下载并安装LTS长期支持版验证是否安装成功node -v npm -v能看到版本号即可。2、新建项目目录如果成功安装 node我们就可以开始 Playwright 的安装与使用。在命令行执行mkdir runoob-playwright-demo cd runoob-playwright-demo3、初始化并安装 Playwright执行npm init playwrightlatest安装过程会提示选择语言JavaScript或TypeScript熟悉哪个选哪个是否要安装测试示例推荐选Yes方便学习是否下载浏览器选YesPlaywright 会下载 Chromium、Firefox、WebKit 三大引擎安装完成后你的项目目录大概长这样playwright-demo/ ├─ tests/ # 示例测试用例 ├─ playwright.config.js # 配置文件 ├─ package.json └─ node_modules/4、使用 yarn 初始化yarn create playwright5、使用 pnpm 初始化pnpm create playwright三种包管理器的初始化效果完全相同选择你熟悉的一个即可。手动安装如果你已有项目想手动添加 Playwright可以分两步完成。第一步安装 npm 包# 安装 Playwright Test 作为开发依赖 npm i -D playwright/test # 如果只需要浏览器自动化库不用测试运行器 npm i playwright第二步安装浏览器# 安装所有浏览器Chromium、Firefox、WebKit npx playwright install # 或者只安装特定浏览器 npx playwright install chromium npx playwright install firefox npx playwright install webkit浏览器二进制文件默认下载到操作系统缓存目录如 macOS 的 ~/Library/Caches/ms-playwright/不会占用你的项目空间。安装的浏览器说明Playwright 安装的是浏览器的测试版本而非你日常使用的浏览器Playwright 中的名称对应浏览器说明ChromiumGoogle Chrome 的开源基础Chrome 的核心引擎行为几乎一致FirefoxMozilla Firefox官方 Firefox 的测试构建版本WebKitApple Safari 的引擎Safari 的底层渲染引擎这些测试版本与用户日常使用的浏览器存在微小差异但在绝大多数测试场景中表现一致。验证安装安装完成后运行以下命令验证是否成功# 查看已安装的 Playwright 版本和浏览器 npx playwright --version预期输出大致如下Version 1.52.0运行示例测试来验证一切正常npx playwright test如果看到测试运行的输出包括通过和失败的测试说明安装成功。常见安装问题下载浏览器很慢浏览器二进制文件较大约 400-500 MB下载速度取决于网络环境。可以通过设置环境变量使用国内镜像# 设置下载源为国内镜像 export PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright/ npx playwright installLinux 系统缺少系统依赖在 Linux 上运行 Playwright 需要安装额外的系统库。# 安装 Playwright 所需的系统依赖 npx playwright install-deps # 如果只需要某个浏览器对应的依赖 npx playwright install-deps chromium在 Docker 容器中使用 Playwright 时请使用微软官方 Docker 镜像mcr.microsoft.com/playwright它已预装所有依赖。第一个脚本Hello World新建一个test.js文件写入以下内容实例// test.js const { chromium } require(playwright); (async () { // 1. 启动浏览器 const browser await chromium.launch({ headless: false }); // 设置 false 可以看到浏览器 const page await browser.newPage(); // 2. 打开网页 await page.goto(https://www.baidu.com); // 3. 截图保存 await page.screenshot({ path: baidu.png }); // 4. 关闭浏览器 await browser.close(); console.log(截图已保存到 example.png); })();运行node test.js以上是一个 Playwright 的简单实例可以截图百度的首页。

相关新闻

【工作杂谈_20260810】用户分析与身份体系: Active User:定义、计算口径与常见应用

【工作杂谈_20260810】用户分析与身份体系: Active User:定义、计算口径与常见应用

文章目录1. Active User 是什么1.1 DAU、WAU、MAU2. AU在大数据场景中的常见应用2.1 多维分析:不同分群的用户活跃情况2.1.1 基本计算方式2.1.2 多维 AU 不能直接上卷2.1.3 什么时候可以直接相加2.1.4 多维分析的业务价值2.2 漏斗对比:不同渠道的用户转化…

2026/10/28 1:27:03 阅读更多 →
AI短剧制作全流程解析:从小说到视频的自动化生成实践

AI短剧制作全流程解析:从小说到视频的自动化生成实践

简介:在AI内容生成领域,自然语言处理与计算机视觉技术的融合正推动创作方式的革新。其核心原理在于通过大语言模型理解文本语义,结合文生图、图生视频等生成式AI模型,实现从文字到视觉内容的自动化转换。这一技术组合的价值在于大…

2026/10/24 13:45:39 阅读更多 →
2026年电商AI客服选型验收清单:中小团队技术负责人的六维评估与压测方法

2026年电商AI客服选型验收清单:中小团队技术负责人的六维评估与压测方法

核心摘要 「选哪家」的问题对技术负责人来说应翻译成「怎么验收」——六个维度足以把营销话术和真实水位分开。六维清单:平台接入覆盖、知识新鲜度、首响延迟、并发弹性、转人工链路、数据安全。每个维度给出可执行的压测或验证方法,全部可在两周试用期内…

2026/10/25 4:19:57 阅读更多 →

最新新闻

Electron桌面应用开发实战:从环境搭建到打包发布全流程

Electron桌面应用开发实战:从环境搭建到打包发布全流程

做前端这些年,我大部分时间都在跟浏览器标签页打交道,直到第一次把桌面应用跑起来,才发现原来自己一直被限制在地址栏和刷新按钮围起来的框框里。Electron这个词,最开始是在某段时间频繁出现在同事的讨论里,一个用HTML…

2026/10/27 17:33:32 阅读更多 →
滑盖智能锁T109深度解析:结构原理、安装调试与故障排查

滑盖智能锁T109深度解析:结构原理、安装调试与故障排查

简介:亚太天能T109滑盖智能锁产品说明书是一份PDF格式的官方技术文档,主要面向智能锁安装人员、终端用户及售后维护者,帮助快速掌握产品安装、配置与常见故障处理。全包仅1个PDF文件,大小4.37MB,内容结构清晰&#xff…

2026/10/27 4:06:49 阅读更多 →
PMSM弱磁控制原理与Simulink建模:高速AGV驱动系统设计指南

PMSM弱磁控制原理与Simulink建模:高速AGV驱动系统设计指南

上个月我在调试一台高速AGV的驱动系统,整车要求空载跑到8m/s,电机转速已经拉到额定点,驱动器的输出电压也顶到了母线电压极限附近。再往上踩速度指令,转速纹丝不动,三相电流反而开始震荡。那会儿我的第一反应就是&…

2026/10/27 7:21:53 阅读更多 →
C++核心知识点:从内存管理到STL的实战指南

C++核心知识点:从内存管理到STL的实战指南

C 这门语言我前前后后折腾了十几年,用它写过嵌入式驱动、做过游戏服务端,也搭过基础组件库。每次看到新人一头扎进"C 核心知识点"这个搜索词,我其实挺感慨的——这门语言的难点从来不是语法多,而是知识点之间的耦合太深…

2026/10/27 18:20:50 阅读更多 →
T109滑盖智能锁怎么装?安装调试与故障排查全攻略

T109滑盖智能锁怎么装?安装调试与故障排查全攻略

简介:亚太天能T109滑盖智能锁产品说明书以PDF格式发布,适合智能锁用户、安装人员与售后维修人员阅读。内容围绕T109系列指纹密码刷卡锁展开,先介绍前面板、后面板、锁体、机械钥匙、电池盒盖等部件名称与功能,再给出完整安装步骤&…

2026/10/27 6:20:47 阅读更多 →
LLM知识降熵:从信息垄断到理解权下放

LLM知识降熵:从信息垄断到理解权下放

你有没有过这种经历:翻开源码注释、论文摘要或者一份专业报告,每个字都认识,连在一起却像天书。想找人聊聊,身边要么没人懂,要么懂的懒得跟你解释。后来我试着把同一段内容丢给一个大语言模型,几秒钟之后&a…

2026/10/27 4:06:50 阅读更多 →

日新闻

周新闻

月新闻

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/27 13:55:19 阅读更多 →
Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/27 7:21:50 阅读更多 →
黑夜航拍船只数据集训练YOLOV5模型全流程解析

黑夜航拍船只数据集训练YOLOV5模型全流程解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/27 19:19:37 阅读更多 →