Click() function isn't working in protractor scripts

Question

I\'m trying to automate my tests with Protractor and Appium for an AngularJS site with jasmine framework in iPad simulator, sendkeys() function is working for u

Answer 1

Just adding browser.sleep after the click worked for me:

it('Some test', function () {

    element(by.css("button[type='submit']")).click();
    browser.sleep(1000);
});

Answer 2

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');

Answer 3

Try executing those commands without using the promise chain. It can be a problem in the previous chain.

"use strict";
require("jasmine-expect");
var wd = require("wd");
describe('my app', function() {
it('should make the login test',function() {
  browser.get("http://10.0.22.82:8080/jws/fetablet");
  expect(browser.getCurrentUrl()).toEqual(("http://10.0.22.82:8080/jws/fetablet/#/login"));
  element(by.model('credentials.username')).sendKeys('RET02');
  element(by.model('credentials.password')).sendKeys('RET02');
  element(by.css('.login-button')).click();
  browser.sleep(8000);   
  expect(browser.getCurrentUrl()).not.toEqual("http://10.0.22.82:8080/jws/fetablet/#/login");
});

PS: You can avoid using the 'then' function when you do not need to use the result of the method. It is controlled by the control flow

Answer 4

I have one more suggestion, you can expect particular element need to be displayed and clear the text-box. You can actually write in promise, that is the best way.

  var loginButton = element(by.css('.md-raised.login-button'));
  var userName = element(by.model('credentials.username'));
  var password = element(by.model('credentials.password'));

  this.username = function(sendUserName) {
      expect(userName.isDisplayed()).toBeTruthy();
      userName.clear().then(function(){
          userName.sendKeys(sendUserName).then(function(){
              expect(password.isDisplayed()).toBeTruthy();
          });
      });
  };

  this.password = function(password) {
      expect(password.isDisplayed()).toBeTruthy();
      password.clear().then(function(){
          password.sendKeys(password).then(function(){
              browser.wait(EC.elementToBeClickable(loginButton), 10000);
          });
      });
  };

  this.clickloginbutton = function() {
    expect(loginButton.isDisplayed()).toBeTruthy();
    loginButton.click().then(function(){
      expect('something').not.toBeNull();
    });
 }