【Python学习】【自动化测试】使用playwright进行网页自动化测试

声明：本文首发于本人知乎文章，转载请按照规范声明文章来源，谢谢！

一、什么是playwright？

playwright支持Chrome、Firefox、Safari、Microsoft Edge 等主流浏览器，支持以有头模式、无头模式运行浏览器。

playwright提供了同步和异步API，可以结合Pytest测试框架使用，并且支持自动录制浏览器端的操作脚本。大大降低了自动化测试的门槛，有没有一种相见恨晚的感觉？至于你有没有，反正我有了！

二、安装playwright

pip install playwright

• 红框1：我是在anaconda prompt下安装的，你也可以在windows的cmd命令行下安装；

• 红框2：我把pip的源指定到了清华的镜像：https://pypi.tuna.tsinghua.edu.cn/simple，可以不用指定这个pip安装源。

注意：需要python的版本大于3.6，否则会找不到playwright的安装包。

安装成功之后，执行命令：

python -m playwright install

该命令会自动下载Chromeium、Firefox、Safari(WebKit)浏览器驱动到本地。

路径为：C:\Users\XXX\AppData\Local\ms-playwright

其中，XXX是你电脑当前登录的用户名。

三、牛刀小试

我们尝试进行下面的三步操作：

1. 打开浏览器
2. 输入“http://www.baidu.com”
3. 在百度首页输入“妹子”，回车
4. 截图保存搜索结果
5. 关闭浏览器

from playwright.sync_api import sync_playwright

def test():
    with sync_playwright() as p:
        for browser_type in [p.chromium, p.firefox, p.webkit]:
            print(f'start browser {browser_type.name} ...')
            # playwright默认是无头模式
            #browser = browser_type.launch()
            # 指定为有头模式，方便查看界面
            browser = browser_type.launch(headless=False)
            
            context = browser.new_context()
            page = browser.new_page()

            # goto baidu homepage
            page.goto('http://www.baidu.com')

            # search something
            page.fill('input[name="wd"]', '妹子')
            with page.expect_navigation():
                page.press('input[id="su"]', 'Enter')

            # 等待出现“百度热搜”四个字
            page.wait_for_selector('div[title="百度热搜"]')

            # screenshot
            page.screenshot(path=f'screenshot-{browser_type.name}.png')
            context.close()
            browser.close()

if __name__ == '__main__':
    test()

上面的图片是chromium浏览器内核的截图，另外的2个浏览器的截图也是差不多的，自己动手试试看吧！

注意：运行时360或者其他“安全”软件会提示你一些安全隐患，可以无视。

用无头模式也可以生成图片，亲测可用！

四、自动生成代码

这个功能简直不要太赞！

只需要输入命令：

python -m playwright codegen

然后进行一系列网页操作，就可以生成如下的python代码！

from playwright.sync_api import Playwright, sync_playwright


def run(playwright: Playwright) -> None:
    browser = playwright.chromium.launch(headless=False)
    context = browser.new_context()

    # Open new page
    page = context.new_page()

    # Go to https://www.baidu.com/
    page.goto("https://www.baidu.com/")

    # Click input[name="wd"]
    page.click("input[name=\"wd\"]")

    # Fill input[name="wd"]
    page.fill("input[name=\"wd\"]", "meizi")

    # Press Enter
    # with page.expect_navigation(url="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=meizi&fenlei=256&rsv_pq=80cea88400013d36&rsv_t=fad4MkzB%2BaTZAOTvPsAyEr5xXtIXkabuQauKHC17zjL8jV7nircILlSgAWs&rqlang=cn&rsv_enter=1&rsv_dl=tb&rsv_sug3=6&rsv_sug1=5&rsv_sug7=100&rsv_sug2=0&rsv_btype=i&prefixsug=meizi&rsp=5&inputT=2059&rsv_sug4=3163&rsv_jmp=fail"):
    with page.expect_navigation():
        page.press("input[name=\"wd\"]", "Enter")
    # assert page.url == "https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=meizi&fenlei=256&rsv_pq=80cea88400013d36&rsv_t=fad4MkzB%2BaTZAOTvPsAyEr5xXtIXkabuQauKHC17zjL8jV7nircILlSgAWs&rqlang=cn&rsv_enter=1&rsv_dl=tb&rsv_sug3=6&rsv_sug1=5&rsv_sug7=100&rsv_sug2=0&rsv_btype=i&prefixsug=meizi&rsp=5&inputT=2059&rsv_sug4=3163"

    # Click a:has-text("图片")
    # with page.expect_navigation(url="https://image.baidu.com/search/index?tn=baiduimage&ps=1&ct=201326592&lm=-1&cl=2&nc=1&ie=utf-8&dyTabStr=MCwzLDQsNSwxLDcsOCwyLDYsOQ%3D%3D&word=meizi"):
    with page.expect_navigation():
        page.click("a:has-text(\"图片\")")
    # assert page.url == "https://image.baidu.com/search/index?tn=baiduimage&ps=1&ct=201326592&lm=-1&cl=2&nc=1&ie=utf-8&dyTabStr=MCwzLDQsNSwxLDcsOCwyLDYsOQ%3D%3D&word=meizi"

    # ---------------------
    context.close()
    browser.close()


with sync_playwright() as playwright:
    run(playwright)

看到没，连断言都帮你写好了，惊喜不惊喜，意外不意外？

运行上述代码，除了没有截图之外，效果和第三节的牛刀小试中的页面一样，还点击了搜索页面上的“图片”链接。

注意：Webkit内核无法点击“图片”链接。

所以，如果要进行Webkit内核的浏览器前端页面测试，在脚本的兼容性方面还需要花一定的时间去适配！（真TMO疼！）

五、亮点

playwright有以下四大亮点:

1. 代码执行速度比selenium要快。
2. playwright不需要在代码中做等待判断，比如等待下一个跳转页面出现时再进行后续的点击操作。而在selenium的代码中的点击操作都要加入等待判断，甚至要加上延迟时间。
3. 在playwright中可以直接通过页面文本字符来选择对应元素。
4. 可以通过录制脚本的方式生成python代码，极大提高了自动化脚本编写效率。
   最后，按照老习惯！如果脚本运行成功了记得关注我，然后收藏本文，再给我点个赞！千万不要打赏~