protractor get url after click() - angularjs

i'm new with protractor.. i need you'r help..
my code go like this..
describe('Protractor Demo Charts', function () {
var url = 'https://angularjs.org/';
it('should get the value of attribute d', function () {
browser.get(url);
element(by.css('.btn-warning')).click().then(function(text){
expect(browser.getCurrentUrl()).toContain('0BxgtL8yFJbacQmpCc1NMV3d5dnM');
}
);
});
});
my problem is that browser.getCurrentUrl() still return me the base url (the page that i came from 'https://angularjs.org/' )
how can i get the new Url (the URL AFTER the click )?

May you should wait until the page has been loaded.
Try this way :
describe('Protractor Demo Charts', function () {
var url = 'https://angularjs.org/';
it('should get the value of attribute d', function () {
browser.get(url);
browser.sleep(2000);
$('.btn-warning').click();
expect(browser.getCurrentUrl()).toContain('0BxgtL8yFJbacQmpCc1NMV3d5dnM');
});
});
From the doc:
Protractor will ensure that commands will automatically run in sync. For example, in the following code, element(by.model(...)).click() will run before browser2.$('.css').click():
browser.get('http://www.angularjs.org');
browser2.get('http://localhost:1234');
browser.sleep(5000);
element(by.model(...)).click();
browser2.$('.css').click();

Related

Use protractor on an non angular page

in my recent test I need to first login and take some actions on an non angular page (https://www.qa.dealertrack.com/default1.aspx)
then switch to an angular page and finish the test.
In conf I have
global.driver = browser.driver;
My page object looks like:
var LogInPage = function() {
this.loginUrl = 'https://www.qa.dealertrack.com/default1.aspx';
this.id = browser.driver.findElement(by.name('username'));
this.password = browser.driver.findElement(by.name('password'));
this.loginButton = browser.driver.findElement(by.name('login'));
this.logIn = function(id, password) {
// maximize window
driver.manage().window().maximize();
// log in
driver.get('https://www.qa.dealertrack.com/default1.aspx');
this.id.sendKeys(id);
this.password.sendKeys(password);
this.loginButton.click();
}
};
My test looks like:
describe('Sample Test - Log In', function() {
var loginPage = require('../pages/LogInPage.js');
/**
* Disable waiting for AngularJS for none Angular page
*/
beforeEach(function() {
isAngularSite(false);
});
it('logging in', function() {
loginPage.logIn('xxx', 'xxx');
})
})
However, even before getting to the site, protractor throws error NoSuchElementError: no such element: Unable to locate element:{'method':'name','selector':'username'}
But when I commented out all the element variables and related lines, only left
driver.get(this/loginUrl);
It worked. Why would browser.driver.get works but browser.driver.findElement does not?
This is my first question on Stackoverflow. Thank everyone!!
Before login you need to set
browser.driver.ignoreSynchronization=true;
So it shold be like
browser.driver.ignoreSynchronization=true;
login();
browser.driver.ignoreSynchronization=false;
I tried to removed all the elements I declared outside my functions in page object. Instead of that, I just hard code the elements in the function. And it worked.

How to say protractor to wait till page loads?

My application taking some to page the login page.So protractor trying to enter the user name before page loads.So i need to say protractor to wait till the login page loads.
Could you please help me what command I need to use for this and where I need to use?(Please modify my code to add the wait command)
PFB for my onPrepare and beforeeach function
onPrepare: function() {
browser.driver.manage().window().maximize();
jasmine.getEnv().addReporter(new HtmlReporter({
})
}
beforeEach(function() {
browser.get('https://accounts.google.com/');
//browser.manage().timeouts().pageLoadTimeout(30000);
//browser.manage().timeouts().implicitlyWait(5000);
//browser.sleep( 10000 );
//browser.waitForAngular();
});
I used those commented functions,but it didn't work for me.
Please guide me.thanks in advance.
Assuming you want to click the Get Started button, wait for the button to become clickable:
var EC = protractor.ExpectedConditions;
var getStarted = element(by.css('button[title="Get started"]'));
browser.wait(EC.elementToBeClickable(getStarted), 5000);
getStarted.click();
Use the wait command: browser.driver.wait(condition, timeout);
onPrepare: function() {
browser.driver.manage().window().maximize();
jasmine.getEnv().addReporter(new HtmlReporter({
});
}
beforeEach(function() {
browser.driver.get('https://accounts.google.com/');
return browser.driver.wait(function() {
return browser.driver.getCurrentUrl().then(function (url) {
return url.indexOf('https://accounts.google.com/') > -1;
});
}, 5000);
//whatever you want after
});
you can wait for any condition like that.
Also, google f.e is not an angular page, so you should use:
browser.driver.get instead of protractors browser.get,
or it will wait for angular on the page.

How to handle modal-dialog box in Protractor?

I am trying to use sendKeys() on a modal-dialog box on this website. This dialog box appears after clicking Sign In button. I cannot seem to find any way to switch focus on the box. See the gist
I tried using browser.driver.switchTo().activeElement(); in
InvalidLogInUnSuccess: {
get: function () {
this.loginButton.click();
browser.driver.switchTo().activeElement();
this.email.sendKeys("Test");
}
}
with no luck and throws ElementNotVisibleError
Message:
ElementNotVisibleError: element not visible
(Session info: chrome=41.0.2272.101)
(Driver info: chromedriver=2.14.313457 (3d645c400edf2e2c500566c9aa096063e707c9cf),platform=Windows NT 6.3 x86_64)
Stacktrace:
ElementNotVisibleError: element not visible
I've experienced a similar issue while testing an internal application when a popup was being opened with an animation effect (I think it is a culprit here) which had me think about waiting for an element inside the popup to become visible.
visibilityOf expected condition works for me in this case:
var email = element(by.css('.container.login.ng-scope #email'));
browser.wait(EC.visibilityOf(email), 5000);
email.sendKeys('test');
where EC is something I usually define globally in the onPrepare():
onPrepare: function () {
...
global.EC = protractor.ExpectedConditions;
},
Just a side note, I think the locator could be improved here:
ng-scope is not something I would rely on
there is a model defined on the email field, how about:
element(by.model('email'));
FYI, the complete spec I've executed:
"use strict";
describe("gifteng test", function () {
var scope = {};
beforeEach(function () {
browser.get("http://www.gifteng.com/?login");
browser.waitForAngular();
});
describe("Logging in", function () {
it("should send keys to email", function () {
var email = element(by.css('.container.login.ng-scope #email'));
browser.wait(EC.visibilityOf(email), 5000);
email.sendKeys('test');
});
});
});
Protractor works with promises you should write :
InvalidLogInUnSuccess: {
get: async() => {
await this.loginButton.click();
await browser.driver.switchTo().activeElement();
await this.email.sendKeys("Test");
just apply Promises before protractor code. I removed function and write async. so i applied async/await.
reference: Link

Protractor selector and event issue

I'm trying to create some tests for my app, using protractor.
The browser.get is ok, and when my page is loaded and my app bootstraped, the first test is running.
it('should go to the where and when page', function() {
var nextButton = element(by.id('cg_btnValidationQuoi'));
expect(nextButton.getText()).toBe('Suivant');
}
This cause a timedout.
it('should go to the where and when page', function() {
var nextButton = element(by.id('cg_btnValidationQuoi'));
nextButton.click()
}
Cause "Error: No element found using locator: By.id("cg_btnValidationQuoi")"
it('should go to the where and when page', function() {
var nextButton = element(by.id('cg_btnValidationQuoi'));
expect(nextButton.getInnerHtml()).toBe('Suivant');
}
Cause :
Message:
Expected '
Suivant
' to be 'Suivant'.
Does it sound like anything that anybody knows?
toBe() checks to see if its the exact same object (string). I'd suggest using toEqual() and see if it works. More info in this SO Answer

protractor expect currenturl fails

I'm trying to get an e2e test running against my local server and test that the resulting url (after a navigational button has been clicked) is the correct result. However the resulting url is always false.
My code is shown below:
HTML:
//http://localhost/#/current_Page
<html>
<head><title></title></head>
<body>
//should change the current url to
//http://localhost/#/new_page
<button class="button" ng-click="change_page()">Change Page</button>
</html>
TEST CODE:
var protractor = require('protractor');
require('protractor/jasminewd');
describe('Tests', function() {
var ptor;
describe('Test 1', function() {
var ptor = protractor.getInstance();
ptor.get('#/current_page');
it('change page and current url', function() {
ptor.findElement(protractor.By.className('.button').click().then(function() {
expect(ptor.currentUrl()).toContain('#/new_page');
});
});
}, 30000);
});
The issue is the current url after clicking the button remains #/current_url and does not change to the expected result #/new_page.
Does anyone know where I have gone wrong?
After search for the answer to this question I figured it out myself
The current url does not fail, I was not waiting for the promise to return to angular. The ammended code below shows where I had gone wrong
var protractor = require('protractor');
require('protractor/jasminewd');
describe('Tests', function() {
var ptor;
describe('Test 1', function() {
var ptor = protractor.getInstance();
ptor.get('#/current_page');
it('change page and current url', function() {
ptor.findElement(protractor.By.className('.button').click().then(function() {
ptor.waitForAngular();
expect(ptor.currentUrl()).toContain('#/new_page');
});
});
}, 30000);
});
This then waits for angular to route to the new page and update any bindings and then proceeds to check the expected result which is now what I would expect it to be.
Please be advised that this does not solve all issues relating to unexpected getCurrentUrl() results. if using driver.findElement() you may need to refer to JulieMR's answer to this question
I hope this helps someone stuck on this issue.
In Protractor 1.5.0 protractor.getInstance(); isn't working anymore, so you have to use browser instead.
var protractor = require('protractor');
require('protractor/jasminewd');
describe('Tests', function() {
describe('Test 1', function() {
browser.get('#/current_page');
it('change page and current url', function() {
ptor.findElement(protractor.By.className('.button').click().then(function() {
browser.waitForAngular();
expect(browser.getCurrentUrl()).toContain('#/new_page');
});
});
}, 30000);
});
You can also write a custom expected condition to wait for current url to being equal a desired one. Besides, use browser and element notations:
browser.get("#/current_page");
it("change page and current url", function() {
element(by.css(".button")).click();
browser.wait(urlChanged("#/new_page")), 5000);
});
where urlChanged is:
var urlChanged = function(url) {
return function () {
return browser.getCurrentUrl().then(function(actualUrl) {
return actualUrl.indexOf(url) >= 0;
});
};
};
Or, a Protractor>=4.0.0 solution and the urlContains expected condition:
element(by.css(".button")).click();
var EC = protractor.ExpectedConditions;
browser.wait(EC.urlContains("#/new_page"), 5000);

Resources