发送密钥不适用于页面对象模型

Question

我刚刚开始在非角度应用程序上使用Protractor对页面对象模型进行实验。我不是新手，但远不是专家，所以如果我的措辞完全错误，请原谅我。几天来，我一直在研究和尝试建议，但运气不佳。我有这个元素-

<input type="text" class="form-control" name="form_component_data[AgentsSettings][agent][chat_welcome_msg]" id="agentssettings-agent-chat_welcome_msg" value="How can I help">

在我的POM中，我有

var txtWelcomemessage = element(by.css("input[name='form_component_data[AgentsSettings][agent][chat_welcome_msg]']"));
this.clearWelcomemessage = function(){
txtWelcomemessage.clear();
};
this.clearWelcomemessage = function(){
txtWelcomemessage.clear();
};
this.setWelcomemessage = function(){
txtWelcomemessage.sendKeys();
};

在我的测试脚本中，我有

settings.clearWelcomemessage();
browser.sleep('5000');
settings.setWelcomemessage('Hey, Hey, Hey');
browser.sleep('5000');

清除消息有效，我在清除消息后看到光标在字段中，但发送键什么都不做，也没有错误。

但是，当我将下面的代码直接输入到测试脚本中时，消息就会清除，发送键也能正常工作。

driver.findElement(by.css("input[name='form_component_data[AgentsSettings][agent] 
[chat_welcome_msg]']")).click();
browser.sleep('3500')
driver.findElement(by.css("input[name='form_component_data[AgentsSettings][agent] 
[chat_welcome_msg]']")).sendKeys('Hey, Hey, Hey');

到目前为止，这是我在应用程序中使用的第三个领域。前两个领域使用POM工作，没有任何问题。我不确定这次有什么不同。我可以使用它来解决问题，但我只是想知道页面对象中缺少什么。

Answer 1

如果您的真实代码如下所示：

settings.clearWelcomemessage();
browser.sleep('5000');
settings.setWelcomemessage('Hey, Hey, Hey');
browser.sleep('5000');

那么这将不起作用，因为所有这些操作都是asynchronius函数。意味着他们不执行"；线性"；。其他编程语言通常会在进入下一行之前等待函数完成，但在js/nodejs中进行异步操作的情况下，情况并非如此。

请尝试正确等待执行的每个功能：：

settings.clearWelcomemessage().then(() => {
console.log('cleared welcome messgae! ')
return browser.sleep('5000').then(() => {
console.log('slept 5000')
return settings.setWelcomemessage('Hey, Hey, Hey').then(() => {
console.log('welcome message set!')
return browser.sleep('5000').then(() => {
console.log('second sleap done!')
})
})
})
}).catch(err => console.error('error occured!', err))

您还必须调整函数本身。他们执行async操作，并且应该始终返回结果，因为它们返回一个Promise对象。文档

编辑：

实际上，在sendKeys((中添加一个参数。如果没有，就不会发送密钥。。

this.clearWelcomemessage = function(){
return txtWelcomemessage.clear();
};
this.clearWelcomemessage = function(){
return txtWelcomemessage.clear();
};
// add message parameter. Or no message will be sent :) 
this.setWelcomemessage = function(message){
return txtWelcomemessage.sendKeys(message);
};

如果这解决了问题，您应该分别学习promises。async & await等

如果您知道async操作及其工作方式，请调整问题中的代码，因为它不是原始代码。。