I have an AngularJS app which authenticates using oAuth SSO at GitHub. I am trying to figure out a way to use protractor and automate the login tests. I cannot figure out how to retrieve a non-angular field and how to manage wait'ing for the page to load with browser.driver
, My spec looks like this:
// Create a repository
describe('login', function() {
it('should login', function() {
// this issues a redirect to GitHub
browser.driver.get( process.env.HOST + '/auth/github' )
browser.sleep( 4000 ); // Sleep to make sure page loads fully..
// browser.debugger(); // tried to use debugger...
var login = element( by.id( "login_field" ) );
login.sendKeys( process.env.USERNAME );
var password = element( by.id( "password" ) );
password.sendKeys( process.env.PASSWORD )
});
});
I run the command like this:
HOST=http://someserver.com.dev USERNAME=foobar PASSWORD=barfoo protractor config/protractor.conf
How can I properly load the authenticate page, enter the correct information into the fields, and then wait for redirection back into my Angularized application (I can handle things from there).
I tried to use the debugger to jump into this code, but it was not intuitive for me. When the debugger blocked, I did not seem to be inside my code, but inside of cli.js. If I hit 'c' then my script continued all the way to execution and failed without blocking further. Am I misunderstanding where to use the debugger command inside my script? And, from the Chrome inspector I hoped to to use window.clientSideScripts.findInputs
but was thwarted there as well; these seem to be for AngularJS elements, not elements which are not angularized.
Protractor is a test framework for web applications. Even though its primary use is for performing end-to-end testing in Angular and AngularJS applications, you can also use it for regular, non-Angular websites.
Now protractor supports both angular and Non-Angular applications. The protractor is wrapper written on top of Webdriver. js, all the features which are supported in Selenium Webdriver are supported by it, in addition to angular specific features.
Earlier this year, the Angular team announced that they would cease development for open source end-to-end automated testing tool Protractor at the end of 2022. As a popular and long-established tool for automated web application testing, Protractor was an early pioneer in enabling behavior-driven end-to-end testing.
Testing non-angular pages with Protractor can be tricky regarding waiting for stuff.
I suggest you upgrade Protractor to latest (1.5.0 as of now), use a custom function waitReady() that browser.wait
for elements ready and rewrite your test like below.
// TODO: use page objects
var loginNameInputElm = $('#login_field'); // or element(by.id('login_field'))
var passwordInputElm = $('#password'); // same as element(by.id('password'))
var loginBtnElm = $('button[type=submit]');
it('non-angular page so ignore sync and active wait to load', function() {
browser.ignoreSynchronization = true;
browser.get(process.env.HOST + '/auth/github');
expect(loginNameInputElm.waitReady()).toBeTruthy();
expect(passwordInputElm.waitReady()).toBeTruthy();
});
it('should fill user and password and logins', function() {
loginNameInputElm.sendKeys(process.env.USERNAME);
passwordInputElm.sendKeys(process.env.PASSWORD);
loginBtnElm.click();
});
it('restores ignore sync when switching back to angular pages', function() {
browser.ignoreSynchronization = false; // restore
browser.get('/some-angular-page');
});
More details of why waitReady
here.
Note: in the past I've suggested setting a high implicit, e.g.
browser.manage().timeouts().implicitlyWait(5000);
That hack allows to you avoid waitReady
and keep using the standard
expect(loginNameInputElm.isPresent()).toBeTruthy();
But has an ugly disadvantage when testing for elements NOT present, i.e. when testing for absent or non visible elements in which case it will wait 5 seconds (5000ms) in vane, e.g. when doing
expect(someNonExistingElm.isPresent()).toBeFalsy();
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With