精准记录：使用 Playwright 实现屏幕截图

前言

在软件开发和测试中，屏幕截图是一种常用的工具，用于记录应用程序的状态、错误信息等。Playwright 提供了一种简单而强大的方式来实现屏幕截图，帮助开发人员和测试人员轻松捕获和分析应用程序的界面。本文将介绍如何使用 Playwright 实现屏幕截图。

screenshot 截图

在 Playwright 中，要实现屏幕截图非常简单。你只需要调用 page 对象的 screenshot() 方法，并指定保存截图的文件路径即可。以下是一个示例：

捕获屏幕截图并将其保存到文件中的快速方法：

page.screenshot(path="screenshot.png")

使用示例

from playwright.sync_api import sync_playwright


with sync_playwright() as p:
    browser = p.chromium.launch(headless=False, slow_mo=1000)
    context = browser.new_context()  # 创建上下文，浏览器实例1

    page = context.new_page()    # 打开标签页
    page.goto("https://ceshiren.com")
    print(page.title())
    page.screenshot(path="screenshot.png")

截取图像如下：

截取长图

设置full_page=True 参数 screenshot 是一个完整的可滚动页面的屏幕截图，就好像你有一个非常高的屏幕并且页面可以完全容纳它。

page.screenshot(path="screenshot.png", full_page=True)

完整代码如下：

from playwright.sync_api import sync_playwright


with sync_playwright() as p:
    browser = p.chromium.launch(headless=False, slow_mo=1000)
    context = browser.new_context()  # 创建上下文，浏览器实例1

    page = context.new_page()    # 打开标签页
    page.goto("https://ceshiren.com")
    print(page.title())
    page.screenshot(path="screenshot.png", full_page=True)

截取的图像如下：

捕获图片数据流

获取包含图像的缓冲区并对其进行后处理或将其传递给第三方像素差异工具，而非写入文件

screenshot_bytes = page.screenshot()
print(base64.b64encode(screenshot_bytes).decode())

截取单个元素

除了截取整个当前页面，或者截取长图，playwright还支持截取元素，截取方法如下：

page.locator(".header").screenshot(path="screenshot.png")

例如截图百度首页的form 表单输入框和搜索按钮


from playwright.sync_api import sync_playwright



with sync_playwright() as p:
    browser = p.chromium.launch(headless=False, slow_mo=1000)
    context = browser.new_context()  # 创建上下文，浏览器实例1

    page = context.new_page()    # 打开标签页
    page.goto("https://www.baidu.com/")
    print(page.title())
    page.screenshot(path="screenshot.png")
    page.locator(".form").screenshot(path="screenshot.png")

截图效果如下：

总结

本文主要讲解了playwright的截图操作，比起selenium，playwright的截图功能更加强大，更加方便使用，这也是playwright相对于selenium的强大优势。Playwright 提供了简单而强大的 screenshot() 方法，帮助开发人员轻松捕获和分析应用程序的界面。希望本文能够对你有所帮助，让你更好地掌握 Playwright 的使用技巧！