尝试使用 async/await 代替 browser.sleep，但它不起作用

Question

我是量角器的新手，从 Angular 应用程序的自动化测试开始。我有一个测试，我需要使用多个 browser.sleep() 来实际等待元素呈现并单击它们。使用 browser.sleep() 可以正常工作，但是当我尝试使用 async/await 时，测试失败，因为它不等待元素。

在我使用 async/await 之前，我确实设置了 SELENIUM_PROMISE_MANAGER: false

这个有效：

browser.get(http://localhost);
browser.sleep(1000);
element(by.cssContainingText('.title1, 'text1')).click();
browser.sleep(1000);
element(by.cssContainingText('.title2', 'text2')).click();

这个不起作用，说找不到第二个元素：

it('should navigate to screen', async function() {
    browser.get(http://localhost);
    browser.wait(function () {
      return element(by.css('.top-navigation')).isPresent();
    }, 5000);
    await element(by.cssContainingText('.title1', 'text1')).click();
    await element(by.cssContainingText('.title2', 'text2')).click();
  });

Answer 1

等待！=等待

await 用于将 promise-chained 元素排队以增加同步性。在您的情况下，您应该在尝试与其交互之前添加等待元素。最简单的方法是创建一个等待元素的函数，然后传递所需的任何元素，如下所示：

声明预期条件：

const EC = protractor.ExpectedConditions; 

编写点击函数：

const clickElement = async function (element) {
    await browser.wait(EC.elementToBeClickable(element));
    await element.click();
};

然后使用它：

it('should navigate to screen', async function() {
    await browser.get(http://localhost);
    await clickElement(element(by.cssContainingText('.title1', 'text1')));
    await clickElement(element(by.cssContainingText('.title2', 'text2')));
});