Protractor 如何检查元素不存在

Question

我在我的基于Angular的网站中有一个设置，可以打开或关闭下拉菜单。如果关闭，则不会在主页面上显示。

使用Protractor，我需要检查在开关关闭时此元素是否不存在。然而，在一组多个测试中，我不应该被抛出“元素未找到”的错误。我该如何做？

我尝试过：

expect($$('.switch').count()).to.equal(0).and.notify(next);

但是我在这里遇到了一个断言错误...

- Sakamoto Kazuma

Answer 1

对我来说稍微更好一些的选项，是使用 protractor 的“方式”完成操作 http://angular.github.io/protractor/#/api?view=ElementArrayFinder.prototype.all

element.all(by.css('.k-loading-image')).then(function(items) {
    expect(items.length).toBe(0);
});

（我想确认加载指示器已经消失）

- Carl

---

这是唯一一个对我有效的方法，因为element(by.css())如果元素根本不存在，会立即导致测试失败。 - Alexandros V

请注意，在此之前，您可能需要在一行中包含await browser.waitForAngularEnabled(false);以使其按预期工作，或者如果不使用async/await，则使用browser.waitForAngularEnabled(false).then(() => {//check presence of element here})。 - emery

Answer 2

通过在文档中发现的某些内容，我成功地使这件事情工作起来了：

expect(element(by.css('.switch')).isPresent()).to.become(false).and.notify(next);

还使用了断言，因此不会破坏cucumberjs。

- Sakamoto Kazuma

---

请问您能否提供文档链接？我找不到它，但我想使用它。同时很难看出它如何适用于您的测试。这是在运行开关更改之前发生的吗？ - gabereal

我认为自从我上次使用 Protractor 以来，文档已经有了一些变化，但这是我最近找到的链接：http://angular.github.io/protractor/#/api?view=ElementFinder.prototype.isPresent - Sakamoto Kazuma

感谢您的回复。不幸的是，我已经在文档中看到了这个内容，并且正在寻找关于.to.become...和答案部分的文档。但如果我没错的话，这些是chai的一部分？我正在使用jasmine，它似乎不支持相同的功能。 - gabereal

Answer 3

我通过以下方法使其工作：

expect(element(by.css('css')).isPresent()).toBeFalsy();

- Daniel

---

它在某些情况下可以工作，但在同样的情况下无法工作。我需要注意什么吗？尽管我正在使用相同版本的浏览器。 - Aniruddha Das

Answer 4

我尝试了一些包含 count() 的方法，但都不起作用；

$$('.selector').count()的类型是'object'

你需要使用promise来获取 count 的值，就像这样：

const nameSelector = '[data-automation="name-input"]';
const nameInputIsDisplayed = () => {
    return $$(nameSelector).count()
        .then(count => count !== 0)
}
it('should not be displayed', () => {
    nameInputIsDisplayed().then(isDisplayed => {
        expect(isDisplayed).toBeFalsy()
    })
})

- activedecay

Answer 5

这些答案不会等待元素消失。为了等待它消失，您需要使用ExpectedConditions，如下所示。InvisibilityOf检测一个元素是否已经离开了DOM。在这里查看文档：https://www.protractortest.org/#/api?view=ProtractorExpectedConditions。

  export const invisibilityOf = (el) =>
     browser.wait(ExpectedConditions.invisibilityOf(el) as any, 12000, 
    'Element taking too long to disappear in the DOM')
  const el = element(by.css(arg1))
  return invisibilityOf(el)

- evanjmg

Answer 6

stalenessOf 可能是一个不错的选择：Protractor - ExpectedConditions.stalenessOf

例如，您有一个当前打开的模态框。您关闭它并期望它不存在：

element(by.css('.modal-dialog .cancel-button')).click();
browser.wait(EC.stalenessOf(element(by.css('.modal-dialog')), 60000);
expect(element(by.css('.modal-dialog')).isPresent()).toBeFalsy();

- Boris Yakubchik

Answer 7

如果你的开关在配置文件中定义了，你可以这样做：

let dropdownSwitch = config.switch

expect(await $('dropdown css').isPresent()).toBe(dropdownSwitch);

这将涵盖它在开启或关闭时的验证

- Sergey Pleshakov