如何使用Nightwatch.js提取元素src属性中的指定片段

完全可以通过Nightwatch原生API结合JavaScript原生字符串方法实现需求，操作步骤如下：

• 第一步：读取目标元素的完整src属性值
  使用Nightwatch内置的getAttribute方法，定位到class为rsTmb的img标签，读取其src属性的完整值，示例代码：

browser.getAttribute('img.rsTmb', 'src', function(res) {
  const fullSrcPath = res.value;
  // 在此处对完整路径做截取处理
})

• 第二步：从完整src路径中截取目标文件名
  推荐使用路径分割取最后一段的方式实现，该方式不受前面路径层级变动影响，兼容性最好：

// 按斜杠分割路径为数组，取最后一项即为目标文件名
const targetFileName = fullSrcPath.split('/').pop();

如果路径固定无变动，也可以使用lastIndexOf配合substring实现，效果一致：

const targetFileName = fullSrcPath.substring(fullSrcPath.lastIndexOf('/') + 1);

• 完整测试用例参考

module.exports = {
  '提取缩略图文件名测试': function(browser) {
    let extractedFileName = '';
    browser
      .url('对应测试页面地址')
      .waitForElementVisible('img.rsTmb', 3000)
      .getAttribute('img.rsTmb', 'src', function(res) {
        extractedFileName = res.value.split('/').pop();
        // 可将提取到的值挂到全局变量，供跨用例使用
        browser.globals.tmbFileName = extractedFileName;
      })
      // 后续测试步骤直接使用提取到的值即可
      .perform(function() {
        // 示例：断言提取结果正确
        browser.assert.equal(extractedFileName, 'lexus-ux-001.jpg', '文件名提取匹配预期');
        // 其余需要用到该值的测试逻辑
      })
      .end();
  }
}

补充说明：如果测试场景下的src链接末尾带查询参数（形如xxx.jpg?width=100），可以先剔除查询参数再做分割，写法为res.value.split('?')[0].split('/').pop()，避免参数被误算入文件名。

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