Protractor waiting for element to be in DOM

Question

I have been having some trouble using Protractor. I have a really weird ui-router state where its hard to go off of other elements to start working with the page. Is there any way to tell protractor to wait until an element finally appears in the DOM? Not visible/displayed, but actually created? I keep trying to use wait for the element but it is clearly not available to be selected.

browser.driver.wait(function () {
    return elem.isDisplayed();
});

Answer 1

the first parameter of browser.wait is a function, if we need to wait until an element is present irrespective of time, then we can use the below code, If you need to restrict the wait to a particular time please give time as second parameter of 'browser.wait'

browser.wait(function() {
    return element(by.css("#edudrop1")).isPresent()});

Answer 2

Protractor has included ExpectedCondition for explicit wait which lets you wait for the element for certain period of time. You should be able to do the following

var EC = protractor.ExpectedConditions;

browser.driver.wait(function () {
    browser.wait(EC.visibilityOf(elem), 10000);
    return elem;
});

Answer 3

You should be able to use browser.wait together with the presenceOf ExpectedCondition:

var until = protractor.ExpectedConditions;
browser.wait(until.presenceOf(elem), 5000, 'Element taking too long to appear in the DOM');