Protractor says element is displayed while it's not

Hi @juliemr

I have another test fails even if it does the right thing and the app also behaves correct.

The running app is here: http://shopware40demo.couchcommerce.com/

You can open a search bar by clicking the search icon in the header. I have a test for it, that checks if this is working:

    it('should show search bar on click on search icon', function () {
        app.openSearchBar();
        expect(app.searchBar().isDisplayed()).toBe(true);
    });

The page objects method openSearchBar() looks like this:

    this.openSearchBar = function () {
        element(by.className('cc-header__icon--search')).click();
    };

This test runs successfully. Now, I have another test, that should check, if the app also closes the search bar, when clicking the regarding button.

The test looks like this:

    it('should close search bar', function () {
        app.openSearchBar();
        app.closeSearchBar();
        expect(app.searchBar().isDisplayed()).toBe(false);
    });

The closeSearchbar() method on the page object is defined as follows:

    this.closeSearchBar = function () {
        element(by.className('cc-search-box__close')).click();
    };

But this test fails, it says that the search bar is still displayed even after closing it:

< Failures:
<   1) CouchCommerce App should close search bar
<    Message:
<      Expected true to be false.
<    Stacktrace:

<      Error: Expected true to be false.
<     at promises.not (/usr/local/lib/node_modules/protractor/jasminewd/index.js:88:34)
< Finished in 33.715 seconds

< 7 tests, 7 assertions, 1 failure
<

program terminated

I added debugger statements to check if everything work out fine.

    it('should close search bar', function () {
        app.openSearchBar();
        browser.debugger();
        app.closeSearchBar();
        browser.debugger();
        expect(app.searchBar().isDisplayed()).toBe(false);
    });

Everything works as expected! But app.searchBar().isDisplayed() still resolves with true.

Is that a bug with protractor, or is there anything I can do to make it work?

[elgalu]

The thing is that isDisplayed() returns a webdriver.promise.Promise so:

element(by.css('.navbar-toggle')).isDisplayed().then(function(visible) {
  if (visible) {
    ...
  } else {
    ...
  }
});

So how jasmine can evaluate the correct result? that’s actually jasminewd wrapping matchers so that it can take webdriverJS promises.

[defx]

@juliemr I encountered this issue whilst writing protractor tests for a carousel component where each slide is absolutely positioned. In it’s initial state (the carousel showing slide 1), calling isDisplayed on slide 1 and 2 correctly return true and false respectively, but after paging to slide 2 then calling isDisplayed again, slide 1 and 2 return true and true respectively, even though slide 1 is now out of view. Here’s the gist of my workaround for anybody encountering the same issue.