Protractor and node.js automation suite for Crimson Login Page

<< return to main page

I wanted to have a practice at writing a Protractor automation suite using node.js and the jasmine test framework. I decided to use these when I was asked to automate some checks on the Crimson Test Login Page

Protractor is intended to be used for testing Angular applications but it is possible to also use it for non-angular pages like the Crimson login page as long as you include the command

browser.ignoreSynchronization = true;

To begin with I did have some trouble waiting in the code for the new page to load before checking the asserts but with a bit more googling managed to work it out.

    //Wait for the url to change
    var currentUrl;
    browser.getCurrentUrl().then(function(url) {
            currentUrl = url;
        }
    ).then(function() {
            browser.wait(function() {
                return browser.getCurrentUrl().then(function (url) {
                    return url !== currentUrl;
                });
            });
        }
    ).then(function () {
        // continue testing after the url has changed
        
        //Confirm the new url
        expect(browser.getCurrentUrl()).toEqual("https://crimson-accounts-staging.herokuapp.com/");
        
        //Confirm the details shown are for the correct person
        expect(welcomeMsg.getText()).toEqual('WELCOME, MATT OTTO!');
        element.all(by.css('td')).then(function(items) {
          expect(items.length).toBe(5);
          expect(items[0].getText()).toBe('Matt');
          expect(items[1].getText()).toBe('Otto');
          expect(items[2].getText()).toBe('crimsontest@mailinator.com');
          expect(items[3].getText()).toBe('Yes');
          expect(items[4].getText()).toBe('2nd August 2016');
        });
    });

The .then() functions still confuse me a bit, especially when passing parameters into the then method.

---

The suite performs the following checks

1. it('should have a title', function() {
2. it("should authenticate a valid user's credentials", function() {
3. it('should show an error when a user attempts to login with an invalid password', function() {
4. it('should show an error when a user attempts to login with invalid email address', function() {
5. it('should show an error when a user attempts to login with invalid email and password', function() {
6. it('should show blocked account error msg when a user attempts to login with the same invalid email address more than 10 times', function() {
7. it('should show error for missing email address', function() {
8. it('should show error for email address with incorrect format', function() {
9. it('should show error for missing password', function() {
10. it('should go to new page when user clicks Forgot your password link', function() {

---

I mainly used CSS to find the elements rather than XPATH. (I need to do a bit of a learning session on XPATH soon. )

---

You can have a look at my code (I would love some feedback from a dev, I'm rather new to writing code)

• conf.js (Protractor configuration)
• spec.js (Test scripts)
• protractor.log (sample log file generated when run )
• conf.js (Protractor configuration)

---

The code could do with some dev review, personally the following is little ToDo list of things that I think would be good to consider doing next.

• Get an IDE setup for protractor/javascript with code completion
• create method to wait for URL to change
• Extract string constants
• Create page class/object
• Create base URL constant
• Convert to use BDD (Gherkin syntaxt) or look for appropriate tool
• Fix up indentation

---

<< return to main page