本文共 3019 字，大约阅读时间需要 10 分钟。

UI自动化测试中的元素高亮处理方案

在UI自动化测试中，为了让测试人员更直观地观察测试过程，可以通过对元素进行高亮处理。这种方法能够有效提升测试效率。

一、实现思路

我们可以通过Selenium的JavaScript执行来实现元素的高亮处理。这种方法具有很强的通用性，可以灵活地处理各种元素属性。具体来说，就是调用JavaScript方法，对找到指定元素后，给其添加样式。

二、代码实现

from selenium import webdriver
from time import sleep
def find(driver, by, loc):
    '''by代表定位方式，loc代表元素定位表达式'''
    STYLE = "background: yellow; border: 2px solid red;"  # 高亮的样式
    element = driver.find_element(by, loc)
    driver.execute_script("arguments[0].setAttribute('style', arguments[1]);", element, STYLE)
    return element
def find(self, by, expr):
    WebDriverWait(driver=self.dr, timeout=10).until(expected_conditions.visibility_of_element_located((by, expr)))
    element = self.dr.find_element(by, expr)
    js = """arguments[0].style.border="2px solid red";"""
    self.dr.execute_script(js, element)
    return element
def find_js(self, value, by, index=0):
    if by is 'class':
        WebDriverWait(self.dr, timeout=10).until(
            expected_conditions.visibility_of_element_located((By.CLASS_NAME, value)))
        js = "return document.getElementsByClassName('{}')[{}]".format(value, index)
        el = self.dr.execute_script(js)
        js = """arguments[0].style.border="2px solid red";"""
        self.dr.execute_script(js, el)
        return el
    if by is 'id':
        WebDriverWait(self.dr, timeout=10).until(
            expected_conditions.visibility_of_element_located((By.ID, value)))
        js = "return document.getElementsById('{}')[{}]".format(value, index)
        el = self.dr.execute_script(js)
        js = """arguments[0].style.border="2px solid red";"""
        self.dr.execute_script(js, el)
        return el
    if by is 'tag':
        WebDriverWait(self.dr, timeout=10).until(
            expected_conditions.visibility_of_element_located((By.TAG_NAME, value)))
        js = "return document.getElementsByTagName('{}')[{}]".format(value, index)
        el = self.dr.execute_script(js)
        js = """arguments[0].style.border="2px solid red";"""
        self.dr.execute_script(js, el)
        return el
    if by is 'css':
        WebDriverWait(self.dr, timeout=15, poll_frequency=1).until(
            expected_conditions.visibility_of_element_located((By.CSS_SELECTOR, value)))
        js = "return document.querySelectorAll('{}')[{}]".format(value, index)
        el = self.dr.execute_script(js)
        js = """arguments[0].style.border="2px solid red";"""
        self.dr.execute_script(js, el)
        return el
def find_all(self, by, expr):
    elements = []
    element_list = self.dr.find_elements(by, expr)
    for element in element_list:
        js = """arguments[0].style.border="2px solid red";"""
        self.dr.execute_script(js, element)
        elements.append(element)
    return elements

三、使用方法

在实际测试中，可以按照以下步骤实现元素高亮：

四、效果图

（图中展示了元素高亮后的界面情况）

五、核心代码解析

通过上述代码实现，可以看到关键点如下：

• 使用execute_script方法调用JavaScript
• 动态设置元素的样式属性
• 根据不同的定位方式（如class, id等）来实现灵活操作

这种方法既简单易实现，又能够满足多种定位需求，是UI自动化测试中常用的解决方案之一。