Python写UI自动化--playwright(元素焦点的控制)

在UI测试中会遇到一种情况，在输入框输入内容，鼠标焦点离开输入框后，前端会对输入框内容进行判断是否合法，比如输入不正确格式的账号，会有相应的提示。该篇文章就讲一讲playwright关于元素焦点的控制：

Playwright提供了直接调用元素的 blur() 方法的方式，可以立即移除元素的焦点。相应的也有focus()方法来实现对元素聚焦。

举个例子，百度账号注册，输入不正确格式的手机号：

代码如下：

from playwright.sync_api import Page,expect

def test_blur(page: Page):
    url='https://passport.baidu.com/v2/?reg&tt=1722938835917&overseas=&gid=1BC2DBF-8F2F-48D3-AD13-1F1042B0D7DF&tpl=pp&u=https%3A%2F%2Fpassport.baidu.com%2F'

    page.goto(url=url, wait_until='networkidle')
    page.get_by_placeholder("可用于登录和找回密码").fill("123456")

    page.get_by_placeholder("可用于登录和找回密码").blur() #使鼠标从该元素上失焦

    expect(page.get_by_text("手机号码格式不正确")).to_be_visible()

如果没有page.get_by_placeholder("可用于登录和找回密码").blur() 这一句，我们的断言会失败。blur()方法移除焦点后，界面才会显示手机号码格式不正确。

焦点还在输入框内：

移除了焦点后页面出现提示：

接下来我们让焦点重新聚焦到输入框内，加入以下代码：

    page.get_by_placeholder("可用于登录和找回密码").focus()  # 聚焦到输入框
    expect(page.get_by_text("手机号码格式不正确")).to_be_hidden() # 聚焦到输入框后，断言提示信息隐藏

就可以实现重新聚焦到输入框，提示信息也会随着操作隐藏

综上focus()和blur()方法可以帮助我们在自动化测试或脚本中控制元素的焦点状态，方便更灵活的测试操作