Protractor中获取输入框值返回[object Object]，如何获取实际值？

嘿，这是个很常见的新手问题，根源在于Protractor的核心API都是异步的——getAttribute('value')返回的不是直接的字符串值，而是一个Promise对象，所以你直接和字符串拼接打印，就会输出[object Object]啦。下面给你两种简单易懂的解决方法：

方法一：使用Promise的then()方法 #

Promise是JavaScript处理异步操作的标准方式，我们可以通过then()方法获取Promise解析后的实际值：

var firstNumber = element(by.model('first'));
firstNumber.sendKeys(1);
firstNumber.getAttribute('value').then(function(inputValue) {
  console.log("Value from input box is: " + inputValue);
});

当getAttribute完成异步获取操作后，会把输入框的真实值传给then()里的回调函数，这时再打印就能得到你想要的结果了。

方法二：使用async/await（更推荐） #

如果你用的是较新的JavaScript环境，async/await语法能让异步代码看起来像同步代码，可读性强很多：

// 注意要把测试函数声明为async
it('should retrieve input box value', async function() {
  var firstNumber = element(by.model('first'));
  // 等待sendKeys完成输入操作，确保值已经写入输入框
  await firstNumber.sendKeys(1);
  // 等待getAttribute返回实际值
  var inputValue = await firstNumber.getAttribute('value');
  console.log("Value from input box is: " + inputValue);
});

这里的await关键字会暂停代码执行，直到Promise解析完成，直接返回我们需要的字符串值。另外，sendKeys本身也是异步操作，加上await能避免出现“还没完成输入就去取值”的情况，保证拿到的是最新的输入值。

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