NodeJS Selenium getAttribute()获取存在的title属性返回空值问题

问题原因 #

• Selenium 4.0.0-beta.4 版本存在固有bug：该测试版本中getAttribute('title')的实现逻辑异常，会优先读取DOM元素的title属性值（property，JS运行时的动态属性）而非HTML层面的特性值（attribute，标签上写死的静态值）。如果页面JS框架（如你用到的Tooltip组件）初始化时清空了元素的title property，仅保留HTML attribute存储原值，就会出现读取为空的问题。
• Tooltip组件的默认行为冲突：你的元素上带了data-toggle="tooltip"属性，说明绑定了Bootstrap Tooltip或同类提示组件。这类组件初始化时默认会把原生title attribute的值转移到data-original-title attribute中，同时清空原生title的值避免浏览器默认提示和自定义Tooltip冲突，你在开发者工具中看到的title可能是组件渲染前的静态快照，实际运行时已经被修改。

可行解决方案 #

1. 直接读取data-original-title属性
   如果是Tooltip组件转移了原值，直接调用以下代码即可拿到原本的title值：

const title = await pluElem.getAttribute('data-original-title')

2. 通过JS执行器绕开Selenium的API缺陷
   直接用原生JS读取元素的HTML attribute，不受Selenium版本bug影响：

const title = await driver.executeScript(`
  return arguments[0].getAttribute('title');
`, pluElem);

3. 升级Selenium依赖版本
   该读取异常的bug在4.0.0正式版及后续版本中已经被修复，将selenium-webdriver的版本升级到^4.0.0正式版以上，即可正常使用getAttribute('title')读取值。

4. 从attributes集合中过滤取值
   如果需要从属性集合中读取title，可通过执行JS过滤实现：

const attributes = await pluElem.getProperty('attributes');
const title = await driver.executeScript(`
  return Array.from(arguments[0]).find(attr => attr.name === 'title')?.value;
`, attributes);

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