Introduction of Cypress A Test Automation Tool – Devstringx
Introduction of Cypress Tool
Cypress is an open-source and free test automation tool, It is mainly used for front-end automation. Cypress helps to achieve the following −
- Configure tests
- Configure tests
- Execute tests
- Identify errors (if any)
Selenium and Cypress are compared in terms of their functionalities. In many ways, Cypress is different in architecture and features. it resolves some of the issues users face in Selenium.
Cypress is based on JavaScript and executes tests in the browser. It helps to develop the tests that have −
- Unit tests
- End-to-end tests
- Integration tests
Features of Cypress Testing Tool
The important features of Cypress are given below −
- Supports Test-Driven development
- Efficient debugging with Developer Tools with the generation of stack trace and errors
Structure of A Basic Test
Cypress follows the JavaScript test frameworks like (Mocha, and Jasmine). To create a test in Cypress, we have to follow the below-mentioned framework guidelines −
-Test suite name should be provided within the described function
Basic Test Implementation
The basic test implementation can be done by using the below command –
// test suite name describe('JavaTpoint Test', function () {// Test case it('Scenario 1', function (){ // test step for URL launching cy.visit("https://www.google.com/"); });});
Test Execution
For execution from the command line, run the command mentioned below −
./node_modules/.bin/cypress run
Here, all the files within the integration folder will be triggered
For execution from the Test Runner, run the command Mentioned below −
./node_modules/.bin/cypress open
Then, click on the spec file that the user wants to trigger for execution.
To trigger execution for a specific file from the command, run the command mentioned below −
cypress run --spec "<spec file path>"
Also Read:- Web Automation Testing Tools
Cypress – Basic Commands
Cypress basic commands are mentioned below –
- and
It is used to create assertions and is an alias. should ().
cy.get('#ExampleText').should('be.visible').and('be.enabled') cy.contains('Subject').and('be.checked')
- as
This command provides an alias for later usage.
cy.get('#txt').find('li').first().as('parent')
- blur
It blurs an element in focus.
cy.get('#txt'). type('abc').blur()
- check
Checks radio buttons or checkboxes and also applies to elements having input tags.
cy.get('.chkbox').check()
- children
It basically obtains the sub-elements of an element.
cy.get('n').children()
- clear
Generally, It removes the value from textarea or input.
cy.get('#txt'). type('abc').clear()
- clearCookie
It removes a particular browser cookie.
cy.clearCookie('abc')
- clearCookies
This command removes the cookies from the browser from an existing domain and subdomain.
cy.clearCookies()
- clearLocalStorage
It removes the local Storage data from the existing domain and subdomain.
//clears all local storagecy. clearLocalStorage ()
- click
It clicks an element in (DOM).
//click on element with id txtcy.get('#txt').click()
- contains
Contains obtains an element having a specific text. The element can have more than the text and still, match.
cy.get('#txt').contains('Tutor')
- dblclick
It double-clicks an element in the DOM
//double clicks element with id txt cy.get('#txt').dblclick()
- debug
Debug fixes a debugger and the log value is returned by the prior command.
//pause to debug at start of command cy.get('#txt').debug()
- document
It obtains a window. document on the active page.
cy.document()
- each
Each iterates from an array having the property length.
//iterate through individual li cy.get('li').each(() => {...})
- end
It ends a command chain.
//obtain null instead of input cy.contains('input').end()
- eq
It refers to an element at a particular index in an array of elements.
//obtain third td in tr cy.get('tr>td').eq(2)
- exec
It runs a system command.
cy.exec('npm init')
- find
It is obtaining the descendant element of particular locators.
//obtain td from tr cy.get('tr').find('td')
- first
It is obtaining the first element from a group of elements.
//obtain first td in tr cy.get('tr>td').first()
- get
It is obtaining single or multiple elements by the locator.
//obtain td from tr
- find
It is obtaining the descendant elements of a particular locator.
//obtain all td from tr in list cy.get('tr>td')
- getCookies
It is obtaining all the cookies
cy.getCookies()
- go
It moves forward or backward to the next or previous URL in the history of the browser.
//like clicking back button cy.go('back') //like clicking forward button cy.go('forward')
- visit
It launches a URL.
cy.visit('https://www.tutorialspoint.com/index.htm')
- next
It obtains the immediate sibling of an element in a group of elements in the DOM
//gives the following link in element l. cy.get('l a:first').next()
- parent
It obtains the parent element from a group of elements in the Document Object Modal.
//get parent of element with class h cy.get('.h').parent()
- should
It is used for creating an assertion and is an alias of .and ().
//assert element is visible & enabled cy.get('#txt').should('be.visible').and('be.enabled')
- wait
Wait for a certain time in milliseconds or for an aliased element prior to moving the following step given below.
cy.wait(1000)
- title
It will obtain the document.title of the active page.
cy.title()
- log
It will print the messages to the Command Log.
cy.log('Cypress logging ')
- reload
It is used for page reloading.
cy.reload()
Also Read – Tutorial On Katalon Studio an Automation Testing Software Tool
Cypress Assertions
Cypress has more than one type of assertion obtained from various libraries like Mocha, Chai, etc. The two types of assertion types are explicit and implicit.
1) Implicit Assertions
If an assertion is applicable to the object obtained from the parent command in a chain, then that is known as the implicit assertion. The popular implicit assertions include .and/.should.
These commands cannot be used as a standalone. Generally, they are used when the user has to verify multiple checks on a particular object.
// test suite describe('W3 school', function () { it('Scenario 1', function (){ // step to launch a URL cy.visit("https://www.W3school.com/videotutorials/index.php") // validate count of sub-elements and class attribute value cy.get('.toc chapters').find('li').should('have.length',5) .and('have.class', 'dropdown') }); });
2) Explicit Assertions
An assertion is applicable to an object, it is known as the explicit assertion. The popular explicit assertions include asserting/expecting.
The command for the explicit assertion is mentioned as follows –
// test suite describe('Tutorialspoint', function () { // it function to identify test it('Scenario 1', function (){ // step to launch the URL cy.visit("https://accounts.google.com") // identify element cy.get('h1#headingText').find('span').then(function(e){ const t = e.text() // assertion expect expect(t).to.contains('Sign') }) }) })