Click() function isn’t working in protractor scripts

There might be multiple reasons for that and it is going to be a guessing game anyway.

• it could be that there is an another element matching the .login-button locator and you are clicking a different element. Let’s improve the locator:

  element(by.css(".login-form .login-button")).click();
  

• wait for the element to be clickable:

  var EC = protractor.ExpectedConditions;
  element(by.model('credentials.username')).sendKeys('RET02');
  element(by.model('credentials.password')).sendKeys('RET02');
  
  var loginButton = element(by.css('.login-form .login-button'));
  browser.wait(EC.elementToBeClickable(loginButton), 5000);
  loginButton.click();
  

• add a small delay before clicking the element (silly, but I see that helped sometimes):

  element(by.model('credentials.username')).sendKeys('RET02');
  element(by.model('credentials.password')).sendKeys('RET02');
  browser.sleep(500);
  element(by.css('.login-form .login-button')).click();
  

• another silly try, click 2 times (I cannot believe I actually advise that):

  var loginButton = element(by.css('.login-form .login-button'));
  loginButton.click();
  loginButton.click();
  

• disable angular animations

• click the button via browser.actions() moving to the element before the click:

  var loginButton = element(by.css('.login-form .login-button'));
  browser.actions().mouseMove(loginButton).click().perform();
  

• sort of an extension to the previous approach. Move to element, sleep for half a second and then click:

  browser.actions.mouseMove(loginButton).perform();
  browser.sleep(500);
  loginButton.click();
  

  Or, if you would introduce a custom sleep() action, you can do:

  browser.actions.mouseMove(loginButton).sleep(500).click().perform();
  

• click the element via javascript:

  var loginButton = element(by.css('.login-form .login-button'));
  browser.executeScript("arguments[0].click();", loginButton);
  

And, after the form is submitted, instead of browser.sleep(), you can wait for URL to change explicitly, please see:

• Protractor- Generic wait for URL to change

---

As a side note, in Protractor, you use the $ and $$ shortcuts for the CSS locators:

var loginButton = $('.login-form .login-button');