Verify an element is not existing using webdriver and selenium

Question

I'm using WebdriverIO and selenium-standalone to write automated tests that will verify that various parts of our user interface are working.

I need to verify that an element is not present on the page. For example, our system allows staff to track various types of resources that we are referring clients to. If a staff member accidentally adds the wrong resource, they can delete it, and I want to verify that the resource was actually deleted and is not present on the page.

WebdriverIO has an .isExisting() property, but no way to check if something is not existing (or not visible/present). I could also use Chai assertions to figure this out, but haven't delved into that world yet.

Here's a snippet of my code:

it('I can delete a resource from a need', function() {
    return driver
    .moveToObject('span.ccx-tasklist-task') // Hover mouse over resource
    .click('div.referral-controls a.btn.dropdown-standalone') // Click Resource drop-down
    .click('div.referral-controls.ccx-dropdown-menu-selected li > a') // Delete Resource
    .pause(2000);
    // Need to Verify that resource was deleted here

Any advice? Let me know if you need more information.

Answer 1

You can waitForExist with the reverse option set to true.

.waitForExist( '[id$=OpenNeedsPanel] div.commodities', 500, true )

Answer 2

I was able to verify that an element didn't exist on the page like this:

.isExisting('[id$=OpenNeedsPanel] div.commodities').should.eventually.equal(false);