Playwright 使用指南-2

最新推荐文章于 2024-03-19 01:02:16 发布
最新推荐文章于 2024-03-19 01:02:16 发布
阅读量3.8k 收藏 18
点赞数 7
分类专栏： Python基础 # Python接口测试框架 文章标签： python playwright
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u014096024/article/details/126891086
版权

Playwright 使用指南，Playwright 入门介绍 请参考另一篇博客

此博客为官方文档译文 希望读者可以快速了解 Playwriht 可以用来做什么，怎么用。有些专业名词可能翻译不准确哈

文章目录

Playwrigh 使用指南-1

1 Auto-waiting 自动等待

Playwright 在执行操作之前对元素执行一系列可操作性检查，以确保这些操作按预期运行。它会自动等待所有相关检查通过，然后才执行请求的操作。如果所需的检查未在给定范围内通过timeout，则操作失败并显示TimeoutError.

例如，对于[page.click(selector, **kwargs)]，Playwright 将确保：

  • 元素Attached 附加到 DOM
  • 元素Visible 可见
  • 元素是Stable 稳定的，就像没有动画或完成动画一样
  • 元素 Receives Events 接收事件，因为没有被其他元素遮挡
  • 元素已 Enabled 启用

以下是为每个操作执行的可操作性检查的完整列表：

ActionAttachedVisibleStableReceives EventsEnabledEditable
checkYesYesYesYesYes-
clickYesYesYesYesYes-
dblclickYesYesYesYesYes-
setCheckedYesYesYesYesYes-
tapYesYesYesYesYes-
uncheckYesYesYesYesYes-
hoverYesYesYesYes--
scrollIntoViewIfNeededYes-Yes---
screenshotYesYesYes---
fillYesYes--YesYes
selectTextYesYes----
dispatchEventYes-----
focusYes-----
getAttributeYes-----
innerTextYes-----
innerHTMLYes-----
pressYes-----
setInputFilesYes-----
selectOptionYesYes--Yes-
textContentYes-----
typeYes-----

Forcing actions 强制行为

page.click(selector, **kwargs)等一些操作支持force禁用非必要可操作性检查的选项，例如将真值传递force给page.click(selector, **kwargs)方法不会检查目标元素是否实际接收到点击事件.

Attached

当元素连接到 Document 或 ShadowRoot时，它被认为是附加的。

Visible

当元素具有非空边界框并且没有visibility:hidden计算样式时，元素被认为是可见的。请注意，大小为零或 with 的元素display:none不被视为可见。

Stable

当元素在至少两个连续的动画帧中保持相同的边界框时，元素被认为是稳定的。

Enabled

元素被视为已启用，除非它是<button>、或具有属性。<select>``<input>``<textarea>``disabled

Editable

当元素被启用并且没有readonly设置属性时，它被认为是可编辑的。

Receives Events 接收事件

  • 当元素在动作点是指针事件的命中目标时，被认为接收指针事件。例如，当点击 点时(10;10)，Playwright 会检查是否有其他元素（通常是叠加层）会捕获点击点(10;10)。

    例如，考虑一个场景，Sign Up无论何时调用page.click(selector, **kwargs)，Playwright 都会点击按钮：

    • 页面正在检查用户名是否唯一且Sign Up按钮已禁用；
    • 在与服务器核对后，禁用的Sign Up按钮将替换为另一个现在启用的按钮。

2 API testing API 测试

Playwright 可用于访问应用程序的 REST API。

有时您可能希望直接从 Python 向服务器发送请求，而无需加载页面并在其中运行 js 代码。它可能会派上用场的几个例子：

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

所有这些都可以通过APIRequestContext方法来实现。

以下示例依赖于pytest-playwright将 Playwright 固定装置添加到 Pytest 测试运行器的包。

  • 编写 API 测试
  • 通过 API 调用准备服务器状态
  • 运行用户操作后检查服务器状态
  • 重用认证状态

2.1 Writing API Test 编写 API测试

APIRequestContext可以通过网络发送各种 HTTP(S) 请求。

以下示例演示了如何使用 Playwright 通过GitHub API测试问题创建。测试套件将执行以下操作：

  • 在运行测试之前创建一个新的存储库。
  • 创建一些问题并验证服务器状态。
  • 运行测试后删除存储库。

2.1.1 Configure 配置

GitHub API 需要授权，因此我们将为所有测试配置一次令牌。在此期间，我们还将设置baseURL以简化测试。

import os
from typing import Generator

import pytest
from playwright.sync_api import Playwright, APIRequestContext

GITHUB_API_TOKEN = os.getenv("GITHUB_API_TOKEN")
assert GITHUB_API_TOKEN, "GITHUB_API_TOKEN is not set"


@pytest.fixture(scope="session")
def api_request_context(
    playwright: Playwright,
) -> Generator[APIRequestContext, None, None]:
    headers = {
        # We set this header per GitHub guidelines.
        "Accept": "application/vnd.github.v3+json",
        # Add authorization token to all requests.
        # Assuming personal access token available in the environment.
        "Authorization": f"token {GITHUB_API_TOKEN}",
    }
    request_context = playwright.request.new_context(
        base_url="https://api.github.com", extra_http_headers=headers
    )
    yield request_context
    request_context.dispose()

2.1.2 Write tests 编写测试

现在我们初始化了请求对象，我们可以添加一些测试，这些测试将在存储库中创建新问题。

import os
from typing import Generator

import pytest
from playwright.sync_api import Playwright, APIRequestContext

GITHUB_API_TOKEN = os.getenv("GITHUB_API_TOKEN")
assert GITHUB_API_TOKEN, "GITHUB_API_TOKEN is not set"

GITHUB_USER = os.getenv("GITHUB_USER")
assert GITHUB_USER, "GITHUB_USER is not set"

GITHUB_REPO = "test"

# ...

def test_should_create_bug_report(api_request_context: APIRequestContext) -> None:
    data = {
        "title": "[Bug] report 1",
        "body": "Bug description",
    }
    new_issue = api_request_context.post(f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues", data=data)
    assert new_issue.ok

    issues = api_request_context.get(f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues")
    assert issues.ok
    issues_response = issues.json()
    issue = list(filter(lambda issue: issue["title"] == "[Bug] report 1", issues_response))[0]
    assert issue
    assert issue["body"] == "Bug description"

def test_should_create_feature_request(api_request_context: APIRequestContext) -> None:
    data = {
        "title": "[Feature] request 1",
        "body": "Feature description",
    }
    new_issue = api_request_context.post(f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues", data=data)
    assert new_issue.ok

    issues = api_request_context.get(f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues")
    assert issues.ok
    issues_response = issues.json()
    issue = list(filter(lambda issue: issue["title"] == "[Feature] request 1", issues_response))[0]
    assert issue
    assert issue["body"] == "Feature description"

2.1.3 Setup and teardown 安装和拆卸

这些测试假定存储库存在。您可能希望在运行测试之前创建一个新的，然后再将其删除。为此使用会话夹具。之前的部分yield是之前的部分，之后的部分是之后的部分。

# ...
@pytest.fixture(scope="session", autouse=True)
def create_test_repository(
    api_request_context: APIRequestContext,
) -> Generator[None, None, None]:
    # Before all
    new_repo = api_request_context.post("/user/repos", data={"name": GITHUB_REPO})
    assert new_repo.ok
    yield
    # After all
    deleted_repo = api_request_context.delete(f"/repos/{GITHUB_USER}/{GITHUB_REPO}")
    assert deleted_repo.ok

2.1.4 Complete test example 完整的测试示例

以下是 API 测试的完整示例：

from enum import auto
import os
from typing import Generator

import pytest
from playwright.sync_api import Playwright, Page, APIRequestContext, expect

GITHUB_API_TOKEN = os.getenv("GITHUB_API_TOKEN")
assert GITHUB_API_TOKEN, "GITHUB_API_TOKEN is not set"

GITHUB_USER = os.getenv("GITHUB_USER")
assert GITHUB_USER, "GITHUB_USER is not set"

GITHUB_REPO = "test"


@pytest.fixture(scope="session")
def api_request_context(
    playwright: Playwright,
) -> Generator[APIRequestContext, None, None]:
    headers = {
        # We set this header per GitHub guidelines.
        "Accept": "application/vnd.github.v3+json",
        # Add authorization token to all requests.
        # Assuming personal access token available in the environment.
        "Authorization": f"token {GITHUB_API_TOKEN}",
    }
    request_context = playwright.request.new_context(
        base_url="https://api.github.com", extra_http_headers=headers
    )
    yield request_context
    request_context.dispose()


@pytest.fixture(scope="session", autouse=True)
def create_test_repository(
    api_request_context: APIRequestContext,
) -> Generator[None, None, None]:
    # Before all
    new_repo = api_request_context.post("/user/repos", data={"name": GITHUB_REPO})
    assert new_repo.ok
    yield
    # After all
    deleted_repo = api_request_context.delete(f"/repos/{GITHUB_USER}/{GITHUB_REPO}")
    assert deleted_repo.ok


def test_should_create_bug_report(api_request_context: APIRequestContext) -> None:
    data = {
        "title": "[Bug] report 1",
        "body": "Bug description",
    }
    new_issue = api_request_context.post(
        f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues", data=data
    )
    assert new_issue.ok

    issues = api_request_context.get(f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues")
    assert issues.ok
    issues_response = issues.json()
    issue = list(
        filter(lambda issue: issue["title"] == "[Bug] report 1", issues_response)
    )[0]
    assert issue
    assert issue["body"] == "Bug description"


def test_should_create_feature_request(api_request_context: APIRequestContext) -> None:
    data = {
        "title": "[Feature] request 1",
        "body": "Feature description",
    }
    new_issue = api_request_context.post(
        f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues", data=data
    )
    assert new_issue.ok

    issues = api_request_context.get(f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues")
    assert issues.ok
    issues_response = issues.json()
    issue = list(
        filter(lambda issue: issue["title"] == "[Feature] request 1", issues_response)
    )[0]
    assert issue
    assert issue["body"] == "Feature description"

2.2 Prepare server state via API calls 通过API调用准备服务器状态

以下测试通过 API 创建一个新问题，然后导航到项目中所有问题的列表以检查它是否出现在列表顶部。使用LocatorAssertions执行检查。

def test_last_created_issue_should_be_first_in_the_list(api_request_context: APIRequestContext, page: Page) -> None:
    def create_issue(title: str) -> None:
        data = {
            "title": title,
            "body": "Feature description",
        }
        new_issue = api_request_context.post(
            f"/repos/{GITHUB_USER}/{GITHUB_REPO}/issues", data=data
        )
        assert new_issue.ok
    create_issue("[Feature] request 1")
    create_issue("[Feature] request 2")
    page.goto(f"https://github.com/{GITHUB_USER}/{GITHUB_REPO}/issues")
    first_issue = page.locator("a[data-hovercard-type='issue']").first
    expect(first_issue).to_have_text("[Feature] request 2")

2.3 Check the server state after running user actions 运行用户操作后检查服务器状态

以下测试通过浏览器中的用户界面创建一个新问题，然后通过 API 检查它是否已创建：

def test_last_created_issue_should_be_on_the_server(api_request_context: APIRequestContext, page: Page) -> None:
    page.goto(f"https://github.com/{GITHUB_USER}/{GITHUB_REPO}/issues")
    page.locator("text=New issue").click()
    page.locator("[aria-label='Title']").fill("Bug report 1")
    page.locator("[aria-label='Comment body']").fill("Bug description")
    page.locator("text=Submit new issue").click()
    issue_id = page.url.split("/")[-1]

    new_issue = api_request_context.get(f"https://github.com/{GITHUB_USER}/{GITHUB_REPO}/issues/{issue_id}")
    assert new_issue.ok
    assert new_issue.json()["title"] == "[Bug] report 1"
    assert new_issue.json()["body"] == "Bug description"

2.4 Reuse authentication state 重用的认证状态

Web 应用程序使用基于 cookie 或基于令牌的身份验证，其中经过身份验证的状态存储为cookie。Playwright 提供了api_request_context.storage_state(**kwargs)方法，该方法可用于从经过身份验证的上下文中检索存储状态，然后使用该状态创建新的上下文。

存储状态在BrowserContext和APIRequestContext之间是可互换的。您可以使用它通过 API 调用登录，然后使用已有的 cookie 创建新的上下文。以下代码片段从经过身份验证的APIRequestContext 中检索状态，并使用该状态创建一个新的BrowserContext。

request_context = playwright.request.new_context(http_credentials={"username": "test", "password": "test"})
request_context.get("https://api.example.com/login")
# Save storage state into a variable.
state = request_context.storage_state()

# Create a new context with the saved storage state.
context = browser.new_context(storage_state=state)

3. Assertions 断言

Playwright 为您提供了 Web-First Assertions 以及方便的方法来创建断言，这些断言将等待并重试，直到满足预期的条件。

考虑以下示例：

同步

from playwright.sync_api import Page, expect

def test_status_becomes_submitted(page: Page) -> None:
    # ..
    page.locator("#submit-button").click()
    expect(page.locator(".status")).to_have_text("Submitted")

异步

from playwright.async_api import Page, expect

async def test_status_becomes_submitted(page: Page) -> None:
    # ..
    await page.locator("#submit-button").click()
    await expect(page.locator(".status")).to_have_text("Submitted")

Playwright 将使用选择器重新测试节点，.status直到获取的节点具有"Submitted"文本。它将重新获取节点并一遍又一遍地检查它，直到满足条件或达到超时。您可以将此超时作为选项传递。

默认情况下，断言超时设置为 5 秒。

详细使用请参考官方文档

度假的小鱼
关注
  • 7
    点赞
  • 踩
  • 18
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 9
    评论
专栏目录
Python + Playwright（4）： 等待元素至指定状态
blues_C的博客
04-19 6306
下面我将介绍playwright的三种常用的元素等待方式：wait_for(), wait_for_selector(), 和 wait_for_element_state()，以及三者之间的优劣势。
playwrigh个人笔记一、入门简单录制
余墨的博客
04-02 1831
playwrigh个人笔记一、入门简单录制1、playwright介绍2、在线安装3、录制 在公众号上面看到微软开源了一个项目叫【playwright-python】,进行简单操作使用，使用录制功能，记录如下： 开源项目地址：https://github.com/microsoft/playwright-python 1、playwright介绍 详情查看playwright指南 基本对所有浏览器支撑，支持跨平台（windows，Linux，macos）不支持旧版edge和ie11 测试手机，在移动we
Playwrigh(python)微软浏览器自动化教程（一）
weixin_44043378的博客
09-01 736
1、简介 Playwright 支持大部分的语言，Node.js, python, Java, .Net, 并且支持谷歌，火狐等浏览器，跨平台，并且支持移动端的模拟，可以很方便的录制脚本。 并且可以使用同步或异步的打开方式。我们先从同步开始。 2、快速开始 2.1、安装 PIP pip install --upgrade pip pip install playwright playwright install 2.2、录制脚本 推荐新手首先使用提供的录制功能，自己录制一个脚本，然后对着生成的代码，这样会
Playwright 入门介绍和使用指南
感谢关注-最近在编写开源的自动化测试框架还没整理完
09-16 1298
Playwright 入门介绍， Playwright 是专门为满足端到端测试的需求而创建的。Playwright 支持所有现代渲染引擎
不用写一行代码！Python最强自动化神器Playwright！
xxue345678的博客
11-20 9992
Playwright是什么？来自ChatGPT回答：Playwright是跨语言支持的，支持Python、Java、Node.js、.NET使用场景：自动化测试工程师，可用于Web开发中的各种自动化测试；爬虫工程师，当接口中有加密参数（包括url加密参数、请求头加密参数、cookie加密参数）或者返回数据也是经过加密的，如果加密逻辑太过复杂暂时无法找出，我们可采用自动化的方式获取经过网站渲染过的源码，抓取需要的数据即可；
《最新出炉》系列初窥篇-Python+Playwright自动化测试-4-playwright等待浅析
北京-宏哥的博客
12-29 1277
在介绍selenium的时候，宏哥也介绍过等待，是因为在某些元素出现后，才可以进行操作。有时候我们自己忘记添加等待时间后，查了半天代码确定就是没有问题，奇怪的就是获取不到元素。然后搞了好久，或者经过别人的提示才恍然大悟没有添加等待时间。而playwright为了避免我们犯这么low的错误，它对元素执行操作前，会进行一系列可操作性检查，以确保这些行动按预期运行。它会自动等待所有相关检查通过，然后才执行请求的操作。如果所需的检查未在给定的范围内通过则抛出timeout，操作将失败并显示TimeoutError。
playwright-browserstack-源码
04-20
本指南将引导您完成在BrowserStack上运行样本Playwright测试的过程，然后继续在私有网站上运行测试，并显示跨浏览器的测试并行运行以加快构建执行速度。先决条件您需要BrowserStack凭据才能运行Playwright测试，...
playwright-sharp-auth0
03-30
该测试验证 Quickstart指南的是否正常运行，并且指向示例代码所在的GitHub存储库的链接是正确的。 为了运行测试，项目使用 。 所需技术 平台：.NET Core 编程语言：C＃ Nuget软件包：Playwright Sharp，NUnit 怎么...
jhipster-playwright-blog-sample:用于https的示例项目的存储库
03-22
综上所述，这个项目为Java开发者提供了一个实践指南，演示了如何在JHipster项目中整合Playwright，进行HTTPS安全通信的测试和自动化。通过深入研究和运行这个示例，开发者可以提升其在JHipster框架下进行Web自动化...
深入探索Python Playwright自动化UI测试框架源码
最新发布
03-25
- Markdown文档（.md）：1个，提供项目说明、使用指南或学习笔记。 - 配置文件（.ini）：1个，用于设置测试环境参数。 - 文本文件（.txt）：1个，可能包含日志输出或附加说明。 - 批处理文件（.bat）：1个，Windows...
theheadless.dev::military_helmet:学习木偶和剧作家-战the中的提示，技巧和深入指南
03-31
:vulcan_salute: 嗨，这是包含所有内容，代码示例和VuePress网站的仓库，这些内容构成了 ，这是一个社区驱动的知识库，用于通过Puppeteer和Playwright学习无头...这段代码使用了部分插件和来自Vue社区的弹出主题：
playwright中的wait_until的四种选项
小龙在线
05-06 2201
networkidle”：等待网络空闲，即没有正在进行的网络请求或者网络请求数量低于指定的阈值。“timeout”：等待指定的时间，如果在指定时间内没有完成指定的条件，则抛出超时异常。“domcontentloaded”：等待DOM树构建完成，但不包括所有资源的加载。“load”：等待页面完全加载，包括所有资源（如图片、样式表、脚本等）。
Playwright自动化 - 等待
zangzh的博客
04-08 2205
Playwright自动化 - 等待 使用playwright开发时，常需要等待某个操作完成时，才可操作。 方式1：有弹条提示保存成功 # 等待保存成功 page.locator("span:text-is('保存成功')").wait_for() 方式2：等待请求完成 # 等待保存成功 page.expect_request("**/api/**") 方式3：等待页面某个展示时 参考方式一 ...
Playwright 简明入门教程：录制自动化测试用例，结合 Docker 使用
为了不折腾而去折腾的那些事
11-29 2847
本篇文章聊聊如何使用 Playwright 进行测试用例的录制生成，以及如何在Docker 容器运行测试用例，或许是网上最简单的入门教程。
Playwright中page.on事件监听与page.wait_for_等待页面事件
book_dw5189的博客
03-19 3114
`page.on(event)` 方法是 Playwright 中用于监听特定事件的方法。你可以使用它来注册事件处理程序，以便在页面上触发该事件时执行相应的操作。
【playwright】新一代自动化测试神器playwright+python系列课程54_playwright接口测试_发起接口请求_get_post_fetch应用详解
qq_35948955的博客
01-23 912
fetch()方法相较于post和get的应用来说，fetch()方法不针对某一种接口类型，在fetch方法中有个method参数，这个参数可以指定接口类型，另外，fetch()方法中指定接口地址也不是传参给url，而是url_or_request，其他参数用法与get和post一致。接口的请求类型有get、post、head、delete、put等多种请求类型，每种请求类型的接口在发起接口请求时是有区别的，目前系统中主要是get和post两种接口类型，本文主要介绍这两种接口发起请求时的具体应用。
最新出炉 -Web自动化测试之playwright：概述
qq_48811377的博客
07-07 4152
目录目录Web自动化测试之playwright：概述playwright特性安装命令行工具脚本录制打开网页截图同步和异步API浏览器浏览器上下文多页面断言playwright Robot Framework库常见报错Node版本问题安装msedge报错playwright特性。
python playwright -remote-debugging-port
09-01
Python Playwright是一个能够控制浏览器进行自动化测试和操作的工具。其中，-remote-debugging-port是Playwright库提供的一个选项，用于指定远程调试的端口号。 使用-remote-debugging-port选项，可以让Playwright通过特定的端口与浏览器建立调试和通信的连接。这样一来，我们就可以实时地监控浏览器执行的情况，以便进行调试或将其集成到其他自动化工具中。 举个例子，假设我们想要在Playwright中使用Chrome进行自动化操作，并在开始之前设置远程调试端口号为9222。我们可以这样编写代码： ```python from playwright.sync_api import sync_playwright def main(): with sync_playwright() as playwright: browser_type = playwright.chromium browser = browser_type.launch(remote_debugging_port=9222) page = browser.new_page() # 在这里可以进行各种自动化操作 # ... browser.close() if __name__ == '__main__': main() ``` 在上述代码中，我们使用了playwright.sync_api中的sync_playwright函数来创建一个Playwright对象。然后，我们选择了要使用的浏览器，这里是Chrome。接着，我们通过调用browser_type的launch方法来启动浏览器，并使用remote_debugging_port参数指定了远程调试的端口号9222。 这样，我们就成功地在Playwright中设置了远程调试端口号。接下来，我们可以根据需要在此基础上进行各种自动化测试和操作，并通过与浏览器建立的调试连接实时监控其执行情况。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 9
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

度假的小鱼

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值