一. 前言
高亮是什么？
在ui自动化中可以执行js来让某个页面元素高亮，比如背景颜色、字体颜色、边框颜色等发生改变，以此更加方便执行的时候点了哪一步操作。（如果有不清楚怎么实现的可以转到我的介绍seliky的那一篇哦，我的seliky源码里有现成的）
那么这个高亮如何在playwright中实现呢？
原理也是一样的，只不过执行底层执行的是nodejs。
为什么要调整源码？
通过继承的逻辑链路太长了，不如调整源码来的简单，所以直接调整源码了。
为什么弃用原生的is_visible？
截止playwright 1.19版本，官方的 is_visible、is_displayed 方法疑似有bug，经过大量测试，发现这两个方法在明明元素可见的情况下返回 False，有时还抛出异常，真的不好用。
用什么代替 is_ 系列？
我们知道在常规概念(selenium) 里 is_displayed 表示是否加载到dom树，is_visible 表示是否加载并可见。这样的区别在面对常规元素时不是很大，可以用 is_show 封装的 wait_for_selector 处理。
二. 调整源码
"""
源码里的Page改为Pages
然后将下面的代码复制到源码里，除了第一句
""" from playwright.sync_api._generated import Pages
import time class Page(Pages):
def is_showed(self,
selector: str,
*,
state=None,
timeout: float = None,
strict: bool = None):
"""
原生的is_visible、is_displayed 好像有bug，这样比较好
"""
try:
flag = super().wait_for_selector(
selector=selector, state=state, timeout=timeout, strict=strict
)
except Exception as e:
flag = False
return flag def clicked(self,
selector: str,
*,
has_text=None,
has=None):
"""
实现点击高亮
原生的click有它的优势，这里改名为clicked以区分
"""
return self.locator(selector, has_text=has_text, has=has).click() def locator(
self,
selector: str,
*,
has_text=None,
has=None
):
"""
定位元素高亮
"""
bd = super().locator(
selector=selector, has_text=has_text, has=has
)
for i in range(2):
bd.evaluate('node => node.style.cssText="border:solid 2px blue"')
time.sleep(0.15)
bd.evaluate('node => node.style.cssText="border:solid 2px red"')
time.sleep(0.1)
bd.evaluate('node => node.style.cssText="border:solid 2px red"')
time.sleep(0.4)
bd.evaluate('node => node.style.cssText="border:solid 2px none"')
return bd
