If element is not present, I'm getting error same adding conditional function

Question

Currently I have a page that there is an element that is displayed randomly. For that, I created a condition function:

this.checkDropdownPresent = function (dropdownLocator, chooseOption) {
    dropdownLocator.isPresent().then(function(element) {
        if (element) {
            let select = dropdownLocator;
            select.element(by.cssContainingText('option', chooseOption)).click();
        }
    });
};

When the element is displayed in the screen, that's working fine and protractor interact with it, but when the element IN NOT DISPLAYED in the screen, I'm getting the message:

Failed: element not visible: Element is not currently visible and may not be manipulated

Any tip to help me with that?

Sounds like you need to check if the element is visible, not just if it exists. — Barmar, Sep 15 '17 at 17:40
Related: https://stackoverflow.com/questions/36544589/element-is-not-currently-visible-and-so-may-not-be-interacted-with-when-clicking — Barmar, Sep 15 '17 at 17:41

score 1 · Answer 1 · answered Sep 15 '17 at 17:56

You'll need to also check if element is displayed. Your element is present (i.e. part of the DOM) but it's hidden. Note that you can't only check if element is displayed without first checking if it's present. isDisplayed() method throws error if element is not present.

this.checkDropdownPresent = function (dropdownLocator, chooseOption) {
    dropdownLocator.isPresent().then(function (present) {
        if (present) {
            dropdownLocator.isDisplayed().then(function (displayed) {
                if (displayed) {
                    let select = dropdownLocator;
                    select.element(by.cssContainingText('option', chooseOption)).click();
                }
            });
        }
    });
};

score 0 · Answer 2 · answered Sep 15 '17 at 18:29

0

Thanks all for the replies.

I solved my problem changing isPresent() to isDisplayed(). See my code now:

this.checkDropdownPresent = function (dropdownLocator, chooseOption) {
    dropdownLocator.isDisplayed().then(function(element) {
        if (element) {
            let select = dropdownLocator;
            select.element(by.cssContainingText('option', chooseOption)).click();
        }
    });
};

answered Sep 15 '17 at 18:29

Rafael C.

2,245
4
29
45

1

You should read finspin's answer again, its a little better considering you want to use the conditional click. "`isDisplayed()` method throws error if element is not present."... so if you want to avoid a possible error, its better to check for both in your scenario. I would mark his answer as correct. – Gunderson Sep 15 '17 at 18:50

If element is not present, I'm getting error same adding conditional function

2 Answers2