k.vincent
k.vincent

Reputation: 4143

Protractor Failed: element not interactable

I am running an E2E test for an Angular 7.x app. The test runs straight forward on my local machine. But when I push it on the repo (GitLab), then pipeline fails and throws following error:

USER PROFILE - Check and change PROFILE - Failed: element not interactable (Session info: chrome=71.0.3578.80) (Driver info: chromedriver=2.45.615279 (12b89733300bd268cff3b78fc76cb8f3a7cc44e5),platform=Linux 4.14.74-coreos x86_64)

Test Case:

it('USER PROFILE - Check and change PROFILE', () => {

    page.navigateTo();

    browser.sleep(1000);
    expect(page.getProfileEditTagName()).toMatch('app-edit-profile');

    expect(element(by.className('logged-as')).getText()).toBe( testEmail );


    browser.actions().mouseMove( element.all( by.id('editIcon-salutation') ).get(0)).click().perform().then(function () {
        browser.sleep(4000);

        element( by.className('mat-select-arrow') ).click().then(function () {

            browser.actions().mouseMove( element.all(by.className('option-value mat-option')).get(0)).click().perform();
            browser.sleep(1000);
            browser.actions().mouseMove( element.all( by.id('saveButton-salutation') ).get(0)).click().perform();
            browser.sleep(1000);

        });
    });

});

navigateTo() is just a method in profile.po.ts:

navigateTo() {
    browser.get('/profileComponentUrl');
}

What's confusing me and where I even can't localize the bug or what's wrong, is that it works fine locally. But once I push to repo, then it fails exactly at that test case. Any Hint please?

Upvotes: 9

Views: 24730

Answers (4)

Antti Tanskanen
Antti Tanskanen

Reputation: 505

I had a same kind of problem and I found this.

I copy pasted that (and some other minor tweaks for example force clicking on previous page in for-loop) and it worked. I believe that the browser.driver.manage().window().maximize(); was part of the solution.

Upvotes: 2

Raschid JFR
Raschid JFR

Reputation: 650

I'd recommend to:

  • Enable the stacktrace in protractor config: new SpecReporter({ spec: { displayStacktrace: true } }) so you can see exactly what element is throwing the error. This won't solve it but at least should point you in the right direction.
  • Then if you're using tabs, buttons or other elements that hide/show/disable/enable or change the DOM view, you add a browser.sleep(100) after calling a .click()

Upvotes: 5

Athar
Athar

Reputation: 19

One reason which i figure out is the scroll issue. You need to check the element is displaying properly or not. It may be hidden. So use scrollToTop/scrollToElement/scrollToElementView etc. You can write different scroll methods which suites the condition better.

Another reason is the locator. Try to change the locator, do not trim the locator too much. Just try with full body css locator, if it works then trim properly. Some time in chrome console it may work but not with the test case.

Upvotes: 1

Snehalkumar Mahale
Snehalkumar Mahale

Reputation: 186

The reason element is not interactable could be - performing an action on hidden or obscured element.

You can try - 1. add sleep after by.className('mat-select-arrow') ).click(), as I can see you have not added any waits there. 2. Try to check if you running the test on your local and Jenkins machine with same screen resolution. (this could be the reason of obscured element)

Upvotes: 4

Related Questions