经过前两篇文章的学习，相信大家已经对 JavaScriptExecutor 有了基本的认识和实战经验。今天，我们来一次大盘点，整理出最实用的命令大全，并分享一些压箱底的最佳实践技巧。
JavaScriptExecutor 常用命令大全
元素操作类
点击按钮（两种实现方式）
// 通过元素 ID 直接点击
js.executeScript("document.getElementById('enter element id').click();");
// 通过传递元素参数点击（推荐方式）
js.executeScript("arguments[0].click();", okButton);
使用场景：当常规的 element.click() 方法失效时，比如元素被遮挡、不在视口中或者存在兼容性问题。
输入文本（绕过 sendKeys 方法）
// 通用方式
js.executeScript("document.getElementById('id').value='someValue';");
// 具体示例
js.executeScript("document.getElementById('Email').value='FunTester.com';");
使用场景：处理一些特殊的输入框，比如富文本编辑器、只读字段或者有特殊验证逻辑的输入框。
处理复选框（通过传递布尔值）
js.executeScript("document.getElementById('enter element id').checked=false;");
使用场景：批量处理复选框状态，或者处理一些通过 CSS 美化后难以直接操作的复选框。
页面交互类
生成警告弹窗
js.executeScript("alert('Welcome To FunTester');");
使用场景：在测试过程中添加调试信息，或者模拟用户交互场景。
刷新浏览器窗口
js.executeScript("history.go(0)");
使用场景：需要刷新页面但又想避免使用 driver.refresh() 的情况，比如保持某些 JavaScript 状态。
页面导航
js.executeScript("window.location = 'https://www.google.com'");
使用场景：需要在当前窗口中导航到新页面，而不是打开新标签页。
页面信息获取类
获取页面内容
String innerText = js.executeScript("return document.documentElement.innerText;").toString();
System.out.println(innerText);
使用场景：获取页面的所有可见文本内容，用于内容验证或数据提取。
获取页面标题
String titleText = js.executeScript("return document.title;").toString();
System.out.println(titleText);
使用场景：验证页面标题，特别是在单页应用中标题动态变化的情况。
获取域名
String domainName = js.executeScript("return document.domain;").toString();
System.out.println(domainName);
使用场景：验证当前页面的域名，确保没有发生意外的跳转。
获取页面 URL
String url = js.executeScript("return document.URL;").toString();
System.out.println(url);
使用场景：获取完整的 URL，包括查询参数和锚点，用于详细的页面状态验证。
获取页面尺寸
String height = js.executeScript("return window.innerHeight;").toString();
String width = js.executeScript("return window.innerWidth;").toString();
使用场景：响应式测试中验证页面在不同尺寸下的表现。
滚动操作类
垂直滚动指定像素
js.executeScript("window.scrollBy(0,500)");
使用场景：精确控制滚动距离，比如测试懒加载功能。
滚动到页面底部
js.executeScript("window.scrollBy(0,document.body.scrollHeight)");
使用场景：触发页面底部的元素加载，或者验证页面底部的内容。
滚动到元素位置
js.executeScript("arguments[0].scrollIntoView(true);", element);
使用场景：确保元素在视口中可见，这是操作元素前的常用准备步骤。
高级操作类
动态添加 DOM 元素
js.executeScript("var btn=document.createElement('newButton');" +
"document.body.appendChild(btn);");
使用场景：测试页面对动态内容的处理能力，或者在测试过程中添加辅助元素。
获取 Shadow DOM
WebElement element = driver.findElement(By.id("shadowroot"));
js.executeScript("return arguments[0].shadowRoot", element);
使用场景：处理使用 Web Components 技术的现代前端应用。
修改元素属性
// 移除只读属性
js.executeScript("arguments[0].removeAttribute('readonly');", element);
// 修改元素样式
js.executeScript("arguments[0].style.display='none';", element);
// 设置元素属性
js.executeScript("arguments[0].setAttribute('data-test', 'FunTester');", element);
使用场景：绕过前端限制，直接修改元素状态进行测试。
实用工具方法封装
基于最佳实践，我们可以封装一些实用的工具方法：
public class JavaScriptUtils {
private JavascriptExecutor js;
public JavaScriptUtils(WebDriver driver) {
this.js = (JavascriptExecutor) driver;
}
/**
* 安全点击元素
*/
public void safeClick(WebElement element) {
try {
js.executeScript("arguments[0].click();", element);
} catch (Exception e) {
element.click(); // 备用方案
}
}
/**
* 高亮元素
*/
public void highlightElement(WebElement element) {
js.executeScript("arguments[0].style.border='3px solid red';", element);
}
/**
* 移除高亮
*/
public void removeHighlight(WebElement element) {
js.executeScript("arguments[0].style.border='';", element);
}
/**
* 滚动到元素
*/
public void scrollToElement(WebElement element) {
js.executeScript("arguments[0].scrollIntoView(true);", element);
}
/**
* 获取元素文本（包括隐藏元素）
*/
public String getElementText(WebElement element) {
return js.executeScript("return arguments[0].textContent;", element).toString();
}
/**
* 检查元素是否可见
*/
public boolean isElementVisible(WebElement element) {
return (Boolean) js.executeScript(
"return arguments[0].offsetParent !== null;", element);
}
}
总结
JavaScriptExecutor 是自动化测试中的"瑞士军刀"，能够有效突破常规 WebDriver 在页面复杂交互、动态 DOM 操作和兼容性处理等场景下的局限，让测试脚本具备更强的适应性和操作能力。通过直接执行 JavaScript 代码，我们可以高效应对那些常规方法无法解决的难题，极大提升了测试的灵活性和效率。