如何用Protractor获取DOM中不存在的禁用元素的值？

问题分析 #

核心问题有两点：

1. 模态窗口属于动态加载内容，未等待元素完成渲染就操作，导致webElement为undefined/null，调用方法时触发报错
2. 该元素采用Aurelia框架的value.bind做数据绑定，DOM节点不会直接渲染value属性，直接读取DOM的value自然拿不到目标值

可行解决方案 #

方案1：先确保元素被正确定位（处理动态加载） #

必须等待模态窗口加载完成、元素出现在DOM中后再操作，用Protractor的ExpectedConditions实现等待：

const EC = protractor.ExpectedConditions;
const targetElement = element(by.css('.uk-input.uk-margin-remove.au-target'));

// 等待元素在DOM中出现（即使处于禁用或隐藏状态）
browser.wait(EC.presenceOf(targetElement), 10000, '目标元素未在DOM中加载完成');

方案2：通过Aurelia框架上下文获取绑定的模型值 #

因为元素绑定了model.mof.offer_code，可以直接通过JS执行器读取框架绑定的模型数据：

browser.executeScript(`
  const element = document.querySelector('.uk-input.uk-margin-remove.au-target');
  // 获取Aurelia绑定上下文
  const bindingContext = aurelia.bindingContextFor(element);
  return bindingContext.model.mof.offer_code;
`).then(offerCode => {
  console.log(offerCode); // 此处可获取到目标值234218
  // 后续添加你的验证逻辑
});

方案3：读取元素的文本内容（若值已渲染在输入框内） #

部分禁用输入框会将值以文本形式展示，可尝试读取元素的文本内容：

targetElement.getText().then(text => {
  console.log(text);
});

方案4：修正JS执行器写法（若DOM实际存在value属性） #

如果元素渲染后存在value属性，确保元素定位正确后执行以下代码：

browser.executeScript("return arguments[0].value", targetElement.getWebElement()).then(value => {
  console.log(value);
});

关键注意事项 #

• 模态窗口加载存在延迟，必须等待元素完全出现在DOM中再执行操作，否则会出现元素找不到的情况
• 对于Aurelia这类MVVM框架，直接操作DOM属性往往拿不到绑定值，优先通过框架API读取模型数据

内容的提问来源于stack exchange，提问作者Sagarika