Angular 2 Protractor: Click div element

Question

My html code looks like this:

<div class="btn-login1 btn-login-email" (click)="optionSelected('Email')">
        <i class="fa fa-at fa-fw"></i><span>
            Sign in with Email
        </span>
    </div>

Using Protractor, I need to test the click function. I have this code in my test case:

ele = element(by.css('.btn-login1'));
expect(ele).toBeTruthy();
ele.click();

When I run the test case, I get this error:

Failed: Timed out waiting for asynchronous Angular tasks to finish after 11 seconds. This may be because the current page is not an Angular application. Please see the FAQ for more details: https://github.com/angular/protractor/blob/master/docs/timeouts.md#waiting-for-angular While waiting for element with locator - Locator: By(css selector, .btn-login1)

I have updated the configuration file with the timeout value and still get a similar error about timeout. I believe this could be because a div element is being clicked. My other test case about a button being clicked works fine.

How do I go about writing this test case?

Have you tried to pass the whole class name? I don't believe much but worth trying — Vega

Bluejuice Bluejuice · Accepted Answer · 2017-08-22T18:02:14

Since you're not testing an Angular application you need to set:

browser.ignoreSynchronization = true;

Even if it is an Angular Application try this.

I also find I get the best results including the entire attribute when locating elements like:

ele = element(by.css('[class="btn-login1 btn-login-email"]'));

Angular 2 Protractor: Click div element

1 Answers