一:什么是Playwright？

Playwright是由微软基于node.js开发的开源自动化框架，适合用于web网页，移动端网页，具有执行速度快，编写简单的特性；与selenium不同的是，playwright不需要去下载指定的浏览器驱动，支持chorme，firefox，webkit内核的浏览器，与selenium不同的是它并不支持ie古老的浏览器；

在响应速度方面，playwright执行相同的步骤，selenium需要8s而playwright只需要3s；

二：支持的语言？

playwright支持的语言有python，java,js/ts，c#,go

三：如何安装？

在python中使用pip安装

pip install playwright

安装驱动

playwright install

安装完成后就可以正式进入使用

四：如何使用

1.打开浏览器

playwright支持同步和异步的使用，这里用同步的编写

from playwright.sync_api import sync_playwright with sync_playwright as p: wd=p.chromium.lauch(headless=False)#打开浏览器，使用ui画面执行

2.打开网址

```python page=p.new_page()#创建页面对象 page.goto('www.google.com')#跳转到指定的页面 ```

3.定位元素

```python #css选择器 page.locator('#name')#通过id定位，使用# page.locator('.name')#通过class定位，使用. page.locator('.name>li')#通过父级元素定位li子元素，li与上级是上下级关系 page.locator('.name , .phone')#定位多个元素，用逗号分割 page.locator('span:nth-child(2)')#定位标签下的第几个标签，从0开始计算 page.locator('span:nth-last(2)')#定位标签下倒数的第几个标签，从0开始计算 page.lcoator('span:nth-child(event)')#定位标签的偶数次数的标签 page.lcoator('span:nth-child(odd)')#选择奇数位置的元素 page.lcoator('[herf:"www.baidu.com"]')#选择标签属性包含了本链接的元素 #语义化定位 page.getByRole('button',{name:'提交'})#通过角色+可访问名称定位 page.getByLabel('用户名')#通过表单控件的label文本定位 page.getByPlaceholder('请输入账号')#通过输入框的提示词定位 page.getByText('登录')#根据标签文本内容定位 page.getAltText('test')#根据标签alt定位 page.getBytitle('标题')#根据标题内容定位 page.getByTestID('test')#根据data-testid属性定位 #xpath定位 page.loactor('//input[@id="kw"]')#f放入xpath表达式就可以 ```

拥有role的标签

HTML 标签（写法）	默认/隐式 role	能否用 getByRole
`<a href>`	`link`	✅
`<area href>`	`link`	✅
`<button>`	`button`	✅
`<input type="button">`	`button`	✅
`<input type="submit">`	`button`	✅
`<input type="reset">`	`button`	✅
`<input type="checkbox">`	`checkbox`	✅
`<input type="radio">`	`radio`	✅
`<input type="range">`	`slider`	✅
`<input type="search">`	`searchbox`	✅
`<input type="text">`	`textbox`	✅
`<input type="password">`	`textbox`	✅
`<input type="email">`	`textbox`	✅
`<input type="tel">`	`textbox`	✅
`<input type="url">`	`textbox`	✅
`<input type="number">`	`spinbutton`	✅
`<textarea>`	`textbox`	✅
`<select>`	`combobox`	✅
`<select multiple>`	`listbox`	✅
`<option>`	`option`	✅
`<img alt="…">`	`img`	✅
`<table>`	`table`	✅
`<thead>`	`rowgroup`	✅
`<tbody>`	`rowgroup`	✅
`<tfoot>`	`rowgroup`	✅
`<tr>`	`row`	✅
`<th scope="col">`	`columnheader`	✅
`<th scope="row">`	`rowheader`	✅
`<td>`	`cell`	✅
`<ul>`	`list`	✅
`<ol>`	`list`	✅
`<li>`	`listitem`	✅
`<dl>`	`term` / `definition`	✅
`<dt>`	`term`	✅
`<dd>`	`definition`	✅
`<nav>`	`navigation`	✅
`<main>`	`main`	✅
`<aside>`	`complementary`	✅
`<header>`	`banner`	✅
`<footer>`	`contentinfo`	✅
`<section aria-label="xxx">`	`region`	✅
`<article>`	`article`	✅
`<dialog>`（open 时）	`dialog`	✅
`<details>`	`group`	✅
`<summary>`	`button`	✅
`<h1>–<h6>`	`heading` + 级别	✅
`<form>`	`form`	✅
`<fieldset>`	`group`	✅
`<legend>`	无 role，但提供 `<fieldset>` 的 name	❌
`<label>`	无 role	❌
`<div>`	无 role（除非显式写 `role="xxx"`）	❌
`<span>`	无 role	❌
`<p>`	无 role	❌
`<i>` / `<b>` / `<em>` / `<h3>`	无 role	❌

4.缺省等待

在playwright中，各个操作动作都默认包含了一个等待时间，一个步骤的默认等待时间为30s,单条测试的默认最大超时时间也为30s，如果需要修改元素的等待时间也可以手动修改等待时间；

当元素查询超过了等待时间就会抛出超时错误

page.locator('.login').click({timeout:10000})#修改等待时间为100S page.setDefaultTimeout(2000)#修改所有locator动作的等待时间

5.界面操作

```python page.locator('.test').inner_text()#获取的单个文本内容，不适用于多个元素的文本 page.locator('.test').all_inner_text()#获取所有文本的内容，返回一个列表，单个元素也可以返回 page.locator('.test').get_attribute('href')#获取元素的属性，方法内填入需要的属性名 page.locator('.test').get_inner_html# page.locator('.test').click()#操作元素点击 page.locator('.test').dbclick()#操作元素双击 page.locator('.test').fill()#操作输入框写入文本 page.locator('.test').type("hi", delay=100)#逐个字符敲击键盘 page.locator('.test').hover()#操作鼠标悬浮 page.locator('.test').drag_to()#操作拖动元素道另一个元素的位置 ```

page.locator('.test').check()/uncheck()#勾选或者取消勾选 page.locator('.test').select_option()#下拉选择框选择 page.locator('.test').set_input_files()#上传文件，方法内传入文件 page.locator('.test').clear()#清空输入框 page.locator('.test').dialog()#监听弹窗

6.网页Page对象操作

```python #导航 page.goto('www.baiud.com')#操作打开网页 page.reload()#操作刷新网页 page.go_back()#返回上一步 page.forward()#前进一步，如果前一步的话 page.wait_for_load_state('networkkidle')#等待网络空闲 page.wait_for_url()#等待url匹配

获取内容

page.content()#获取整页的html
page.title()#获取网页标题
page.innert_text()#获取可视文本
page.input_value()#获取表单值

注入脚本/样式

page.add_script_tag(content='windows.foo=1')

鼠标键盘

page.mouse.move(100,200)#移动鼠标道制定的位置
page.keyboard.press('enter')#键盘按下回车键

事件监听

page.on('dialog',lambda d:d.accept())#弹窗点击确定

截图/pdf

page.screenshot(path='full.png',full+page=True)#截取整个屏幕
page.locator('#box').screenshot(path='test.png')#截取制定区域的截图
page.pdf(path='page.pdf'，format='A4')

设备模拟

page.set_viewport_size({'windows':1280,'height':720})#模拟窗口大小
page.set_suer_agent(''MyBOT/1.0)#模拟用户设备

cookie&本地存储

page.context.add_cookies(["name":"token","value":""123123])#注入cookie
page.contenxt.clear_cookies()#清除浏览器cookies
page.evaluate("localStorage.setItem('theme','dark')")#

iframe=page.frame_locator('#myframe')#切换到frame
iframe.locator('.test').click()#后续操作与普通无异，如果需要继续操作原页面，离开frm作用于就行

窗口切换

with page.expect_event("popup") as popup_info:#检测到页面跳转就把对象存在popup_info中
page.get_by_text('登录').click()#页面跳转
login_page=popup_info.value#获取到新的页面
login_page=wait_for_load_state()#等待新页面网络加载完成
login_page.locator('.test').click()#操作新页面的元素
login_page.close()#关闭新的页面标签
page.bring_to_fromt()#返回原页面