In protractor, there are, basically, 3 ways to check if an element is present:
var elm = element(by.id(\"myid\"));
browser.isElementPresent(elm);
elm.isPres
I can't speak to which one is preferred but I was able to find the source code and examine it.
According to the docs, elm.isPresent()
and elm.isElementPresent()
are equivalent. Hope that helps.
Protractor API Docs
There is a link to View code
just to the right of the title.
browser.isElementPresent(elm);
https://angular.github.io/protractor/#/api?view=webdriver.WebElement.prototype.isElementPresent
/**
* Schedules a command to test if there is at least one descendant of this
* element that matches the given search criteria.
*
* @param {!(webdriver.Locator|webdriver.By.Hash|Function)} locator The
* locator strategy to use when searching for the element.
* @return {!webdriver.promise.Promise.<boolean>} A promise that will be
* resolved with whether an element could be located on the page.
*/
webdriver.WebElement.prototype.isElementPresent = function(locator) {
return this.findElements(locator).then(function(result) {
return !!result.length;
});
};
elm.isPresent();
https://angular.github.io/protractor/#/api?view=ElementFinder.prototype.isPresent
/**
* Determine whether the element is present on the page.
*
* @view
* <span>{{person.name}}</span>
*
* @example
* // Element exists.
* expect(element(by.binding('person.name')).isPresent()).toBe(true);
*
* // Element not present.
* expect(element(by.binding('notPresent')).isPresent()).toBe(false);
*
* @return {ElementFinder} which resolves to whether
* the element is present on the page.
*/
ElementFinder.prototype.isPresent = function() {
return this.parentElementArrayFinder.getWebElements().then(function(arr) {
if (arr.length === 0) {
return false;
}
return arr[0].isEnabled().then(function() {
return true; // is present, whether it is enabled or not
}, function(err) {
if (err.code == webdriver.error.ErrorCode.STALE_ELEMENT_REFERENCE) {
return false;
} else {
throw err;
}
});
}, function(err) {
if (err.code == webdriver.error.ErrorCode.NO_SUCH_ELEMENT) {
return false;
} else {
throw err;
}
});
};
elm.isElementPresent();
https://angular.github.io/protractor/#/api?view=ElementFinder.prototype.isElementPresent
/**
* Same as ElementFinder.isPresent(), except this checks whether the element
* identified by the subLocator is present, rather than the current element
* finder. i.e. `element(by.css('#abc')).element(by.css('#def')).isPresent()` is
* identical to `element(by.css('#abc')).isElementPresent(by.css('#def'))`.
*
* @see ElementFinder.isPresent
*
* @param {webdriver.Locator} subLocator Locator for element to look for.
* @return {ElementFinder} which resolves to whether
* the subelement is present on the page.
*/
ElementFinder.prototype.isElementPresent = function(subLocator) {
if (!subLocator) {
throw new Error('SubLocator is not supplied as a parameter to ' +
'`isElementPresent(subLocator)`. You are probably looking for the ' +
'function `isPresent()`.');
}
return this.element(subLocator).isPresent();
};
All function in a similar way with subtle differences. Here are few differences that i found -
elm.isPresent() -
ElementFinder
and so waits for Angular to settle on page before executing any action. elm
is an element(locator)
or ElementFinder
and not ElementArrayFinder
. If multiple elements are returned using the locator
specified then first element is checked if it isEnabled()
in the DOM. Doesn't take any parameter as input.elm.isElementPresent(subLoc) - (When there is a sub locator to elm
)
ElementFinder
and so waits for Angular to settle on page before executing any action.sub locator
to the parent elm
as a parameter. (only difference between this and the elm.isPresent()
)browser.isElementPresent(element || Locator) -
webdriver
and so doesn't wait for angular to settle.locator
or an element
as a parameter and uses the first result if multiple elements are located using the same locator.All of the above checks for the presence of an element in DOM and return a boolean
result. Though angular and non-angular features doesn't affect the usage of these methods, but there's an added advantage when the method waits for angular to settle by default and helps avoid errors in case of angular like element not found or state element reference exceptions, etc...
You can check whether the element is present or not by using the isPresent function.
So, your code would be something like:
var myElement = element(by.css('.elementClass'));
expect(myElement.isPresent()).toBeFalsy();
Here is the protractor docs for the isPresent function.