In this tutorial we'll be covering how to get started with TestModeller.io for Cypress.
This is aimed for first-time users along with users who have an existing Cypress automation framework.
A demonstration of Test Modeller for Cypress covered in this tutorial.
1. How it works
TestModeller.io is a browser-based solution that enables users to:
Model a system under test as BPMN-style flowcharts.
Automatically generate test cases from the model, optimising testing for time and risk.
Define test data at the model-level and generate data at the same time as test cases.
Define test automation, automatically executing tests generated in The VIP Test Modeller.
Analyse test results and manage existing artefacts, with visual dashboards and a file management system that introduces traceability between test assets.
This quick start guide provides an overview for new users to get started with creating automation for a Cypress based automation framework to quickly start creating models and associated automation.
This section is by no means comprehensive and intended as a quick start guide. If you wish to learn more about modelling we recommend you review our knowledge base along with our video tutorials for a comprehensive guide to creating models and test automation.
The goal is to equip the reader with the working knowledge needed to get started with creating Cypress test automation to test their own systems and integrate into their own automation frameworks. With TestModeller.io, this means automatically generating complete automated test suites from models that are quick to build and easy to maintain.
Here we'll be installing all the prerequisites you need to get started with test automation in Cypress through TestModeller.io.
Download our example Cypress project (if you don't have your own).
You can download the framework from out GitHub repo here.
In this tutorial we'll be using the xpath extension to cypress. Follow instructions here to add xpath support. This is already included in our sample project.
Test It's Working
Make sure to restart the Terminal or Command line prompt to load the new environment variables.
Run sample automation library
Navigate to the framework directory (this should contain the node_modules folder).
Run npm install. This will pull down all the associated libraries required.
On Linux / MacOS - Run ./node_modules/cypress/bin/cypress open to start the interactive cypress engine.
On Windows we have added an npm script to start Cypress. Run npm run cypress:open from the command prompt.
You should now see the tests present which you can execute interactively in cypress.
3. Scan an existing web app
Scan an existing web app
4. Build a model
Build a Model
Start creating an automation model of the system under test.
If you'd like to learn more about building models we recommend reviewing our knowledge base articles on creating models here.
5. Generate cypress automation scripts
Generate associated Cypress scripts for your model.
Generate Coverage Focused Tests
Test cases are equivalent to paths through the model of a system under test. They are generated automatically from a model, with or without test data and test automation associated with them. Coverage techniques are also available to generate the smallest set of test cases needed to test given features with a required level of rigour.
To generate test cases, navigate to the Generate tab of the menu and click “Generate”
TestModeller.io will provide status updates as the tests are generated.
To browse the generated tests, click “Tests” in the Generate tab of the menu. This will open the Test Cases side bar, displaying any created tests.
Clicking on a test will highlight the path through a model’s logic which that test reflects.
The tests generated by TestModeller.io are the optimal set of tests to maximise coverage across the model. You can learn more about test coverage and how to edit coverage settings within TestModeller.io at our knowledge base here.
Export Test Automation Code
Click the execute button in the test path side bar.
Select the automation server you have configured. If you are using our Partner or Cloud workspace you can use our 'Community Server' which is already configured for your workspace. Note: The community server is a shared instance and may get busy at peak times. You may want to create your own automation server for a faster experience. Documentation is available here for creating your own server.
Select the job 'Create Tests' from the dialog window.
Select the code template to use. In this case we will use 'Cypress'.
Once the job is complete there will be an option to download 'Result.zip'. This contains associated data spreadsheets, log files and most importantly the generated automation code.
6. Execute tests
7. Create custom code snippets (Advanced)
Create Custom Code Snippets
TestModeller.io is built with flexibility in mind. You'll often want to embed your own custom code or make calls to external libraries in your Cypress scripts. To facilitate that you can customise and create your own code snippet actions which can be overlaid on the model.