Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – How do I call a function in cypress.io for E2E test automation?

I am in a QA bootcamp (Coding Temple) and I am working on an assignment where we take pseudo code and turn it into an automated test using javaScript functions in cypress. However, I just cannot get it right!! Cypress keeps saying there is no tests!! Can someone please look over my code and tell me what Im doing wrong? I have been stuck on this for over 24 hours.

const url = 'http://www.demo.applitools.com';
const validUsername = 'leilasabolic';
const validPassword = 'qaisfun202';

function launchApplication(){
    cy.visit('url');
}

function enterUsername(“validUsername”){
    cy.get('action.username').type('validUsername');
}

function enterPassword(“validPassword”){
    cy.get('action.password').type('validPassword');
}

function clickLoginButton(){
    cy.get('#query-btn').should('contain', 'Button').click();
}

function verifyLoginSuccess(){
}

or

const url = 'http://www.demo.applitools.com';
const validUsername = 'leilasabolic';
const validPassword = 'qaisfun202';

function login(validUsername, validPassword) {
    cy.get('#username').type('validUsername');
    cy.get('#password').type('validPassword');
    cy.get('#button').click();
}
Tags:

2

Answers


  1. 0

    Cypress uses Mocha to executes tests. (It is built-in to Cypress, so you don’t need to install it.) So, in order to have Cypress identify your functions as tests, they’ll need to be in Mocha blocks – describe, context, or it. Tests that share common setup and teardown, or are in a common area are often grouped together underneath describe or context blocks, and the individual tests are in the it blocks.

    describe('My Tests', () => {
  it('Validates I can login succesfully', () => {
    launchApplication();
    enterUsername('foo');
    enterPassword('bar');
    clickLoginButton();
    verifyLoginSuccess();
  });
});

    So your functions that you have written can be called within the it (or describe/context blocks).

    As an aside, Cypress recommends you use Cypress Custom Commands instead of abstracting Cypress code to a vanilla JS function. (I understand that you’re going through a Bootcamp, just some additional information on Cypress best practices.)

    Login or Signup to reply.
  2. 0

    The best way to get started with your test is to let Cypress set it up for you.

    If you start with a clean project, install and open Cypress – npx cypress open. The Cypress wizard will automatically configure itself.

    After opening the runner, you can either chose "Scaffold example specs" or "Create new spec" – which shows exactly what a working spec looks like.

    cypresse2espec.cy.js

    describe('template spec', () => {
  it('passes', () => {
    cy.visit('https://example.cypress.io')
  })
})

    The test is the it() block which has a description and a callback. You can modify the contents to reflect your own requirements

    const url = 'http://www.demo.applitools.com';
const validUsername = 'leilasabolic';
const validPassword = 'qaisfun202';

describe('testing applitools demo', () => {
  it('logs in', () => {
    cy.get('#username').type('validUsername');
    cy.get('#password').type('validPassword');
    cy.get('#button').click();
  })
})

    or with a function just call it inside the it() block

    const url = 'http://www.demo.applitools.com';
const validUsername = 'leilasabolic';
const validPassword = 'qaisfun202';

function login(validUsername, validPassword) {
  cy.get('#username').type('validUsername');
  cy.get('#password').type('validPassword');
  cy.get('#button').click();
}

describe('testing applitools demo', () => {
  it('logs in', () => {
    login(validUsername, validPassword)
  })
})

    There’s no need for custom commands for a simple set of actions such as logging in, a function is fine.

    More tests

    To use your function in more tests, call it in a beforeEach() block

    const url = 'http://www.demo.applitools.com';
const validUsername = 'leilasabolic';
const validPassword = 'qaisfun202';

function login(validUsername, validPassword) {
  cy.get('#username').type('validUsername');
  cy.get('#password').type('validPassword');
  cy.get('#button').click();
}

describe('testing applitools demo', () => {
  it('logs in', () => {
    login(validUsername, validPassword)
  })

  context('after logging in', () => {

    beforeEach(() => {
      login(validUsername, validPassword)
    })

    it('tests something on the page', () => {
      ...
    })


    it('tests something else on the page', () => {
      ...
    })
  })
})
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search