一:什么是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支持同步和异步的使用，这里用同步的编写
python
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> / <strong> |
无 role | ❌ |
4.缺省等待
在playwright中，各个操作动作都默认包含了一个等待时间，一个步骤的默认等待时间为30s,单条测试的默认最大超时时间也为30s，如果需要修改元素的等待时间也可以手动修改等待时间；
当元素查询超过了等待时间就会抛出超时错误
python
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()#操作拖动元素道另一个元素的位置 ```
python
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()#返回原页面