playwright+Pytest+UI 自动化分成设计框架

录制代码：python37 -m pytest -v %WORKSPACE%/TestCases --alluredir TestReport --clean-alluredir

录制脚本：
playwright codegen -o 'test_03.py' -b chromium 录制项目地址（wwww.baidu.com）
-o '文件名' 意思是保存代码成某个文件。
-b 驱动 网址 意思是用什么浏览器打开哪个页面

1、图片验证码报错提示：module 'PIL.Image' has no attribute 'ANTIALIAS' 问题处理

• 方案一，修改ddddocr的_init_.py文件，将其中的ANTIALIAS替换为新方法：
  image = image.resize((int(image.size[0] * (64 / image.size[1])), 64), Image.ANTIALIAS).convert('L')
  image = image.resize((int(image.size[0] * (64 / image.size[1])), 64), Image.LANCZOS).convert('L')
• 方案二，降级Pillow的版本，比如使用9.5.0版本
  先卸载，再重新安装
  pip uninstall -y Pillowpip install Pillow==9.5.0

2、headless 模式
browser = playwright.chromium.launch(headless=False)
默认情况下，Playwright 以无头模式运行浏览器。要查看浏览器 UI，请headless=False在启动浏览器时传递标志。

关于等待

• slow_mo （单位是毫秒）减慢执行速度。它的作用范围是全局的，从启动浏览器到操作元素每个动作都会有等待间隔
• chromium.launch(headless=False, slow_mo=50)
• 调试的时候需要使用等待：page.wait_for_timeout(5000)

3、text 文本选择器
● 完全匹配文本 //[text()="何三笔记"]
● 包含某个文本 //[contains(text(),"何三笔记")]

4、Selector 选择器组合定位

• 不同的selector可组合使用，用>>连接
• page.fill('form >> [name="username"]', "测试")
• page.locator("form").locator('[name="username"]').fill("测试")

5、内置定位器

• page.get_by_role()通过显式和隐式可访问性属性进行定位。
• page.get_by_text()通过文本内容定位。
• page.get_by_label()通过关联标签的文本定位表单控件。
• page.get_by_placeholder()按占位符定位输入。
• page.get_by_alt_text()通过替代文本定位元素，通常是图像。
• page.get_by_title()通过标题属性定位元素。
• page.get_by_test_id()根据data-testid属性定位元素（可以配置其他属性）

6、Context实现测试浏览器环境隔离
context = browser.new_context(storage_state="state.json")

一、使用browser.new_context() 创建context对象，context之间是相互隔离的，可以理解为轻量级的浏览器实例
二、Context实现测试浏览器环境隔离
测试隔离是指每个测试与另一个测试完全隔离。每个测试都独立于任何其他测试运行。这意味着每个测试都有自己的本地存储、会话存储、cookie 等。Playwright 使用BrowserContext实现了这一点，这相当于隐身式配置文件。它们的创建速度快、成本低，并且完全隔离，即使在单个浏览器中运行也是如此。Playwright 为每个测试创建一个上下文，并在该上下文中提供一个默认页面。

7、为什么测试隔离很重要

• 没有失败结转。如果一个测试失败，它不会影响另一个测试。
• 易于调试错误或不稳定，因为您可以根据需要多次运行单个测试。
• 并行运行、分片等时不必考虑顺序。

8、screenshot 截图

• 设置full_page=True 参数 screenshot 是一个完整的可滚动页面的屏幕截图
  page.screenshot(path="screenshot.png", full_page=True)
• 截取单个元素
  page.locator(".header").screenshot(path="screenshot.png")

page.pause() 断点调试
Trace Viewer 追踪功能
context.tracing.stop(path = "trace.zip")
方法1.：通过命令行查看操作过程追踪
playwright show-trace trace.zip
方法2：访问 https://trace.playwright.dev/ 选择录制好的trace.zip文件即可打开

9、click/fill 会自动等待
自定义等待：locator.click可以结合page.wait_for_load_state()来等待加载事件。

等待元素：使用locator.wait_for()等待元素

异步导航：page.expect_navigation()
with page.expect_navigation():
page.get_by_text("Navigate after timeout").click()

多重导航：page.expect_navigation() 显式指向特定的 url
with page.expect_navigation(url="**/login")
page.get_by_text("Click me").click()

加载弹出窗口：page.wait_for_load_state()
expect_popup 方法来处理弹出窗口
with page.expect_popup() as popup_info:
page.get_by_text("Open popup").click() # Opens popup
popup = popup_info.value
popup.wait_for_load_state("load")

timeout 等待超时：设置页面加载超时时间, 默认是30秒， 传递“0”以禁用超时。
● browser_context.set_fault_navigation_timeout（）进行更改
● browser_context.set_fault_timeout（）
● page.set_fault_navigation_timeout）
● page.set_fault_timeout（）

录制
context = browser.new_context(record_video_dir="videos/")
确保调用 close, videos视频才会保存
context.close()

文件下载操作：expect_download()
with page.expect_download() as download_info:
page.get_by_text("Download file").click()
download = download_info.value
path = download.path()

文件上传：locator.set_input_files()
第一种场景：文件上传是input 输入框，并且类型是type="file" 的情况
page.get_by_label("选择文件").set_input_files('tou.png')
第二种场景：如果不是input输入框，必须点开文件框的情况（selenium上没法实现的操作），可以使用page.expect_file_chooser() 监听到弹出框，在弹出框上输入文件路径

# 点击选择文件，输入文件

with page.expect_file_chooser() as fc_info:
    page.get_by_label("选择文件").click()
page.pause()
file_chooser = fc_info.value
file_chooser.set_files(r"D:\tou.png")
在运行过程中你是感知不到文件选项框弹出来的
异步代码示例
async with page.expect_file_chooser() as fc_info:
	await page.get_by_text("Upload file").click()
file_chooser = await fc_info.value
await file_chooser.set_files("myfile.pdf")

Locator 定位机制与元素句柄 ElementHandle
selenium 和playwright区别：
1、selenium 采用的是 http 协议，获取的元素句柄是固定的，不能实时去获取页面上的元素
2、playwright 采用的是webscoket 协议，可以实时去获取页面元素，当DOM结构有更新的时候，也能重新获取到所以 不鼓励使用 ElementHandle，而是使用Locator对象和网络优先断言

Locator 定位器
使用定位器，每次element使用时，最新的 DOM 元素都会使用选择器定位在页面中。所以在下面的代码片段中，底层 DOM 元素将被定位两次

常用的元素判断方法

• page.is_checked(selector: str) # checkbox or radio 是否选中
• page.is_disabled(selector: str) # 元素是否可以点击或编辑
• page.is_editable(selector: str) # 元素是否可以编辑
• page.is_enabled(selector: str) # 是否可以操作
• page.is_hidden(selector: str) # 是否隐藏
• page.is_visible(selector: str) # 是否可见

no_viewport 禁用窗口大小：
设置args参数--start-maximized 并且设置no_viewport=True

viewport 指定窗口大小：
viewport 参数可以设置固定的窗口