NightwatchJS获取元素data-page-view-threshold属性返回null如何解决

你的代码存在3处明显错误，对应修改方案如下：

• 核心报错原因：document.getElementById() 方法仅需要传入纯ID值，不需要加CSS选择器的#前缀。你传入#newsletterSignup会尝试查找ID为#newsletterSignup的元素，该元素不存在所以返回null，调用getAttribute就会触发空指针报错。
• 多余参数问题：browser.execute() 内部的JS代码是在浏览器端沙箱执行，直接调用浏览器全局的document即可，测试用例入参里的document是Node.js环境的对象，不需要传入也不能在浏览器端使用。
• 关闭浏览器方法错误：NightwatchJS 官方提供的关闭浏览器API是browser.end()，你写的browser.browserEnd()是不存在的错误调用。

修正后的完整代码 #

module.exports = {
    'Navigate to an homepage': function (browser) {
        browser.url(browser.launch_url);
        browser.pause(5000);
        browser.execute(function() {
            // 去掉ID前的#前缀
            return document.getElementById('newsletterSignup').getAttribute('data-page-view-threshold');
        }, [ ], function callback(result) {
            console.log('Result from execute', result);
            // 可直接在此处添加断言校验属性值
            browser.assert.equal(result.value, 3, '属性值校验通过');
        });
    },
    'Closing the browser': function (browser)  {
        // 修正关闭浏览器的API
        browser.end();
    },
};

更简洁的替代写法 #

你不需要手动调用execute写原生JS获取属性，NightwatchJS内置了getAttribute命令，直接使用即可：

browser.getAttribute('#newsletterSignup', 'data-page-view-threshold', function(result) {
    console.log('获取到的属性值：', result.value);
    browser.assert.equal(result.value, 3);
})

注意：内置getAttribute方法使用CSS选择器定位元素，所以ID前需要加#前缀

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