在什么情况下，我需要使用Protractor ExpectedConditions来等待元素

Question

我是Protractor的新手，我想知道在使用Protractor时，在什么情况下需要使用ExpectedConditions(以下示例)。我认为Protractor会自动确定AngularJS页面何时完全加载。

let EC = ExpectedConditions;
let condition = EC.presenceOf(element(by.id("something"))); 
browser.wait(condition, 10000);

谢谢Eric

Answer 1

根据我使用Protractor的经验，ExpectedConditions的使用取决于您正在自动化的页面的行为。如果条件在指定时间内不符合，则通常会因失败而使用它。

这些条件也会回报一个你可以随心所欲的承诺。

我会给你一些场景，让你了解在哪里使用它们。

1. alertIsPresent()：此条件将等待警报出现

例如：点击按钮后，将出现警报；然而，有一个API调用会使弹出窗口花费更长的时间，而且还有一个小动画，所以我们希望等待几秒钟，但不要超过这个时间。

// will click on a button  
element(by.id('button')).click();  
// will wait for the condition  
let EC = ExpectedConditions;  
browser.wait(EC.alertIsPresent(), 5000);  

以下代码将在单击按钮后等待5秒钟，以查看警报是否存在，否则将引发错误。

2. invisibilityOf()：此条件将等待指定元素未显示

例如：页面中触发的每个操作都会出现一个加载程序。为此，我们希望等到这个加载程序消失，这样我们就可以继续进行自动化过程。根据业务需求，此加载程序所需时间不应超过10秒。

这个加载程序锁定整个页面，所以其他元素在它启动时是不可交互的。

// trigger random action on page so loader appears  
element(by.id('button2')).click();  
// will wait for the condition  
let EC = ExpectedConditions;  
browser.wait(EC.invisibilityOf(element(by.id('loader'))), 10000);  

单击按钮后，我们将给予加载程序消失10秒的宽限期，否则该条件将引发错误。

3. elementToBeClickable()：此条件将等待，直到可以单击指定的元素

例如：默认情况下，登录表单的按钮是禁用的，因此除非我们完成用户名和密码文本字段，否则无法单击它。在填充文本字段后启用的按钮具有快速动画，无论哪种方式，我们都希望给它1秒的时间来完成并检查我们是否能够点击它。

// complete both textfields required for the button to be enabled  
element(by.id('username')).sendKeys('User1234');  
element(by.id('password')).sendKeys('Protractor');  
// will wait for the condition and then will click the button
let EC = ExpectedConditions;  
browser.wait(EC.elementToBeClickable(element(by.id('loginButton'))), 1000);  
element(by.id('loginButton')).click();  

在完成两个文本字段后，条件将等待1秒，等待元素可点击，如果是，则会继续下一行并点击它。另一方面，如果不是，则会引发错误。

4. presenceOf()：在这种情况下，条件将检查元素是否存在于DOM(文档对象模型)中，但不会检查元素是否可见

例如：在一个包含3种口味的单选按钮组的页面上：巧克力、香草和草莓。根据您的选择，您将看到不同的问题。开发人员提到，这些问题随时都在页面中，但由于此时选择了哪个单选按钮而被隐藏。在这种情况下，我们只想检查DOM中是否存在所有问题，无论是否会通过选择单选按钮显示这些问题。

// check all questions directly, without selecting any radio buttons  
let EC = ExpectedConditions; 
browser.wait(EC.presenceOf(element(by.id('question-1'))), 1000);  
browser.wait(EC.presenceOf(element(by.id('question-2'))), 1000);  
browser.wait(EC.presenceOf(element(by.id('question-3'))), 1000);  

时间在这里是无关紧要的；尽管如此，使用这些条件，我们将能够检查DOM中是否存在隐藏的问题。如果缺少一个，错误将立即中断测试。

---

这是我过去不得不处理的几个例子。条件的使用是情境性的，当你想使用现有条件时，它们大多很有用，因为它们可以节省你自己构建它们的时间。

PD：更多信息可以在Protractor API中找到。