本文介绍在 selenium java 中绕过前端 javascript 限制（如 `is-readonly` 类、禁用键盘输入等），通过 javascript 执行器直接修改 input 元素值的可靠方法，无需模拟右键粘贴或组合键操作。
在自动化测试中，常遇到一类“伪只读”输入控件：其视觉上可点击、DOM 中存在 元素，但因前端框架（如 Angular 封装的 ui-text-field）动态添加 is-readonly 类、移除 tabindex、拦截 keydown 事件，甚至调用 event.preventDefault()，导致 sendKeys() 完全失效。此时，依赖 Actions 类模拟右键 → 粘贴，或 Robot 类触发 Ctrl+V，不仅稳定性差（易受焦点/系统剪贴板干扰），还违反无头环境最佳实践，且在 CI/CD 中常失败。
根本解法是绕过 DOM 交互层，直接操作元素属性与值。Selenium 提供的 JavascriptExecutor 接口正是为此设计——它允许你在浏览器上下文中执行原生 JavaScript，精准控制元素状态，不受前端事件监听器干扰。
以下为完整、健壮的实现步骤（含关键注意事项）：
✅ 正确做法：三步 JavaScript 注入
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.By;
// 1. 定位目标 input 元素（注意：选择器需精确指向 <input>，而非外层 div）
WebElement inputField = driver.findElement(By.cssSelector("ui-text-field input.field"));
// 2. 获取 JavaScript 执行器实例
JavascriptExecutor js = (JavascriptExecutor) driver;
// 3. 执行链式 JS 操作（顺序关键！）
js.executeScript("arguments[0].classList.remove('is-readonly')", inputField); // 移除只读样式类（影响视觉与部分逻辑）
js.executeScript("arguments[0].removeAttribute('readonly')", inputField); // 清除 readonly 属性（若存在）
js.executeScript("arguments[0].value = arguments[1]", inputField, "2025-12-31"); // 直接赋值（最核心一步）? 为什么 value = ... 是关键？sendKeys() 依赖浏览器事件流，而 element.value = 'xxx' 是 DOM 属性直写，不触发 input/change 事件——但多数现代框架（Angular、React）会通过 MutationObserver 或 ngModel 绑定自动响应 value 变更。若业务逻辑严格依赖 input 事件，可追加手动触发：js.executeScript( "arguments[0].value = arguments[1]; " + "arguments[0].dispatchEvent(new Event('input', { bubbles: true })); " + "arguments[0].dispatchEvent(new Event('change', { bubbles: true }));", inputField, "2025-12-31" );
⚠️ 关键注意事项
-
选择器必须精准：示例中 By.cssSelector("ui-text-field input.field") 直接定位 ，而非外层 。操作父容器无法改变 input 值。
- 避免 sendKeys() 混用：一旦用 JS 设置了 value，再调用 sendKeys() 可能覆盖值或触发异常，应全程统一使用 JS 方案。
- 警惕前端重渲染：如页面监听 focus/click 并动态恢复 is-readonly 类，建议在 value 设置后立即触发一次 blur()（inputField.blur()）或等待稳定状态。
- 兼容性保障：executeScript 在 Chrome/Firefox/Edge 所有主流版本中行为一致，无需额外 polyfill。
✅ 最佳实践总结
场景 推荐方案 原因 简单赋值（无强事件依赖） js.executeScript("arguments[0].value = ...", el, val) 最简、最稳、零副作用 需触发 Angular/React 数据绑定 value = ... + dispatchEvent('input') 确保双向绑定同步 多字段批量初始化 封装为工具方法，传入 WebElement 和 String 值 提升可维护性 此方法已广泛应用于金融、政务等对表单校验严格的系统自动化场景，成功率接近 100%，是处理“JavaScript 锁定输入”的工业级标准解法。
立即学习“Java免费学习笔记（深入）”；
