How to wait for element not to be present anymore

Question

I have a protractor test that navigates to another url, which cannot be found/resolved in my test environment, so I check if the title is not the previous title.

The test is as follows:

it('should navigate to another site in case of click on cancel link', function () {
    page.navigate();
    page.submit();
    protractor.getInstance().ignoreSynchronization = true;
    browser.wait(function(){
        return element(by.id('submit')).isPresent();
    });
    page.closePage();
    // the title of a 404, dns issue etc is at least different from the previous site:
    expect(browser.getTitle()).not.toEqual('MyDummyTitle')
    protractor.getInstance().ignoreSynchronization = false;
});

This works in most browsers, but in Internet Explorer I find that it often is not ready navigating to the non-existing page when the expect is fired.

Can I somehow wait for the 'submit' element to be gone, similar to what I do before firing the closePage?

Answer 1

What I do in this cases is an active wait of an element to disappear:

Using a custom waitAbsent() helper function that actively waits for an element to disappear either by becoming invisible or by not being present.

That helper waits up to specTimeoutMs ignoring useless webdriver errors like StaleElementError.

Usage: add require('./waitAbsent.js'); in your onPrepare block or file.

Example to wait for #submit to be gone:

expect(element(by.id('submit')).waitAbsent()).toBeTruthy();