Versions Compared

Old Version 2

changes.mady.by.user Sergio Freire

Saved on

compared with

New Version 3

changes.mady.by.user Sergio Freire

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • cypress/integration/common: step implementation files, in JavaScript.
    • cypress/integration/pages: abstraction of different pages, somehow based on the page-objects model
    • cypress/integration/login: Cucumber .feature files, containing the tests as Gherkin Scenario(s)/Scenario Outline(s)
      • Code Block
        languagejs
        titlecypress/integration/common/login.js
        collapsetrue
        import { Given, When } from 'cypress-cucumber-preprocessor/steps';
import LoginPage from '../../pages/login-page';
import LoginResultsPage from '../../pages/login-results-page';

Given(/^browser is opened to login page$/, () => {
  LoginPage.visit();
});

When('user {string} logs in with password {string}', (username, password) => {
  LoginPage.enter_username(username);
  LoginPage.enter_password(password);
  LoginPage.pressLogin();
});

Then(/^welcome page should be open$/, () => {
    LoginResultsPage.expect().toBeSuccessful();
  });

Then(/^error page should be open$/, () => {
    LoginResultsPage.expect().toBeUnsuccessful();
  });
      • Code Block
        languagejs
        titlecypress/integration/common/logout.js
        collapsetrue
        import { Given, When } from 'cypress-cucumber-preprocessor/steps';
import LoginPage from '../../pages/login-page';
import LoginResultsPage from '../../pages/login-results-page';

Given(/^browser is opened to login page$/, () => {
  LoginPage.visit();
});

When('user {string} logs in with password {string}', (username, password) => {
  LoginPage.enter_username(username);
  LoginPage.enter_password(password);
  LoginPage.pressLogin();
});

Then(/^welcome page should be open$/, () => {
    LoginResultsPage.expect().toBeSuccessful();
  });

Then(/^error page should be open$/, () => {
    LoginResultsPage.expect().toBeUnsuccessful();
  });

    ...

    • cypress/integration/
    ...
    • pages: abstraction of different pages, somehow based on the page-objects model
      •  Code Block
        languagejs
        titlecypress/integration/pages/login.js
        collapsetrue
        import LoginResultsPage from './login-results-page';

const USERNAME_FIELD = 'input[id=username_field]';
const PASSWORD_FIELD = 'input[id=password_field]';
const LOGIN_BUTTON = 'input[type=submit]';
const LOGIN_TEXT = 'LOGIN';


class LoginPage {
  static visit() {
    cy.visit('/');
  }


  static enter_username(username) {
    cy.get(USERNAME_FIELD)
      .type(username);
  }

  static enter_password(password) {
    cy.get(PASSWORD_FIELD)
      .type(password);
  }

  static pressLogin() {
    cy.get(LOGIN_BUTTON).contains(LOGIN_TEXT)
      .click();
    return new LoginResultsPage();
  }

}

export default LoginPage;
      •  Code Block
        languagejs
        titlecypress/integration/pages/login-results-page.js
        collapsetrue
        const RESULT_HEADER = 'h1';

class LoginResultsPage {
    static expect() {
      return {
        toBeSuccessful: () => {
          cy.get(RESULT_HEADER).should('have.text', 'Welcome Page')
        },

        
    ...
      • toBeUnsuccessful: 
    ...
      • () 
    ...
      • => {
        
    ...
      •  
    ...
      •  cy.get(RESULT_HEADER).should('have.text', 'Error Page')
        
    ...
      • },
 
    ...
      •      };
 
    ...
      •  
    ...
      •   
    ...
      • }
  }
  
export 
    ...
      • default LoginResultsPage;
      •  Code Block
        languagejs
      • titlecypress/integration/
    ...
      • pages/logout-results-page.
    ...
      • js
        collapsetrue
    ...
      • const RESULT_HEADER = 'h1';

class LogoutResultsPage {
    static expect() {
    
    ...
      •  
    ...
      •  
    ...
      • return 
    ...
      • {
 
    ...
      •  
    ...
      •  
    ...
      •     
    ...
      •  
    ...
      • toBeSuccessful: 
    ...
      • () 
    ...
      • => 
    ...
      • {

    ...
      •   
    ...
      •  
    ...
      •  
    ...
      •  
    ...
      •  
    ...
      •  
    ...
    languagejs
    titlecypress/integration/pages/login.js
    collapsetrue
    ...
      •  
    ...
      •  
    ...
      •  cy.get(RESULT_HEADER).should('have.text', 'Login Page')
        },
      };
    }
  }
  
export default LogoutResultsPage;
      •  Code Block
        languagejs
        titlecypress/integration/pages/welcome-page.js
        collapsetrue
        import LoginPage from './login-page';

const LOGOUT_LINK = 'a';
const LOGOUT_TEXT = 'logout';


class WelcomePage {
  static visit() {
    cy.
    ...
      • visit('/welcome.html');
  }


  static 
    ...
      • pressLogout() {
    cy.get(
    ...
      • LOGOUT_
    ...
      • LINK).contains(
    ...
      • LOGOUT_TEXT)
      .click();
    return new 
    ...
      • LoginPage();
  }

}

export default 
    ...
      • WelcomePage;
    • cypress/integration/login: Cucumber .feature files, containing the tests as Gherkin Scenario(s)/Scenario Outline(s)
      •  Code Block
    ...
      • titlecypress/integration/
    ...
      • login/login
    ...
      • .
    ...
      • feature
        collapsetrue
    ...
      • @REQ_CALC-7905
Feature: As a user, I can login the applicaiton

Scenario: Valid Login
    Given browser is opened to login page
    When user "demo" logs in with password "mode"
    Then welcome page should be open

Scenario: Invalid Login
    Given browser is opened to login page
    When user "dummy" logs in 
    ...
      • with password "password"
    Then error page should be 
    ...
      • open

Scenario 
    ...
      • Outline: Login With Invalid 
    ...
      • Credentials 
    ...
      • Should Fail
    Given browser is opened to login 
    ...
      • page
    When user "<username>" logs in with password "<password>"
    Then error 
    ...
      • page should be 
    ...
      • open

  
    ...
      •   Examples:

    ...
      •  
    ...
      •  
    ...
    languagejs
    titlecypress/integration/pages/logout-results-page.js
    collapsetrue
    ...
      •  
    ...
      •  
    ...
      •  
    ...
      •  
    ...
      •  
    ...
      •  | username  
    ...
      • | 
    ...
      • password 
    ...
      • |
      
    ...
      •  
    ...
      •  | invalid   |   
    ...
      • mode 
    ...
      •  
    ...
      •  
    ...
      • |
        
    ...
      • | demo      | invalid  
    ...
      • |

    ...
      •      
    ...
      •    | 
    ...
      • invalid  
    ...
      •  | 
    ...
      • invalid 
    ...
      •  
    ...
      • |
      •  Code Block
    ...
      • titlecypress/integration/
    ...
      • login/
    ...
      • logout.
    ...
      • feature
        collapsetrue
    ...
      • @REQ_CALC-7906
Feature: As a user, I can logout the application

Scenario: Valid Logout
    Given user is on the welcome page
    When user chooses to logout
    Then login page should be open

    You can then export the specification of the test to a Cucumber .feature file via the REST API, or the Export to Cucumber UI action from within the Test/Test Execution issue or even based on an existing saved filter. A plugin for your CI tool of choice can be used to ease this task.
    ...