Cypress is a testing tool built for modern web applications. It allows for various types of testing including functional, regression, unit, load and stress testing. Cypress runs tests directly in the browser using JavaScript. It provides features like fixtures to manage test data, debugging tools to step through tests, and the ability to preserve session data across tests using cy.session(). Plugins can be used to customize Cypress functionality and hooks allow running code before and after groups of tests or individual tests.
Overview of Cypress as a modern testing tool, with a table of contents covering its history, installation, dashboard, architecture, features, API testing, and more.
Cypress creation in 2014 and public beta in 2017, along with statistics showing a shift towards automated testing methods, with 73% moving from manual to automation.
Detailed overview of Cypress architecture built on Node.js, its installation process, and its usage for front and back-end testing.
Functionality of the Cypress dashboard providing insights into tests, including test summaries, screenshots of failures, and the test runner features.
Cypress features including managing test data with fixtures, debugging capabilities, and session management, all enhancing testing efficiency.
Introduction to API testing in Cypress using the 'cy.request()' command, managing HTTP methods and accessing response attributes.
Explanation of hooks in Cypress to set conditions before and after tests, allowing for structured test execution.
Insight into plugins for Cypress including configuration, preprocessing, and defining tasks to enhance testing capabilities.
Conclusion presented by Jovana and Ana, highlighting the importance of testing every line of code.
TABLE OF CONTENTS
06
07
08
01
02
03
Historyof Cypress
Statistics of automated test
Introduction of Cypress
Installation
Dashboard
Test runner
04
09
Architecture
Features
05
Before and after Cypress
10 API Testing
11
12
Hooks
Plugins
STATISTICS OF AUTOMATEDTEST
FUNCTIONAL AND REGRESSION TESTING
CONTINUOUS INTEGRATION TESTING
UNIT TESTING
73%
45%
44%
moving from manual testing
to automation testing
LOAD AND STRESS TESTING
31%
5.
Introduction to
Cypress
There aremultiple open-source tools and
frameworks available in the market which already
met users needs. Some of them are :
● Selenium
● JUnit
● TestNG
● Appium
● JMeter
● Postman …
6.
ARCHITECTURE OF CYPRESS
Itis built on
Node.js and
comes
packaged as an
npm module.
It can be utilized
for testing both
the front and
backend of the
application.
It uses
JavaScript for
writing tests.
Cypress runs
within the browser,
the browser itself
is executing your
test code.
7.
BEFORE AND AFTERCYPRESS
All in one testing framework,
assertion library,with mocking
and stubbing, without Selenium.
It has the capability to run tests
across multiple browsers.
END - TO - END
TESTS
Choose a framework
Install
Choose a Selenium wrapper
Choose an assertion library
Add additional libraries
Mocha Qunit
Karma
Jasmine
Expect.js Chai
Selenium
Protractor Webdriver
Nightwatch
Simon
TestDouble
8.
Installation
npm init
npm installcypress --save-dev
npx cypress open
creates the package.json file
installs Cypress locally
launching Cypress
9.
Cypress dashboard
Cypress dashboardService is an optional web-based companion to our test
runner. It basically provides timely, simple and powerful insights on all our
test runs at a glance, and it is giving us access to all our recorded tests.
It is an overview portal which contains almost all the pieces of information
about our test and its execution.
Dashboard is a showcase of test summary.
For failed tests, we also have a screenshot of the instance where the test has
failed via cy.screenshot() command.
Intuitive
Structure overview
Organised
FEATURES
Fixtures are usedto store and
manage test data. Fixture files are
located in cypress/fixtures by default.
The test data is usually written inside
a JSON file.Fixtures support other file
types as well, but the most commonly
used is JSON.
FIXTURES SESSION
DEBUG
Cypress has a very good debugging
feature, where we can time travel and
see what has actually happened. As we
move through the steps, the elements
get highlighted. With cypress command
for pauses the execution, during which
we can debug the previous steps. After
that, we can resume execution.
By default, Cypress will clear the
current session data before each test.
to preserve data we will use
cy.session().
Cypress session is a collection of
async session-related helper methods
intended to be used alongside the
cy. session() command.
12.
API Testing
cy.request() isthe command that is the center of this
After a request receives a response from
the server, you can access the information
using .then() command. This will return all
kinds of attributes like response body,
status code, duration etc.
By default, Cypress generates inside this request
command ‘method: GET’. If we are in need to send
different methods, or to pass one or more attributes,
we can write ‘method: POST’ and single object.
13.
HOOKS
These are helpfulto set conditions
that you want to run before a set of
tests or before each test. They're
also helpful to clean up conditions
after a set of tests or after each test.
describe('Tutorialspoint',()=> {
before(()=> {
// executes once prior all tests in it block
cy.log("Before hook")
})
after(()=> {
// executes once post all tests in it block
cy.log("After hook")
})
beforeEach(()=> {
// executes prior each test within it block
cy.log("BeforeEach hook")
})
afterEach(()=> {
// executes post each test within it block
cy.log("AfterEach hook")
})
it('First Test', ()=> {
cy.log("First Test")
})
it('Second Test', ()=> {
cy.log("Second Test")
})
})