Playwright测试框架学习笔记

摘要：本文介绍了Playwright自动化测试框架的核心功能与应用方法。主要内容包括：1) Playwright作为跨平台多语言支持的现代化测试框架，支持Chromium等主流浏览器；2) 对比Selenium的优势，如更快的执行速度和强大的工具库（Codegen、Inspector、TraceViewer）；3) 详细的环境搭建指南，包括Maven依赖配置和示例代码；4) 核心功能实战演示，如

霍格沃兹测试开发学社

1083人浏览 · 2025-06-18 17:07:21

霍格沃兹测试开发学社 · 2025-06-18 17:07:21 发布

本文为霍格沃兹测试开发学社学员学习笔记，人工智能测试开发进阶学习文末加群。

一， Playwright 简介

Web 自动化测试框架。
跨平台多语言支持。
支持 Chromium、Firefox、WebKit 等主流浏览器自动化操作。
Playwright 官网：https://playwright.dev/java/docs/intro

二，Playwright 的优点

支持所有流行的浏览器。
速度更快，更可靠的执行。
更强大的自动化测试配置。
强大的工具库：Codegen、Playwright inspector、Trace Viewer。

三， Playwright 原理

四， Playwright 与 Selenium 的区别

五，Playwright 核心工具

Codegen：通过记录你的操作来生成测试。将它们保存为任何语言。
Playwright inspector：检查页面、生成选择器、逐步执行测试、查看点击点、探索执行日志。
Trace Viewer：捕获所有信息以调查测试失败。 Playwright 跟踪包含测试执行截屏、实时 DOM 快照、动作资源管理器、测试源等等。

六， Playwright 环境安装

1，在 pom.xml 中添加依赖。

<dependencies>
    <dependency>
      <groupId>com.microsoft.playwright</groupId>
      <artifactId>playwright</artifactId>
      <version>1.51.0</version>
    </dependency>
  </dependencies>
  <build>
    <plugins>
      <plugin>
        <groupId>org.apache.maven.plugins</groupId>
        <artifactId>maven-compiler-plugin</artifactId>
        <version>3.10.1</version>
        <!-- References to interface static methods are allowed only at source level 1.8 or above -->
        <configuration>
          <source>1.8</source>
          <target>1.8</target>
        </configuration>
      </plugin>
    </plugins>
  </build>

2，创建一个项目，编译并执行

package org.ceshiren;

import com.microsoft.playwright.Browser;
import com.microsoft.playwright.Page;
import com.microsoft.playwright.Playwright;
import java.nio.file.Paths;

//1，需要在项目根目录下执行
//2,执行命令：mvn compile exec:java -D exec.mainClass="org.ceshiren.App"
//3，如果是第一次执行会需要下载依赖的浏览器，所以耗时会比较久
public class App {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            //启动浏览器，这里默认是无头模式
            Browser browser = playwright.webkit().launch();
//            Browser browser = playwright.chromium().launch();
            //打开页面
            Page page = browser.newPage();
            //访问网页
            page.navigate("https://ceshiren.com/");
            //截图
            page.screenshot(new Page.ScreenshotOptions().setPath(Paths.get("example.png")));
            //打印页面标题
            System.out.println(page.title());
        }
    }
}

Playwright学习交流群

七， Codegen 基本使用

1，参数设置

# 设定展示窗口大小
mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen --viewport-size=800,600 网页地址"
# 指定设备
mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen --device='iPhone 11' 网页地址"

其他参数：https://playwright.dev/java/docs/codegen#running-codegen

执行mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen --viewport-size=800,600 ceshiren.com" 命令后，页面如下：

2，保存登录状态

场景：单点登录、验证码问题。

# 保存登录状态
mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen  --save-storage=auth.json"

# 加载认证信息
mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen --load-storage=auth.json github.com/microsoft/playwright"

执行 mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen --save-storage=auth.json" 命令，会弹出空白网页，输入ceshiren.com打开页面进行登陆；登陆成功后手动点击两次关闭页面，项目目录下会自动生成 auth.json 文件保存登陆信息
执行 mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="codegen --load-storage=auth.json ceshiren.com" 命令，再次打开同网页，直接进入登陆后的页面。

八， Playwright 常用API

链接地址：https://playwright.dev/java/docs/input
代码示例

import com.microsoft.playwright.*;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Test;
import java.nio.file.Paths;
import static org.junit.jupiter.api.Assertions.assertTrue;

public class PlaywrightTest {
    static Playwright playwright;

    @BeforeAll
    static void setUpClass() {
        playwright = Playwright.create();
    }

    @Test
    void test() {
        //指定打开谷歌浏览器，默认无头模式
        Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
        //打开页面
        Page page = browser.newPage();
        //访问页面
        page.navigate("https://ceshiren.com/");
        //点击搜索按钮
        page.locator("#search-button").click();
        //输入搜索内容
        page.locator("#search-term").fill("Appium");
        //按下回车键
        page.keyboard().down("Enter");
        //获取搜索结果的第一条
        String title = page.locator(".results .item:nth-child(1) .topic-title").innerText();
        System.out.println(title);
        //截图
        page.screenshot(new Page.ScreenshotOptions().setPath(Paths.get("screenshot.png")));
        //断言
        assertTrue(title.contains("appium"));
    }
}

九， Trace Viewer 使用

1，通过代码将执行的用例生成trace对应的zip包

import com.microsoft.playwright.*;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Test;
import java.nio.file.Paths;
import static org.junit.jupiter.api.Assertions.assertTrue;

public class PlaywrightTraceTest {
    static Playwright playwright;

    @BeforeAll
    static void setUpClass() {
        playwright = Playwright.create();
    }

    @Test
    void test() {
        Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
        //创建一个context的实例
        BrowserContext context = browser.newContext();
        // 添加trace配置
        context.tracing().start(new Tracing.StartOptions()
                .setScreenshots(true)
                .setSnapshots(true)
                .setSources(true));
        //打开页面，page实例来自于上面声明的context实例
        Page page = context.newPage();
        //访问页面
        page.navigate("https://ceshiren.com/");
        //点击搜索按钮
        page.locator("#search-button").click();
        //输入搜索内容
        page.locator("#search-term").fill("Appium");
        //按下回车键
        page.keyboard().down("Enter");
        //获取搜索结果的第一条
        String title = page.locator(".results .item:nth-child(1) .topic-title").innerText();
        System.out.println(title);
        //截图
        page.screenshot(new Page.ScreenshotOptions().setPath(Paths.get("ceshiren.png")));
        // 测试用例执行完成之后结束trace，生成trace 文件
        context.tracing().stop(new Tracing.StopOptions()
                .setPath(Paths.get("hogwarts.zip")));
        //断言
        assertTrue(title.contains("appium"));
    }
}

2，打开trace对应的zip包

执行命令： mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="show-trace hogwarts.zip"
页面展示代码用例执行的每一个步骤

推荐学习

行业首个「知识图谱+测试开发」深度整合课程【人工智能测试开发训练营】，赠送智能体工具。

爱测智能化服务平台

测开人必看！0代码+AI驱动，测试效率飙升300% ——霍格沃兹测试开发学社‌重磅上新‌「爱测智能化服务平台」限时开放体验！

一码难求的Manus：智能体技术如何重构生产力？测试领域又有哪些新机遇？

开源工具

AppCrawler 开源版
https://github.com/seveniruby/AppCrawler

Hogwarts-Browser-Use 开源版
指导安装贴：hogwarts-browser-use - 开源项目 - 爱测-测试人社区

专业版（7天免费试用）

自动遍历测试框架 AppCrawler 专业版
通用数据驱动测试框架 hogwarts-ddt 专业版
测试智能体框架 hogwarts-agent 专业版

学社提供的资源

教育官网：霍格沃兹测试开发学社
科技官网：测吧（北京）科技有限公司
火焰杯就业选拔赛：火焰杯就业选拔赛 - 霍格沃兹测试开发学社
火焰杯职业竞赛：火焰杯职业竞赛 - 霍格沃兹测试开发学社
学习路线图：霍格沃兹测试开发学社
公益社区论坛：爱测-测试人社区 - 软件测试开发爱好者的交流社区，交流范围涵盖软件测试、自动化测试、UI测试、接口测试、性能测试、安全测试、测试开发、测试平台、开源测试、测试教程、测试面试题、appium、selenium、jmeter、jenkins
公众号：霍格沃兹测试学院
视频号：霍格沃兹软件测试
ChatGPT体验地址：霍格沃兹测试开发学社

本套视频教程所有配套资料领取方式如下:

魔乐社区（Modelers.cn) 是一个中立、公益的人工智能社区，提供人工智能工具、模型、数据的托管、展示与应用协同服务，为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作，由全产业链共同建设、共同运营、共同享有，推动国产AI生态繁荣发展。

更多推荐

全家桶集齐！Qwen3.5四款小模型上线魔乐社区，附昇腾全套实践教程

魔乐社区

Pont - 搭建前后端之桥：高效、灵活的接口管理工具

Pont 是一款强大的数据服务层解决方案，它能够帮助开发者快速搭建前后端之间的桥梁，实现接口的高效管理和代码自动生成。无论是新手还是有经验的开发者，都能通过 Pont 轻松处理接口文档、生成类型安全的 API 代码，从而显著提升开发效率。[![Pont 工具标志](https://raw.gitcode.com/gh_mirrors/po/pont/raw/3f1b7d4bbba3fd2dda

魔乐社区

如何快速上手 hvac：HashiCorp Vault Python 客户端零基础入门指南

**hvac** 是 HashiCorp Vault 的 Python 3.X 客户端库，专为开发者提供简单高效的 Vault 交互方式。无论你是需要管理密钥、配置身份验证，还是实现安全的秘密数据存储，hvac 都能帮助你轻松搞定 Vault 的各项操作。本文将带你零基础快速入门，从安装到基础操作，让你在几分钟内即可上手使用这个强大的工具。[![hvac 客户端 Logo](https://r