问题
在进行Web UI的自动化测试过程中，除了例如点击和拖拽某个元素产生的界面反馈，测试工程师在浏览器的窗口中是很难看到正在被操作的元素的。但是在一些场景下工程师可能会需要观察哪个元素正在被操作。
解决方案
要让元素能够被测试工程师的肉眼观察到，最简单的办法的就是改变元素的样式，例如让元素出现高亮的效果。那么，如何通过selenium来实现这个改变呢？
Selenium::WebDriver类有一个方法execute_script，可以在自动化脚本的运行过程中执行简单的JS脚本，实现我们的目的。
实例
# coding: utf-8
require 'selenium-webdriver'
def highlight(element, duration = 3)
# 保留元素原有的style，以待方法执行完成后恢复
original_style = element.attribute("style")
# 给元素加一个红色的虚线边界
$driver.execute_script(
"arguments[0].setAttribute(arguments[1], arguments[2])",
element,
"style",
"border: 2px solid red; border-style: dashed;")
# 让元素的边界保留一段时间再恢复
if duration > 0
sleep duration
$driver.execute_script(
"arguments[0].setAttribute(arguments[1], arguments[2])",
element,
"style",
original_style)
end
end
begin
$driver = Selenium::WebDriver.for :firefox
$driver.get 'https://www.jianshu.com'
highlight $driver.find_element(xpath: "//a[@class='logo']")
ensure
$driver.quit
end
总结
Selenium::WebDriver类的方法execute_script在实际使用中是一个很重要的方法，可以通过这个方法实现很多高级的功能。
