Skip to main content

发行说明

1.57 版本

🌐 Version 1.57

用于测试的 Chrome

🌐 Chrome for Testing

从此版本开始,Playwright 将从 Chromium 切换为使用 Chrome for Testing 构建版本。无论是有界面还是无界面浏览器,都将受到此更改的影响。升级到 Playwright 1.57 后,你的测试仍应该能够通过。

🌐 Starting with this release, Playwright switches from Chromium, to using Chrome for Testing builds. Both headed and headless browsers are subject to this. Your tests should still be passing after upgrading to Playwright 1.57.

我们预计此次切换不会带来功能上的变化。最大变化是工具栏中的新图标和标题。

🌐 We're expecting no functional changes to come from this switch. The biggest change is the new icon and title in your toolbar.

new and old logo

如果你仍然看到意外的行为变化,请 提交问题

🌐 If you still see an unexpected behaviour change, please file an issue.

在 Arm64 Linux 上,Playwright 仍然使用 Chromium。

🌐 On Arm64 Linux, Playwright continues to use Chromium.

重大变更

🌐 Breaking Change

在被弃用三年后,我们已从 API 中移除了 page.accessibility()。如果你需要测试页面的可访问性,请使用其他库,例如 Axe。有关与 Axe 集成的详细信息,请参阅我们的 Node.js 指南

🌐 After 3 years of being deprecated, we removed page.accessibility() from our API. Please use other libraries such as Axe if you need to test page accessibility. See our Node.js guide for integration with Axe.

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 143.0.7499.4
  • Mozilla Firefox 144.0.2
  • WebKit 26.0

1.56 版本

🌐 Version 1.56

新 API

🌐 New APIs

重大变化

🌐 Breaking Changes

杂项

🌐 Miscellaneous

  • Aria 快照呈现并比较 input placeholder

浏览器版本

🌐 Browser Versions

  • Chromium 141.0.7390.37
  • Mozilla Firefox 142.0.1
  • WebKit 26.0

1.55 版本

🌐 Version 1.55

代码生成器

🌐 Codegen

  • 自动 isVisible() 断言:Codegen 现在可以为常见的 UI 交互生成自动 isVisible() 断言。此功能可以在 Codegen 设置界面中启用。

重大变化

🌐 Breaking Changes

  • ⚠️ 已停止支持 Chromium 扩展清单 v2。

杂项

🌐 Miscellaneous

  • 已新增对 Debian 13 “Trixie”的支持。

浏览器版本

🌐 Browser Versions

  • Chromium 140.0.7339.16
  • Mozilla Firefox 141.0
  • WebKit 26.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 139
  • Microsoft Edge 139

1.54 版本

🌐 Version 1.54

高亮

🌐 Highlights

  • BrowserContext.cookies()BrowserContext.addCookies() 中新增了 Cookie 属性 partitionKey。此属性允许保存和恢复分区 Cookie。更多信息请参见 CHIPS MDN 文章。请注意,不同浏览器对 Cookie 分区的支持和默认设置有所不同。

  • 多个命令中新增选项 --user-data-dir。你可以指定相同的用户数据目录,以便在会话之间重用浏览状态,例如身份验证信息。

    mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="codegen --user-data-dir=./user-data"
  • mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args=open 命令不再打开测试记录器。请改用 mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args=codegen

浏览器版本

🌐 Browser Versions

  • Chromium 139.0.7258.5
  • Mozilla Firefox 140.0.2
  • WebKit 26.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 140
  • Microsoft Edge 140

1.53 版本

🌐 Version 1.53

Trace 查看器和 HTML 报告器更新

🌐 Trace Viewer and HTML Reporter Updates

  • Trace Viewer 的新步骤:新 Trace Viewer 步骤

  • 新方法 Locator.describe() 用于描述定位器。用于跟踪查看器。

    Locator button = page.getByTestId("btn-sub").describe("Subscribe button");
    button.click();
  • mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="install --list"现在将列出所有已安装的浏览器、版本和位置。

浏览器版本

🌐 Browser Versions

  • Chromium 138.0.7204.4
  • Mozilla Firefox 139.0
  • WebKit 18.5

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 137
  • Microsoft Edge 137

1.52 版本

🌐 Version 1.52

高亮

🌐 Highlights

  • 新方法 assertThat(locator).containsClass() 用于以更符合人机工程学的方式断言元素上的单个类名。

      assertThat(page.getByRole(AriaRole.LISTITEM, new Page.GetByRoleOptions().setName("Ship v1.52"))).containsClass("done");
  • Aria 快照 获得了两个新属性:用于严格匹配的 /children 和用于链接的 /url

    assertThat(locator).toMatchAriaSnapshot("""
    - list
    - /children: equal
    - listitem: Feature A
    - listitem:
    - link "Feature B":
    - /url: "https://playwright.nodejs.cn"
    """);

杂项

🌐 Miscellaneous

重大变化

🌐 Breaking Changes

  • Page.route() 这样的方法中的通配符 URL 模式不再支持 ?[]。我们建议改用正则表达式。
  • 方法 Route.resume() 不再允许覆盖 Cookie 头。如果提供了 Cookie 头,它将被忽略,并且 cookie 将从浏览器的 cookie 存储中加载。要设置自定义 cookie,请使用 BrowserContext.addCookies()
  • macOS 13 已被弃用,将不再接收 WebKit 更新。请升级到更新的 macOS 版本,以继续享受最新的 WebKit 改进。

浏览器版本

🌐 Browser Versions

  • Chromium 136.0.7103.25
  • Mozilla Firefox 137.0
  • WebKit 18.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 135
  • Microsoft Edge 135

1.51 版本

🌐 Version 1.51

高亮

🌐 Highlights

  • 新的选项 setIndexedDB 对于 BrowserContext.storageState() 允许保存和恢复 IndexedDB 内容。当你的应用使用 IndexedDB API 存储认证令牌(例如 Firebase Authentication)时,非常有用。

    这里有一个按照认证指南的示例:

    // Save storage state into the file. Make sure to include IndexedDB.
    context.storageState(new BrowserContext.StorageStateOptions()
    .setPath(Paths.get("state.json"))
    .setIndexedDB(true));

    // Create a new context with the saved storage state.
    BrowserContext context = browser.newContext(new Browser.NewContextOptions()
    .setStorageStatePath(Paths.get("state.json")));
  • 新的选项 setVisible 用于 Locator.filter(),允许只匹配可见元素。

    // Ignore invisible todo items.
    Locator todoItems = page.getByTestId("todo-item")
    .filter(new Locator.FilterOptions().setVisible(true));
    // Check there are exactly 3 visible ones.
    assertThat(todoItems).hasCount(3);
  • 新选项 setContrast 可用于方法 Page.emulateMedia()Browser.newContext(),允许模拟 prefers-contrast 媒体特性。

  • 新选项 setFailOnStatusCode 使通过 APIRequestContext 发出的所有 fetch 请求在响应代码不是 2xx 或 3xx 时都会抛出错误。

浏览器版本

🌐 Browser Versions

  • Chromium 134.0.6998.35
  • Mozilla Firefox 135.0
  • WebKit 18.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 133
  • Microsoft Edge 133

1.50 版本

🌐 Version 1.50

杂项

🌐 Miscellaneous

UI 更新

🌐 UI updates

  • Codegen 中的新按钮用于选择元素以生成 aria 快照。
  • 其他详细信息(例如按下的键)现在与跟踪中的操作 API 调用一起显示。
  • 在跟踪中显示 canvas 内容容易出错。默认情况下已禁用显示,可以通过 Display canvas content 用户界面设置启用。
  • CallNetwork 面板现在显示额外的时间信息。

重点

🌐 Breaking

浏览器版本

🌐 Browser Versions

  • Chromium 133.0.6943.16
  • Mozilla Firefox 134.0
  • WebKit 18.2

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 132
  • Microsoft Edge 132

1.49 版本

🌐 Version 1.49

Aria 快照

🌐 Aria snapshots

新的断言 assertThat(locator).matchesAriaSnapshot() 通过与表示为 YAML 的预期无障碍树进行比较来验证页面结构。

🌐 New assertion assertThat(locator).matchesAriaSnapshot() verifies page structure by comparing to an expected accessibility tree, represented as YAML.

page.navigate("https://playwright.nodejs.cn");
assertThat(page.locator("body")).matchesAriaSnapshot("""
- banner:
- heading /Playwright enables reliable/ [level=1]
- link "Get started"
- link "Star microsoft/playwright on GitHub"
- main:
- img "Browsers (Chromium, Firefox, WebKit)"
- heading "Any browser • Any platform • One API"
""");

你可以使用 Test Generator 生成此断言,或通过调用 Locator.ariaSnapshot() 来生成。

🌐 You can generate this assertion with Test Generator or by calling Locator.ariaSnapshot().

ARIA 快照指南中了解更多。

🌐 Learn more in the aria snapshots guide.

跟踪组

🌐 Tracing groups

新方法 Tracing.group() 允许你在跟踪查看器中直观地分组操作。

🌐 New method Tracing.group() allows you to visually group actions in the trace viewer.

// All actions between group and groupEnd
// will be shown in the trace viewer as a group.
page.context().tracing().group("Open Playwright.dev > API");
page.navigate("https://playwright.nodejs.cn/");
page.getByRole(AriaRole.LINK, new Page.GetByRoleOptions().setName("API")).click();
page.context().tracing().groupEnd();

最新消息:chromemsedge 通道切换到新的无头模式

🌐 Breaking: chrome and msedge channels switch to new headless mode

如果你在 playwright.config.ts 中使用以下渠道之一,这一更改将会影响你:

🌐 This change affects you if you're using one of the following channels in your playwright.config.ts:

  • chromechrome-devchrome-betachrome-canary
  • msedgemsedge-devmsedge-betamsedge-canary

在更新到 Playwright v1.49 后,运行你的测试套件。如果测试仍然通过,那么你就可以继续使用。如果没有,你可能需要更新你的快照,并调整一些关于 PDF 查看器和扩展的测试代码。更多详情请参见 issue #33566

🌐 After updating to Playwright v1.49, run your test suite. If it still passes, you're good to go. If not, you will probably need to update your snapshots, and adapt some of your test code around PDF viewers and extensions. See issue #33566 for more details.

尝试新的 Chromium 无头

🌐 Try new Chromium headless

你可以通过使用 'chromium' 通道来选择新的无头模式。正如官方 Chrome 文档所述

🌐 You can opt into the new headless mode by using 'chromium' channel. As official Chrome documentation puts it:

另一方面,新的无头模式是真正的 Chrome 浏览器,因此更真实、可靠,并提供更多功能。这使得它更适合进行高精度的端到端网络应用测试或浏览器扩展测试。

请参见 issue #33566 了解你可能遇到的断裂问题列表以及有关无头 Chromium 的更多详细信息。如果在选择加入后遇到任何问题,请提交问题报告。

🌐 See issue #33566 for the list of possible breakages you could encounter and more details on Chromium headless. Please file an issue if you see any problems after opting in.

Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setChannel("chromium"));

杂项

🌐 Miscellaneous

  • Ubuntu 20.04 和 Debian 11 的 WebKit 将不再有更新。我们建议将操作系统升级到更高版本。
  • 快照中的 <canvas> 元素现在会显示预览。

浏览器版本

🌐 Browser Versions

  • Chromium 131.0.6778.33
  • Mozilla Firefox 132.0
  • WebKit 18.2

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 130
  • Microsoft Edge 130

1.48 版本

🌐 Version 1.48

WebSocket 路由

🌐 WebSocket routing

新的方法 Page.routeWebSocket()BrowserContext.routeWebSocket() 允许拦截、修改和模拟页面中发起的 WebSocket 连接。下面是一个简单的示例,通过对 "request" 响应 "response" 来模拟 WebSocket 通信。

🌐 New methods Page.routeWebSocket() and BrowserContext.routeWebSocket() allow to intercept, modify and mock WebSocket connections initiated in the page. Below is a simple example that mocks WebSocket communication by responding to a "request" with a "response".

page.routeWebSocket("/ws", ws -> {
ws.onMessage(frame -> {
if ("request".equals(frame.text()))
ws.send("response");
});
});

查看更多详情,请参阅 WebSocketRoute

🌐 See WebSocketRoute for more details.

UI 更新

🌐 UI updates

  • HTML 报告中为注释和测试位置新增了“复制”按钮。
  • Route.fulfill() 这样的路由方法调用不再显示在报告和跟踪查看器中。你可以在网络选项卡中查看哪些网络请求被路由。
  • 网络面板中的请求新增了“复制为 cURL”和“复制为 fetch”按钮。

杂项

🌐 Miscellaneous

浏览器版本

🌐 Browser Versions

  • Chromium 130.0.6723.19
  • Mozilla Firefox 130.0
  • WebKit 18.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 129
  • Microsoft Edge 129

1.47 版本

🌐 Version 1.47

网络选项卡改进

🌐 Network Tab improvements

跟踪查看器中的“网络”选项卡有几项不错的改进:

🌐 The Network tab in the trace viewer has several nice improvements:

  • 按资源类型和 URL 过滤
  • 更好地显示查询字符串参数
  • 字体资源预览

Network tab now has filters

杂项

🌐 Miscellaneous

  • mcr.microsoft.com/playwright/java:v1.47.0 现在基于 Ubuntu 24.04 Noble 提供 Playwright 镜像。要使用基于 22.02 jammy 的镜像,请改用 mcr.microsoft.com/playwright/java:v1.47.0-jammy
  • Playwright Docker 镜像的 :latest/:focal/:jammy 标签不再发布。为了更好的稳定性和可重复性,请固定到特定版本。
  • TLS 客户端证书现在可以通过内存传递,只需将 setClientCertificates.setCertsetClientCertificates.setKey 作为字节数组传递,而不是文件路径。
  • [Locator.selectOption()] 中的 setNoWaitAfter 已被弃用。
  • 我们在 GitHub Actions macos-13 上看到关于 Webkit 中 WebGL 异常行为的报告。我们建议将 GitHub Actions 升级到 macos-14

浏览器版本

🌐 Browser Versions

  • Chromium 129.0.6668.29
  • Mozilla Firefox 130.0
  • WebKit 18.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 128
  • Microsoft Edge 128

1.46 版本

🌐 Version 1.46

TLS 客户端证书

🌐 TLS Client Certificates

Playwright 现在允许提供客户端证书,以便服务器能够按照 TLS 客户端身份验证的要求进行验证。

🌐 Playwright now allows to supply client-side certificates, so that server can verify them, as specified by TLS Client Authentication.

你可以将客户端证书作为 Browser.newContext()APIRequest.newContext() 的参数提供。以下示例为 https://example.com 设置了一个客户端证书:

🌐 You can provide client certificates as a parameter of Browser.newContext() and APIRequest.newContext(). The following snippet sets up a client certificate for https://example.com:

BrowserContext context = browser.newContext(new Browser.NewContextOptions()
.setClientCertificates(asList(new ClientCertificate("https://example.com")
.setCertPath(Paths.get("client-certificates/cert.pem"))
.setKeyPath(Paths.get("client-certificates/key.pem")))));

跟踪查看器更新

🌐 Trace Viewer Updates

  • 文本附件的内容现在在附件窗格中以内联方式渲染。
  • 新增设置以显示/隐藏路由操作,例如 Route.resume()
  • 请求方法和状态显示在网络详细信息选项卡中。
  • 新按钮用于将源文件位置复制到剪贴板。
  • 元数据窗格现在显示 baseURL

杂项

🌐 Miscellaneous

浏览器版本

🌐 Browser Versions

  • Chromium 128.0.6613.18
  • Mozilla Firefox 128.0
  • WebKit 18.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 127
  • Microsoft Edge 127

1.45 版本

🌐 Version 1.45

时钟

🌐 Clock

使用新的 Clock API 可以在测试中操作和控制时间,以验证与时间相关的行为。该 API 涵盖了许多常见的场景,包括:

🌐 Utilizing the new Clock API allows to manipulate and control time within tests to verify time-related behavior. This API covers many common scenarios, including:

  • 使用预定义时间进行测试;
  • 保持一致的时间和计时器;
  • 监控不活动;
  • 手动计时。
// Initialize clock with some time before the test time and let the page load
// naturally. `Date.now` will progress as the timers fire.
page.clock().install(new Clock.InstallOptions().setTime("2024-02-02T08:00:00"));
page.navigate("http://localhost:3333");
Locator locator = page.getByTestId("current-time");

// Pretend that the user closed the laptop lid and opened it again at 10am.
// Pause the time once reached that point.
page.clock().pauseAt("2024-02-02T10:00:00");

// Assert the page state.
assertThat(locator).hasText("2/2/2024, 10:00:00 AM");

// Close the laptop lid again and open it at 10:30am.
page.clock().fastForward("30:00");
assertThat(locator).hasText("2/2/2024, 10:30:00 AM");

有关更多详情,请参见时钟指南

🌐 See the clock guide for more details.

杂项

🌐 Miscellaneous

  • 方法 Locator.setInputFiles() 现在支持为 <input type=file webkitdirectory> 元素上传整个目录。

    page.getByLabel("Upload directory").setInputFiles(Paths.get("mydir"));
  • Locator.click()Locator.press() 这样的多种方法现在支持 ControlOrMeta 修饰键。这个键在 macOS 上对应 Meta,在 Windows 和 Linux 上对应 Control

    // Press the common keyboard shortcut Control+S or Meta+S to trigger a "Save" operation.
    page.keyboard.press("ControlOrMeta+S");
  • APIRequest.newContext() 中的新属性 httpCredentials.send,允许始终发送 Authorization 头,或者仅在响应 401 Unauthorized 时发送该头。

  • Playwright 现在支持 Ubuntu 24.04 上的 Chromium、Firefox 和 WebKit。

  • v1.45 是最后一个为 macOS 12 Monterey 提供 WebKit 更新的版本。请更新 macOS 以继续使用最新的 WebKit。

浏览器版本

🌐 Browser Versions

  • Chromium 127.0.6533.5
  • Mozilla Firefox 127.0
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 126
  • Microsoft Edge 126

1.44 版本

🌐 Version 1.44

新 API

🌐 New APIs

无障碍声明

  • assertThat(locator).hasAccessibleName() 检查该元素是否具有指定的可访问名称:

    Locator locator = page.getByRole(AriaRole.BUTTON);
    assertThat(locator).hasAccessibleName("Submit");
  • assertThat(locator).hasAccessibleDescription() 检查该元素是否具有指定的可访问描述:

    Locator locator = page.getByRole(AriaRole.BUTTON);
    assertThat(locator).hasAccessibleDescription("Upload a photo");
  • assertThat(locator).hasRole() 检查元素是否具有指定的 ARIA 角色:

    Locator locator = page.getByTestId("save-button");
    assertThat(locator).hasRole(AriaRole.BUTTON);

定位器处理程序

  • 在执行通过 Page.addLocatorHandler() 添加的处理程序后,Playwright 现在将等待直到触发该处理程序的覆盖层不再可见。你可以使用新的 setNoWaitAfter 选项选择不启用此行为。
  • 你可以在 Page.addLocatorHandler() 中使用新的 setTimes 选项来指定处理程序应运行的最大次数。
  • Page.addLocatorHandler() 中的处理程序现在接受定位器作为参数。
  • 新增 Page.removeLocatorHandler() 方法,用于移除之前添加的定位器处理程序。
Locator locator = page.getByText("This interstitial covers the button");
page.addLocatorHandler(locator, overlay -> {
overlay.locator("#close").click();
}, new Page.AddLocatorHandlerOptions().setTimes(3).setNoWaitAfter(true));
// Run your tests that can be interrupted by the overlay.
// ...
page.removeLocatorHandler(locator);

其他选项

  • 新方法 FormData.append() 允许在 RequestOptionssetMultipart 选项中指定具有相同名称的重复字段:

    FormData formData = FormData.create();
    formData.append("file", new FilePayload("f1.js", "text/javascript",
    "var x = 2024;".getBytes(StandardCharsets.UTF_8)));
    formData.append("file", new FilePayload("f2.txt", "text/plain",
    "hello".getBytes(StandardCharsets.UTF_8)));
    APIResponse response = context.request().post("https://example.com/uploadFile", RequestOptions.create().setMultipart(formData));
  • expect(page).toHaveURL(url) now supports setIgnoreCase option.

浏览器版本

🌐 Browser Versions

  • Chromium 125.0.6422.14
  • Mozilla Firefox 125.0.1
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • Google Chrome 124
  • Microsoft Edge 124

1.43 版本

🌐 Version 1.43

新 API

🌐 New APIs

  • 方法 BrowserContext.clearCookies() 现在支持过滤器,可仅删除某些 cookie。

    // Clear all cookies.
    context.clearCookies();
    // New: clear cookies with a particular name.
    context.clearCookies(new BrowserContext.ClearCookiesOptions().setName("session-id"));
    // New: clear cookies for a particular domain.
    context.clearCookies(new BrowserContext.ClearCookiesOptions().setDomain("my-origin.com"));
  • 新方法 Locator.contentFrame()Locator 对象转换为 FrameLocator。当你在某处获得了一个 Locator 对象,并且之后想要与框架内的内容进行交互时,这会非常有用。

    Locator locator = page.locator("iframe[name='embedded']");
    // ...
    FrameLocator frameLocator = locator.contentFrame();
    frameLocator.getByRole(AriaRole.BUTTON).click();
  • 新方法 FrameLocator.owner()FrameLocator 对象转换为 Locator。当你在某处获得一个 FrameLocator 对象,并且之后希望与 iframe 元素进行交互时,这会很有用。

    FrameLocator frameLocator = page.frameLocator("iframe[name='embedded']");
    // ...
    Locator locator = frameLocator.owner();
    assertThat(locator).isVisible();

浏览器版本

🌐 Browser Versions

  • Chromium 124.0.6367.8
  • 火狐浏览器 124.0
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 123
  • 微软边缘 123

1.42 版本

🌐 Version 1.42

实验性 JUnit 集成

🌐 Experimental JUnit integration

在你的测试类中添加新的 @UsePlaywright 注解,以开始在测试方法中使用 Playwright 的 PageBrowserContextBrowserAPIRequestContextPlaywright 夹具。

🌐 Add new @UsePlaywright annotation to your test classes to start using Playwright fixtures for Page, BrowserContext, Browser, APIRequestContext and Playwright in the test methods.

package org.example;

import com.microsoft.playwright.Page;
import com.microsoft.playwright.junit.UsePlaywright;
import org.junit.jupiter.api.Test;

import static com.microsoft.playwright.assertions.PlaywrightAssertions.assertThat;
import static org.junit.jupiter.api.Assertions.assertEquals;

@UsePlaywright
public class TestExample {
void shouldNavigateToInstallationGuide(Page page) {
page.navigate("https://playwright.nodejs.cn/java/");
page.getByRole(AriaRole.LINK, new Page.GetByRoleOptions().setName("Docs")).click();
assertThat(page.getByRole(AriaRole.HEADING, new Page.GetByRoleOptions().setName("Installation"))).isVisible();
}

@Test
void shouldCheckTheBox(Page page) {
page.setContent("<input id='checkbox' type='checkbox'></input>");
page.locator("input").check();
assertEquals(true, page.evaluate("window['checkbox'].checked"));
}

@Test
void shouldSearchWiki(Page page) {
page.navigate("https://www.wikipedia.org/");
page.locator("input[name=\"search\"]").click();
page.locator("input[name=\"search\"]").fill("playwright");
page.locator("input[name=\"search\"]").press("Enter");
assertThat(page).hasURL("https://en.wikipedia.org/wiki/Playwright");
}
}

在上面的示例中,所有三个测试方法都使用相同的 Browser。每个测试使用它自己的 BrowserContextPage

🌐 In the example above, all three test methods use the same Browser. Each test uses its own BrowserContext and Page.

自定义选项

实现你自己的 OptionsFactory 来使用自定义配置初始化测试夹具。

🌐 Implement your own OptionsFactory to initialize the fixtures with custom configuration.

import com.microsoft.playwright.junit.Options;
import com.microsoft.playwright.junit.OptionsFactory;
import com.microsoft.playwright.junit.UsePlaywright;

@UsePlaywright(MyTest.CustomOptions.class)
public class MyTest {

public static class CustomOptions implements OptionsFactory {
@Override
public Options getOptions() {
return new Options()
.setHeadless(false)
.setContextOption(new Browser.NewContextOptions()
.setBaseURL("https://github.com"))
.setApiRequestOptions(new APIRequest.NewContextOptions()
.setBaseURL("https://playwright.nodejs.cn"));
}
}

@Test
public void testWithCustomOptions(Page page, APIRequestContext request) {
page.navigate("/");
assertThat(page).hasURL(Pattern.compile("github"));

APIResponse response = request.get("/");
assertTrue(response.text().contains("Playwright"));
}
}

在我们的 JUnit 指南 中了解更多关于 fixtures 的信息。

🌐 Learn more about the fixtures in our JUnit guide.

新的定位器处理程序

🌐 New Locator Handler

新方法 Page.addLocatorHandler() 注册一个回调,当指定元素可见时将被调用,并且可能阻塞 Playwright 的操作。回调可以移除覆盖层。下面是一个示例,当出现 cookie 对话框时关闭它。

🌐 New method Page.addLocatorHandler() registers a callback that will be invoked when specified element becomes visible and may block Playwright actions. The callback can get rid of the overlay. Here is an example that closes a cookie dialog when it appears.

// Setup the handler.
page.addLocatorHandler(
page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Hej! You are in control of your cookies.")),
() -> {
page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Accept all")).click();
});
// Write the test as usual.
page.navigate("https://www.ikea.com/");
page.getByRole(AriaRole.LINK, new Page.GetByRoleOptions().setName("Collection of blue and white")).click();
assertThat(page.getByRole(AriaRole.HEADING, new Page.GetByRoleOptions().setName("Light and easy"))).isVisible();

新 API

🌐 New APIs

公告

🌐 Announcements

  • ⚠️ Ubuntu 18 已不再受支持。

浏览器版本

🌐 Browser Versions

  • Chromium 123.0.6312.4
  • 火狐浏览器 123.0
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 122
  • 微软边缘 123

1.41 版本

🌐 Version 1.41

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 121.0.6167.57
  • 火狐浏览器 121.0
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 120
  • 微软 Edge 120

1.40 版本

🌐 Version 1.40

测试生成器更新

🌐 Test Generator Update

Playwright Test Generator

生成断言的新工具:

🌐 New tools to generate assertions:

以下是带有断言的生成测试的示例:

🌐 Here is an example of a generated test with assertions:

page.navigate("https://playwright.nodejs.cn/");
page.getByRole(AriaRole.LINK, new Page.GetByRoleOptions().setName("Get started")).click();
assertThat(page.getByLabel("Breadcrumbs").getByRole(AriaRole.LIST)).containsText("Installation");
assertThat(page.getByLabel("Search")).isVisible();
page.getByLabel("Search").click();
page.getByPlaceholder("Search docs").fill("locator");
assertThat(page.getByPlaceholder("Search docs")).hasValue("locator");

新 API

🌐 New APIs

其他变更

🌐 Other Changes

浏览器版本

🌐 Browser Versions

  • Chromium 120.0.6099.28
  • 火狐浏览器 119.0
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 119
  • 微软 Edge 119

1.39 版本

🌐 Version 1.39

常青浏览器更新。

🌐 Evergreen browsers update.

浏览器版本

🌐 Browser Versions

  • Chromium 119.0.6045.9
  • 火狐浏览器 118.0.1
  • 网络工具包 17.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 118
  • 微软 Edge 118

1.38 版本

🌐 Version 1.38

跟踪查看器更新

🌐 Trace Viewer Updates

Playwright Trace Viewer

  1. 放大时间范围。
  2. 网络面板重新设计。

新 API

🌐 New APIs

弃用

🌐 Deprecations

浏览器版本

🌐 Browser Versions

  • Chromium 117.0.5938.62
  • 火狐浏览器 117.0
  • 网络工具包 17.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 116
  • 微软 Edge 116

1.37 版本

🌐 Version 1.37

新 API

🌐 New APIs

  • 新方法 BrowserContext.newCDPSession()Browser.newBrowserCDPSession() 分别为页面和浏览器创建一个 Chrome DevTools 协议 会话。

    CDPSession cdpSession = page.context().newCDPSession(page);
    cdpSession.send("Runtime.enable");

    JsonObject params = new JsonObject();
    params.addProperty("expression", "window.foo = 'bar'");
    cdpSession.send("Runtime.evaluate", params);

    Object foo = page.evaluate("window['foo']");
    assertEquals("bar", foo);

📚 Debian 12 Bookworm 支持

🌐 📚 Debian 12 Bookworm Support

Playwright 现在支持在 x86_64 和 arm64 上的 Debian 12 Bookworm,用于 Chromium、Firefox 和 WebKit。如果你遇到任何问题,请告知我们!

🌐 Playwright now supports Debian 12 Bookworm on both x86_64 and arm64 for Chromium, Firefox and WebKit. Let us know if you encounter any issues!

Linux 支持如下所示:

🌐 Linux support looks like this:

Ubuntu 20.04Ubuntu 22.04Debian 11Debian 12
Chromium
WebKit
Firefox

浏览器版本

🌐 Browser Versions

  • Chromium 116.0.5845.82
  • 火狐浏览器 115.0
  • 网络工具包 17.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 115
  • 微软 Edge 115

1.36 版本

🌐 Version 1.36

🏝️ 夏季维护更新。

浏览器版本

🌐 Browser Versions

  • Chromium 115.0.5790.75
  • 火狐浏览器 115.0
  • 网络工具包 17.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 114
  • 微软 Edge 114

1.35 版本

🌐 Version 1.35

高亮

🌐 Highlights

  • 方法 Page.screenshot()Locator.screenshot() 的新选项 maskColor 用于更改默认遮罩颜色。

  • 新的 uninstall CLI 命令用于卸载浏览器二进制文件:

    $ mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="uninstall" # remove browsers installed by this installation
    $ mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="uninstall --all" # remove all ever-install Playwright browsers

浏览器版本

🌐 Browser Versions

  • Chromium 115.0.5790.13
  • 火狐浏览器 113.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 114
  • 微软 Edge 114

1.34 版本

🌐 Version 1.34

高亮

🌐 Highlights

浏览器版本

🌐 Browser Versions

  • Chromium 114.0.5735.26
  • 火狐浏览器 113.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 113
  • 微软 Edge 113

1.33 版本

🌐 Version 1.33

定位器更新

🌐 Locators Update

  • 使用 Locator.or() 创建一个匹配两个定位器中任意一个的定位器。考虑这样一个场景:你想点击“新建邮件”按钮,但有时会弹出安全设置对话框。在这种情况下,你可以等待“新建邮件”按钮或对话框出现,并据此采取相应操作:

    Locator newEmail = page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("New email"));
    Locator dialog = page.getByText("Confirm security settings");
    assertThat(newEmail.or(dialog)).isVisible();
    if (dialog.isVisible())
    page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Dismiss")).click();
    newEmail.click();
  • Locator.filter() 中使用新选项 setHasNotsetHasNotText 来查找 不符合 某些条件的元素。

    Locator rowLocator = page.locator("tr");
    rowLocator
    .filter(new Locator.FilterOptions().setHasNotText("text in column 1"))
    .filter(new Locator.FilterOptions().setHasNot(
    page.getByRole(AriaRole.BUTTON,
    new Page.GetByRoleOptions().setName("column 2 button" ))))
    .screenshot();
  • 使用新的以网页为先的断言 assertThat(locator).isAttached() 来确保元素存在于页面的 DOM 中。不要将其与 assertThat(locator).isVisible() 混淆,后者确保元素既已附加又可见。

新 API

🌐 New APIs

其他亮点

🌐 Other highlights

  • 原生支持 Apple Silicon —— Playwright 现在可以无需 Rosetta 运行
  • 添加了 Ubuntu 22.04 (Jammy) Docker 镜像

⚠️ 重大变更

🌐 ⚠️ Breaking change

  • mcr.microsoft.com/playwright/java:v1.33.0 现在提供基于 Ubuntu Jammy 的 Playwright 镜像。如需使用基于 Focal 的镜像,请改用 mcr.microsoft.com/playwright/java:v1.33.0-focal

浏览器版本

🌐 Browser Versions

  • Chromium 113.0.5672.53
  • 火狐浏览器 112.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 112
  • 微软 Edge 112

1.32 版本

🌐 Version 1.32

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 112.0.5615.29
  • 火狐浏览器 111.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 111
  • 微软 Edge 111

1.31 版本

🌐 Version 1.31

新 API

🌐 New APIs

  • 新的断言 assertThat(locator).isInViewport() 确保 locator 指向的元素与视口相交,根据 交叉观察者 API

    Locator locator = page.getByRole(AriaRole.BUTTON);

    // Make sure at least some part of element intersects viewport.
    assertThat(locator).isInViewport();

    // Make sure element is fully outside of viewport.
    assertThat(locator).not().isInViewport();

    // Make sure that at least half of the element intersects viewport.
    assertThat(locator).isInViewport(new LocatorAssertions.IsInViewportOptions().setRatio(0.5));

杂项

🌐 Miscellaneous

  • 现在可以在单独的窗口中打开跟踪查看器中的 DOM 快照。
  • 方法 Route.fetch() 新增选项 setMaxRedirects
  • Playwright 现在支持 Debian 11 arm64。
  • 官方 docker 镜像 现在包含的是 Node 18,而不是 Node 16。

浏览器版本

🌐 Browser Versions

  • Chromium 111.0.5563.19
  • 火狐浏览器 109.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 110
  • 微软 Edge 110

1.30 版本

🌐 Version 1.30

浏览器版本

🌐 Browser Versions

  • Chromium 110.0.5481.38
  • 火狐浏览器 108.0.2
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 109
  • 微软 Edge 109

1.29 版本

🌐 Version 1.29

新 API

🌐 New APIs

  • 新方法 Route.fetch():

    page.route("**/api/settings", route -> {
    // Fetch original settings.
    APIResponse response = route.fetch();
    // Force settings theme to a predefined value.
    String body = response.text().replace("\"theme\":\"default\"",
    "\"theme\":\"Solorized\"");
    // Fulfill with modified data.
    route.fulfill(new Route.FulfillOptions().setResponse(response).setBody(body));
    });
  • 新方法 [Locator.all()](/api/class-locator.mdx#locator-all) 以遍历所有匹配元素:

    // Check all checkboxes!
    Locator checkboxes = page.getByRole(AriaRole.CHECKBOX);
    for (Locator checkbox : checkboxes.all())
    checkbox.check();
  • Locator.selectOption() 现在可以通过值或标签匹配:

    <select multiple>
    <option value="red">Red</option>
    <option value="green">Green</option>
    <option value="blue">Blue</option>
    </select>
    element.selectOption("Red");

浏览器版本

🌐 Browser Versions

  • Chromium 109.0.5414.46
  • 火狐浏览器 107.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 108
  • 微软 Edge 108

1.28 版本

🌐 Version 1.28

Playwright 工具

🌐 Playwright Tools

  • CodeGen 中的实时定位器。 使用“探索”工具为页面上的任何元素生成定位器。

Locator Explorer

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 108.0.5359.29
  • 火狐浏览器 106.0
  • 网络工具包 16.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 107
  • 微软 Edge 107

1.27 版本

🌐 Version 1.27

定位器

🌐 Locators

使用这些新的 API 编写定位器是一种乐趣:

🌐 With these new APIs writing locators is a joy:

page.getByLabel("User Name").fill("John");

page.getByLabel("Password").fill("secret-password");

page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Sign in")).click();

assertThat(page.getByText("Welcome, John!")).isVisible();

所有相同的方法也可以在 LocatorFrameLocatorFrame 类中使用。

🌐 All the same methods are also available on Locator, FrameLocator and Frame classes.

其他亮点

🌐 Other highlights

  • 正如在 v1.25 中宣布的,Ubuntu 18 自 2022 年 12 月起将不再受支持。此外,从下一个 Playwright 版本开始,Ubuntu 18 将不再有 WebKit 更新。

行为改变

🌐 Behavior Changes

  • assertThat(locator).hasAttribute() 的空值不再匹配缺失的属性。例如,以下代码片段在 button 没有 disabled 属性时将会成功。

    assertThat(page.getByRole(AriaRole.BUTTON)).hasAttribute("disabled", "");

浏览器版本

🌐 Browser Versions

  • Chromium 107.0.5304.18
  • 火狐浏览器 105.0.1
  • 网络工具包 16.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 106
  • 微软 Edge 106

1.26 版本

🌐 Version 1.26

断言

🌐 Assertions

其他亮点

🌐 Other highlights

  • APIRequestContext.get() 及其他方法新增选项 setMaxRedirects,用于限制重定向次数。
  • Docker 镜像现在使用 OpenJDK 17。

行为改变

🌐 Behavior Change

一堆 Playwright API 已经支持 setWaitUntil(WaitUntilState.DOMCONTENTLOADED) 选项。例如:

🌐 A bunch of Playwright APIs already support the setWaitUntil(WaitUntilState.DOMCONTENTLOADED) option. For example:

page.navigate("https://playwright.nodejs.cn", new Page.NavigateOptions().setWaitUntil(WaitUntilState.DOMCONTENTLOADED));

在 1.26 之前,这将等待所有 iframe 触发 DOMContentLoaded 事件。

🌐 Prior to 1.26, this would wait for all iframes to fire the DOMContentLoaded event.

为了符合网页规范,WaitUntilState.DOMCONTENTLOADED 值仅等待目标框架触发 'DOMContentLoaded' 事件。使用 setWaitUntil(WaitUntilState.LOAD) 来等待所有子框架。

🌐 To align with web specification, the WaitUntilState.DOMCONTENTLOADED value only waits for the target frame to fire the 'DOMContentLoaded' event. Use setWaitUntil(WaitUntilState.LOAD) to wait for all iframes.

浏览器版本

🌐 Browser Versions

  • Chromium 106.0.5249.30
  • 火狐浏览器 104.0
  • 网络工具包 16.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 105
  • 微软 Edge 105

1.25 版本

🌐 Version 1.25

新的 API 和更改

🌐 New APIs & changes

公告

🌐 Announcements

  • 🪦 这是最后一个支持 macOS 10.15 的版本(从1.21版本起不再支持)。
  • ⚠️ Ubuntu 18 已不再支持,自 2022 年 12 月起停止维护。

浏览器版本

🌐 Browser Versions

  • Chromium 105.0.5195.19
  • 火狐浏览器 103.0
  • 网络工具包 16.0

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 104
  • 微软 Edge 104

1.24 版本

🌐 Version 1.24

🐂 Debian 11 Bullseye 支持

🌐 🐂 Debian 11 Bullseye Support

Playwright 现在支持在 x86_64 上的 Debian 11 Bullseye 使用 Chromium、Firefox 和 WebKit。如果你遇到任何问题,请告诉我们!

🌐 Playwright now supports Debian 11 Bullseye on x86_64 for Chromium, Firefox and WebKit. Let us know if you encounter any issues!

Linux 支持如下所示:

🌐 Linux support looks like this:

Ubuntu 20.04Ubuntu 22.04Debian 11
Chromium
WebKit
Firefox

1.23 版本

🌐 Version 1.23

网络重播

🌐 Network Replay

现在,你可以将网络流量记录到 HAR 文件中,并在测试中重复使用此流量。

🌐 Now you can record network traffic into a HAR file and re-use this traffic in your tests.

将网络记录到 HAR 文件中:

🌐 To record network into HAR file:

mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="open --save-har=example.har --save-har-glob='**/api/**' https://example.com"

或者,你可以通过编程方式记录 HAR:

🌐 Alternatively, you can record HAR programmatically:

BrowserContext context = browser.newContext(new Browser.NewContextOptions()
.setRecordHarPath(Paths.get("example.har"))
.setRecordHarUrlFilter("**/api/**"));

// ... Perform actions ...

// Close context to ensure HAR is saved to disk.
context.close();

使用新的方法 Page.routeFromHAR()BrowserContext.routeFromHAR()HAR 文件中提供匹配的响应:

🌐 Use the new methods Page.routeFromHAR() or BrowserContext.routeFromHAR() to serve matching responses from the HAR file:

context.routeFromHAR(Paths.get("example.har"));

我们的文档中阅读更多内容。

🌐 Read more in our documentation.

高级路由

🌐 Advanced Routing

你现在可以使用 Route.fallback() 将路由延迟到其他处理程序。

🌐 You can now use Route.fallback() to defer routing to other handlers.

考虑以下示例:

🌐 Consider the following example:

// Remove a header from all requests.
page.route("**/*", route -> {
Map<String, String> headers = new HashMap<>(route.request().headers());
headers.remove("X-Secret");
route.resume(new Route.ResumeOptions().setHeaders(headers));
});

// Abort all images.
page.route("**/*", route -> {
if ("image".equals(route.request().resourceType()))
route.abort();
else
route.fallback();
});

请注意,新的方法 Page.routeFromHAR()BrowserContext.routeFromHAR() 同样参与路由,并且可以被延迟调用。

🌐 Note that the new methods Page.routeFromHAR() and BrowserContext.routeFromHAR() also participate in routing and could be deferred to.

Web 优先断言更新

🌐 Web-First Assertions Update

杂项

🌐 Miscellaneous

  • 如果有一个阻碍你的服务工作者,你现在可以通过新的上下文选项 serviceWorkers 轻松禁用它:

    BrowserContext context = browser.newContext(new Browser.NewContextOptions()
    .setServiceWorkers(ServiceWorkerPolicy.BLOCK));
  • 使用 .zip 路径作为 recordHar 上下文选项会自动压缩生成的 HAR:

    BrowserContext context = browser.newContext(new Browser.NewContextOptions()
    .setRecordHarPath(Paths.get("example.har.zip")));
  • 如果你打算手动编辑 HAR,可以考虑使用只记录重放所需信息的 "minimal" HAR 记录模式:

    BrowserContext context = browser.newContext(new Browser.NewContextOptions()
    .setRecordHarPath(Paths.get("example.har"))
    .setRecordHarMode(HarMode.MINIMAL));
  • Playwright 现在可以在 Ubuntu 22 amd64 和 Ubuntu 22 arm64 上运行。

1.22 版本

🌐 Version 1.22

高亮

🌐 Highlights

  • 角色选择器,允许通过其 ARIA 角色ARIA 属性可访问名称 来选择元素。

    // Click a button with accessible name "log in"
    page.locator("role=button[name='log in']").click();

    我们的文档中阅读更多内容。

  • 新的 Locator.filter() API 用于过滤现有的定位器

    Locator buttonsLocator = page.locator("role=button");
    // ...
    Locator submitButton = buttonsLocator.filter(new Locator.FilterOptions().setHasText("Submit"));
    submitButton.click();
  • Java 版本的 Playwright 现在支持 Ubuntu 20.04 ARM64苹果 M1。你现在可以在苹果 M1 上运行 Java 版 Playwright 测试,也可以在苹果 M1 的 Docker 中运行,或者在树莓派上运行。

1.21 版本

🌐 Version 1.21

高亮

🌐 Highlights

  • 新的角色选择器允许通过它们的 ARIA 角色ARIA 属性可访问名称 来选择元素。

    // Click a button with accessible name "log in"
    page.locator("role=button[name='log in']").click();

    我们的文档中阅读更多内容。

  • Page.screenshot() 中新增 scale 选项,可用于截取较小尺寸的截图。

  • Page.screenshot() 中新增 caret 选项,用于控制文本光标。默认值为 "hide"

行为改变

🌐 Behavior Changes

浏览器版本

🌐 Browser Versions

  • Chromium 101.0.4951.26
  • 火狐浏览器 98.0.2
  • 网络工具包 15.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 100
  • 微软 Edge 100

1.20 版本

🌐 Version 1.20

高亮

🌐 Highlights

公告

🌐 Announcements

  • v1.20 是最后一个为 macOS 10.15 Catalina 提供 WebKit 更新的版本。请更新 macOS 以继续使用最新最强大的 WebKit!

浏览器版本

🌐 Browser Versions

  • Chromium 101.0.4921.0
  • 火狐浏览器 97.0.1
  • 网络工具包 15.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 99
  • 微软 Edge 99

1.19 版本

🌐 Version 1.19

高亮

🌐 Highlights

  • Locator 现在支持一个 has 选项,可以确保它内部包含另一个定位器:

    page.locator("article", new Page.LocatorOptions().setHas(page.locator(".highlight"))).click();

    定位器文档中阅读更多内容

  • 新的 Locator.page()

  • Page.screenshot()Locator.screenshot() 现在会自动隐藏闪烁的光标

  • Playwright Codegen 现在生成定位器和帧定位器

浏览器版本

🌐 Browser Versions

  • Chromium 100.0.4863.0
  • 火狐浏览器 96.0.1
  • 网络工具包 15.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 98
  • 微软 Edge 98

1.18 版本

🌐 Version 1.18

API 测试

🌐 API Testing

Java 1.18 的 Playwright 引入了新的 API 测试,让你可以直接从 Java 向服务器发送请求!现在你可以:

🌐 Playwright for Java 1.18 introduces new API Testing that lets you send requests to the server directly from Java! Now you can:

  • 测试你的服务器 API
  • 在测试中访问 Web 应用之前准备服务器端状态
  • 在浏览器中运行某些操作后验证服务器端后置条件

要代表 Playwright 的 Page 发起请求,请使用 新的 Page.request() API:

🌐 To do a request on behalf of Playwright's Page, use new Page.request() API:

// Do a GET request on behalf of page
APIResponse res = page.request().get("http://example.com/foo.json");

在我们的API 测试指南中阅读更多内容。

🌐 Read more about it in our API testing guide.

Web 优先断言

🌐 Web-First Assertions

Java 1.18 的 Playwright 引入了 Web-First 断言

🌐 Playwright for Java 1.18 introduces Web-First Assertions.

考虑以下示例:

🌐 Consider the following example:

import static com.microsoft.playwright.assertions.PlaywrightAssertions.assertThat;

public class TestExample {
@Test
void statusBecomesSubmitted() {
// ...
page.locator("#submit-button").click();
assertThat(page.locator(".status")).hasText("Submitted");
}
}

Playwright 将会使用选择器 .status 重新测试节点,直到获取的节点包含 "Submitted" 文本。它会反复重新获取节点并进行检查,直到满足条件或达到超时时间。你可以将此超时作为一个选项传入。

🌐 Playwright will be re-testing the node with the selector .status until fetched Node has the "Submitted" text. It will be re-fetching the node and checking it over and over, until the condition is met or until the timeout is reached. You can pass this timeout as an option.

我们的文档中阅读更多内容。

🌐 Read more in our documentation.

定位器改进

🌐 Locator Improvements

  • Locator.dragTo()

  • 现在可以选择通过每个定位器包含的文本来过滤每个定位器:

    page.locator("li", new Page.LocatorOptions().setHasText("my item"))
    .locator("button").click();

    定位器文档中阅读更多内容

跟踪改进

🌐 Tracing Improvements

Tracing 现在可以将 Java 源代码嵌入到已记录的追踪中,使用新的 setSources 选项。

tracing-java-sources

新的 API 和更改

🌐 New APIs & changes

浏览器版本

🌐 Browser Versions

  • Chromium 99.0.4812.0
  • 火狐浏览器 95.0
  • 网络工具包 15.4

该版本还针对以下稳定渠道进行了测试:

🌐 This version was also tested against the following stable channels:

  • 谷歌浏览器 97
  • 微软 Edge 97

1.17 版本

🌐 Version 1.17

框架定位器

🌐 Frame Locators

Playwright 1.17 引入了 frame locators——页面中 iframe 的定位器。框架定位器包含足够的逻辑来获取 iframe,然后在该 iframe 中定位元素。框架定位器默认是严格的,会等待 iframe 出现,并且可以用于 Web-First 断言。

🌐 Playwright 1.17 introduces frame locators - a locator to the iframe on the page. Frame locators capture the logic sufficient to retrieve the iframe and then locate elements in that iframe. Frame locators are strict by default, will wait for iframe to appear and can be used in Web-First assertions.

Graphics

框架定位器可以通过 Page.frameLocator()Locator.frameLocator() 方法创建。

🌐 Frame locators can be created with either Page.frameLocator() or Locator.frameLocator() method.

Locator locator = page.frameLocator("#my-frame").locator("text=Submit");
locator.click();

查看更多内容请访问 我们的文档

🌐 Read more at our documentation.

跟踪查看器更新

🌐 Trace Viewer Update

Playwright Trace Viewer 现在可以在 https://trace.playwright.dev 在线使用!只需将你的 trace.zip 文件拖放到页面上即可查看其内容。

🌐 Playwright Trace Viewer is now available online at https://trace.playwright.dev! Just drag-and-drop your trace.zip file to inspect its contents.

注意:跟踪文件不会被上传到任何地方;trace.playwright.dev 是一个渐进式网络应用,在本地处理跟踪。

  • Playwright 测试跟踪现在默认包括源(可以使用跟踪选项关闭这些源)
  • 跟踪查看器现在显示测试名称
  • 包含浏览器详细信息的新跟踪元数据选项卡
  • 快照现在有 URL 栏

image

HTML 报告更新

🌐 HTML Report Update

  • HTML 报告现在支持动态过滤
  • 报告现在是一个单一的静态 HTML 文件,可以通过电子邮件发送或作为 Slack 附件发送。

image

Ubuntu ARM64 支持及更多

🌐 Ubuntu ARM64 support + more

  • Playwright 现在支持 Ubuntu 20.04 ARM64。你现在可以在 Apple M1 和树莓派上通过 Docker 运行 Playwright 测试。

  • 你现在可以使用 Playwright 在 Linux 上安装稳定版本的 Edge:

    mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="install msedge"

新 API

🌐 New APIs

  • 追踪现在支持 'title' 选项
  • 页面导航支持新的 'commit' 等待选项

1.16 版本

🌐 Version 1.16

🎭 Playwright库

🌐 🎭 Playwright Library

Locator.waitFor

等待定位符解析为具有特定状态的单一元素。默认为“state: 'visible'”。

🌐 Wait for a locator to resolve to a single element with a given state. Defaults to the state: 'visible'.

Locator orderSent = page.locator("#order-sent");
orderSent.waitFor();

阅读更多关于 Locator.waitFor() 的内容。

🌐 Read more about Locator.waitFor().

🎭 Playwright追踪器

🌐 🎭 Playwright Trace Viewer

  • 使用 mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="show-trace" 运行跟踪查看器,并将跟踪文件拖到跟踪查看器 PWA 中
  • 更好地对行动目标进行视觉归因

查看更多关于 Trace Viewer 的信息。

🌐 Read more about Trace Viewer.

浏览器版本

🌐 Browser Versions

  • Chromium 97.0.4666.0
  • 火狐浏览器 93.0
  • 网络工具包 15.4

此版本的 Playwright 还针对以下稳定通道进行了测试:

🌐 This version of Playwright was also tested against the following stable channels:

  • 谷歌浏览器 94
  • 微软 Edge 94

1.15 版本

🌐 Version 1.15

🖱️ 鼠标滚轮

🌐 🖱️ Mouse Wheel

通过使用 Mouse.wheel(),你现在可以进行垂直或水平滚动。

🌐 By using Mouse.wheel() you are now able to scroll vertically or horizontally.

📜 新的 Headers API

🌐 📜 New Headers API

之前无法获取响应的多个头部值。现在可以做到这一点,并且提供了额外的辅助函数:

🌐 Previously it was not possible to get multiple header values of a response. This is now possible and additional helper functions are available:

🌈 强制颜色模拟

🌐 🌈 Forced-Colors emulation

现在可以通过在 Browser.newContext() 中传入 forced-colors CSS 媒体特性或调用 Page.emulateMedia() 来模拟它。

🌐 Its now possible to emulate the forced-colors CSS media feature by passing it in the Browser.newContext() or calling Page.emulateMedia().

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 96.0.4641.0
  • 火狐浏览器 92.0
  • 网络工具包 15.0

1.14 版本

🌐 Version 1.14

⚡️ 新的“严格”模式

🌐 ⚡️ New "strict" mode

选择器歧义是自动化测试中常见的问题。“严格”模式确保你的选择器指向单个元素,否则会抛出异常。

🌐 Selector ambiguity is a common problem in automation testing. "strict" mode ensures that your selector points to a single element and throws otherwise.

在你的操作调用中设置 setStrict(true) 以选择加入。

🌐 Set setStrict(true) in your action calls to opt in.

// This will throw if you have more than one button!
page.click("button", new Page.ClickOptions().setStrict(true));

📍 新 定位器 API

🌐 📍 New Locators API

定位器表示页面上元素的视图。它包含足够的逻辑来在任何给定时刻获取该元素。

🌐 Locator represents a view to the element(s) on the page. It captures the logic sufficient to retrieve the element at any given moment.

LocatorElementHandle 的区别在于,后者指向特定的元素,而 Locator 捕捉的是如何获取该元素的逻辑。

🌐 The difference between the Locator and ElementHandle is that the latter points to a particular element, while Locator captures the logic of how to retrieve that element.

另外,定位器默认是**“严格”**的!

🌐 Also, locators are "strict" by default!

Locator locator = page.locator("button");
locator.click();

文档中了解更多信息。

🌐 Learn more in the documentation.

🧩 实验性 ReactVue 选择器引擎

🌐 🧩 Experimental React and Vue selector engines

React 和 Vue 选择器允许通过组件名称和/或属性值来选择元素。其语法与属性选择器非常相似,并且支持所有属性选择器操作符。

🌐 React and Vue selectors allow selecting elements by its component name and/or property values. The syntax is very similar to attribute selectors and supports all attribute selector operators.

page.locator("_react=SubmitButton[enabled=true]").click();
page.locator("_vue=submit-button[enabled=true]").click();

React 选择器文档Vue 选择器文档中了解更多信息。

🌐 Learn more in the react selectors documentation and the vue selectors documentation.

✨ 新的 nthvisible 选择器引擎

🌐 ✨ New nth and visible selector engines

  • nth 选择器引擎相当于 :nth-match 伪类,但可以与其他选择器引擎组合使用。
  • visible 选择器引擎相当于 :visible 伪类,但可以与其他选择器引擎组合使用。
// select the first button among all buttons
button.click("button >> nth=0");
// or if you are using locators, you can use first(), nth() and last()
page.locator("button").first().click();

// click a visible button
button.click("button >> visible=true");

浏览器版本

🌐 Browser Versions

  • Chromium 94.0.4595.0
  • 火狐浏览器 91.0
  • 网络工具包 15.0

1.13 版本

🌐 Version 1.13

Playwright

  • 🖖 通过 Page.dragAndDrop() API 提供的可编程拖放支持
  • 🔎 增强型 HAR,包含请求和响应的体积信息。可通过在 Browser.newContext() 中使用 recordHar 选项来使用。

工具

🌐 Tools

  • Playwright跟踪查看器现在显示参数、返回值和 console.log() 调用。

新的和大修的指南

🌐 New and Overhauled Guides

浏览器版本

🌐 Browser Versions

  • Chromium 93.0.4576.0
  • 火狐浏览器 90.0
  • 网络工具包 14.2

新 Playwright API

🌐 New Playwright APIs

1.12 版本

🌐 Version 1.12

🧟‍♂️ 推出 Playwright 跟踪查看器

🌐 🧟‍♂️ Introducing Playwright Trace Viewer

Playwright Trace Viewer 是一个新的图形界面工具,可帮助在脚本运行后探索已记录的 Playwright 跟踪。Playwright 跟踪让你可以检查:

  • 每个 Playwright 操作之前和之后的页面 DOM
  • 每个 Playwright 操作之前和之后的页面渲染
  • 脚本执行期间的浏览器网络

可以使用新的 BrowserContext.tracing() API 记录跟踪:

🌐 Traces are recorded using the new BrowserContext.tracing() API:

Browser browser = playwright.chromium().launch();
BrowserContext context = browser.newContext();

// Start tracing before creating / navigating a page.
context.tracing().start(new Tracing.StartOptions()
.setScreenshots(true)
.setSnapshots(true));

Page page = context.newPage();
page.navigate("https://playwright.nodejs.cn");

// Stop tracing and export it into a zip archive.
context.tracing().stop(new Tracing.StopOptions()
.setPath(Paths.get("trace.zip")));

稍后使用 Playwright CLI 检查痕迹:

🌐 Traces are examined later with the Playwright CLI:

mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="show-trace trace.zip"

这将打开以下 GUI:

🌐 That will open the following GUI:

image

👉 在 追踪查看器文档 中阅读更多内容。

浏览器版本

🌐 Browser Versions

  • Chromium 93.0.4530.0
  • 火狐浏览器 89.0
  • 网络工具包 14.2

此版本的 Playwright 还针对以下稳定通道进行了测试:

🌐 This version of Playwright was also tested against the following stable channels:

  • 谷歌浏览器 91
  • 微软 Edge 91

新 API

🌐 New APIs

1.11 版本

🌐 Version 1.11

🎥 新视频:Playwright:面向现代网页的新测试自动化框架 (幻灯片)

  • 我们谈论了 Playwright
  • 展示了幕后的工程工作
  • 展示了带有新功能的实时演示 ✨
  • 特别感谢 applitools 举办此次活动并邀请我们!

浏览器版本

🌐 Browser Versions

  • Chromium 92.0.4498.0
  • 火狐浏览器 89.0b6
  • 网络工具包 14.2

新 API

🌐 New APIs

1.10 版本

🌐 Version 1.10

  • Java 版 Playwright v1.10 现已稳定!
  • 使用 新渠道 APIGoogle ChromeMicrosoft Edge 稳定版通道上运行 Playwright。
  • Chromium 在 Mac 和 Windows 上截屏非常快速

打包的浏览器版本

🌐 Bundled Browser Versions

  • Chromium 90.0.4430.0
  • 火狐浏览器 87.0b10
  • 网络工具包 14.2

此版本的 Playwright 还针对以下稳定通道进行了测试:

🌐 This version of Playwright was also tested against the following stable channels:

  • 谷歌浏览器 89
  • 微软 Edge 89

新 API

🌐 New APIs

1.9 版本

🌐 Version 1.9

  • Playwright Inspector 是一个用于编写和调试测试的新图形界面工具
    • 逐行调试你的 Playwright 脚本,支持播放、暂停和逐步执行。
    • 通过记录用户操作来编写新脚本。
    • 通过悬停在元素上为你的脚本生成元素选择器。
    • 设置 PWDEBUG=1 环境变量以启动检查器
  • 暂停脚本执行 使用 Page.pause() 在有界面模式下。暂停页面会启动 Playwright Inspector 进行调试。
  • 新的 has-text 伪类 用于 CSS 选择器。:has-text("example") 匹配任何在其内部(可能在子元素或后代元素中)包含 "example" 的元素。查看 更多示例
  • 页面对话框现在在执行期间会自动关闭,除非配置了 dialog 事件的监听器。了解更多
  • Python 的 Playwright 现已稳定,提供符合习惯的蛇形命名 API,并提供预构建的 Docker 镜像 用于在 CI/CD 中运行测试。

浏览器版本

🌐 Browser Versions

  • Chromium 90.0.4421.0
  • 火狐浏览器 86.0b10
  • 网络工具包 14.1

新 API

🌐 New APIs

1.8 版本

🌐 Version 1.8

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 90.0.4392.0
  • 火狐浏览器 85.0b5
  • 网络工具包 14.1

1.7 版本

🌐 Version 1.7

  • 新的 Java SDKPlaywright for Java 现在与 JavaScriptPython.NET 绑定 相当。
  • 浏览器存储 API:新的便捷 API,用于保存和加载浏览器存储状态(Cookie、本地存储),以简化带有身份验证的自动化场景。
  • 新的 CSS 选择器:我们收到了你对更灵活选择器的反馈,因此重新设计了选择器的实现。Playwright 1.7 引入了新的 CSS 扩展,并且未来还会有更多更新。
  • 新网站:位于 playwright.dev 的文档网站已更新,现在使用 Docusaurus 构建。
  • 支持 Apple Silicon:WebKit 和 Chromium 的 Playwright 浏览器二进制文件现在已为 Apple Silicon 构建。

新 API

🌐 New APIs

浏览器版本

🌐 Browser Versions

  • Chromium 89.0.4344.0
  • 火狐浏览器 84.0b9
  • 网络工具包 14.1