Skip to main content

生成测试

介绍​

¥Introduction

Playwright 可以自动生成测试，从而快速开始测试。Codegen 会打开一个浏览器窗口进行交互，并打开 Playwright 检查器来记录、复制和管理你生成的测试。

¥Playwright can generate tests automatically, providing a quick way to get started with testing. Codegen opens a browser window for interaction and the Playwright Inspector for recording, copying, and managing your generated tests.

你将学习

¥You will learn

运行代码生成器​

¥Running Codegen

使用 codegen 命令运行测试生成器，后跟要为其生成测试的网站的 URL。URL 是可选的，如果省略，可以直接在浏览器窗口中添加。

¥Use the codegen command to run the test generator followed by the URL of the website you want to generate tests for. The URL is optional and can be added directly in the browser window if omitted.

mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="codegen demo.playwright.dev/todomvc"

记录测试​

¥Recording a test

运行 codegen 并在浏览器中执行操作。Playwright 会自动生成你的交互代码。Codegen 会分析渲染的页面并推荐最佳定位器，优先考虑角色、文本和测试 ID 定位器。当多个元素与一个定位器匹配时，生成器会对其进行改进，以唯一地标识目标元素，从而减少测试失败和不稳定性。

¥Run codegen and perform actions in the browser. Playwright generates code for your interactions automatically. Codegen analyzes the rendered page and recommends the best locator, prioritizing role, text, and test id locators. When multiple elements match a locator, the generator improves it to uniquely identify the target element, reducing test failures and flakiness.

使用测试生成器，你可以记录：

¥With the test generator you can record:

  • 通过与页面交互执行单击或填充等操作

    ¥Actions like click or fill by interacting with the page

  • 通过点击工具栏图标，然后点击要断言的页面元素来执行断言。你可以选择：

    ¥Assertions by clicking a toolbar icon, then clicking a page element to assert against. You can choose:

    • 'assert visibility' 断言元素可见

      ¥'assert visibility' to assert that an element is visible

    • 'assert text' 断言元素包含特定文本

      ¥'assert text' to assert that an element contains specific text

    • 'assert value' 断言某个元素具有特定值

      ¥'assert value' to assert that an element has a specific value

完成与页面的交互后，按 'record' 按钮停止录制，然后使用 'copy' 按钮将生成的代码复制到编辑器。

¥When you finish interacting with the page, press the 'record' button to stop recording and use the 'copy' button to copy the generated code to your editor.

使用 'clear' 按钮清除代码并重新开始录制。完成后，关闭 Playwright 检查器窗口或停止终端命令。

¥Use the 'clear' button to clear the code and start recording again. Once finished, close the Playwright Inspector window or stop the terminal command.

要了解有关生成测试的更多信息，请查看我们关于 代码生成器 的详细指南。

¥To learn more about generating tests, check out our detailed guide on Codegen.

生成定位器​

¥Generating locators

你可以使用测试生成器生成 locators。

¥You can generate locators with the test generator.

  • 按下 'Record' 按钮停止录制，此时会显示 'Pick Locator' 按钮。

    ¥Press the 'Record' button to stop recording and the 'Pick Locator' button will appear

  • 点击 'Pick Locator' 按钮，并将鼠标悬停在浏览器窗口中的元素上，即可看到每个元素下方高亮的定位器。

    ¥Click the 'Pick Locator' button and hover over elements in the browser window to see the locator highlighted underneath each element

  • 点击你要定位的元素，该定位器的代码将显示在“选择定位器”按钮旁边的定位器演示区中。

    ¥Click the element you want to locate and the code for that locator will appear in the locator playground next to the Pick Locator button

  • 在定位器测试区中编辑定位器进行微调，并在浏览器窗口中查看高亮显示的匹配元素

    ¥Edit the locator in the locator playground to fine-tune it and see the matching element highlighted in the browser window

  • 使用“复制”按钮复制定位器并将其粘贴到你的代码中。

    ¥Use the copy button to copy the locator and paste it into your code

模拟​

¥Emulation

你可以使用模拟为特定的视口、设备、配色方案、地理位置、语言或时区生成测试。测试生成器还可以保留已验证的状态。查看 测试生成器 指南以了解更多信息。

¥You can generate tests using emulation for specific viewports, devices, color schemes, geolocation, language, or timezone. The test generator can also preserve authenticated state. Check out the Test Generator guide to learn more.

下一步是什么​

¥What's Next