Overview
In this tutorial, we will create some E2E tests in JavaScript using TestCafé.
TestCafé is a Node.js utility for E2E testing that does not use Selenium WebDriver; it uses a proxy mechanism instead. Some of its features include the ability to handle automatically the wait times of page loads/XHR requests for stabler tests.
Besides being easy to setup, it runs in multiple OSes and supports almost, if not all, browsers out there. It supports desktop, mobile, remote, cloud and parallel testing.
You may also use an IDE (TestCafé Studio) to easily record, implement and playback tests.
Requirements
- TestCafé
- testcafe-reporter-xunit module
- testcafe-browser-provider-saucelabs module (if using Sauce Labs)
testcafe-browser-provider-browserstack module (if using BrowserStack)
Description
The following examples are taken from TestCafé's documentation; the first one implements a test in a very simple way although hard to maintain in the long run.
In the second example, two tests are built using the page object pattern.
Simple message validation after submission of input
In this test, an input box is filled out and submitted. Afterwards, the submission message is evaluated.
Hardcoded selectors, directly in the test code, are used to implement the test.
Implementing tests using page object pattern
In this scenario, taken from TestCafé's documentation, we start by defining a page object.
Two tests can easily be implemented using the previous page object, one of them iterating over a bunch of checkboxes.
Running the tests
In this example, we'll run the tests locally using Chrome browser.
testcafe chrome test1.js test2.js --reporter xunit > results.xml
It is also possible to perform headless testing (e.g. use "chrome:headless" as the browser name, for example).
testcafe "chrome:headless" test1.js test2.js --reporter xunit > results.xml
To run them in the cloud using BrowserStack, the command line would be something like this (BROWSERSTACK_USERNAME and BROWSERSTACK_ACCESS_KEY environment variables would need to be defined beforehand):
testcafe "browserstack:Chrome@66.0:Windows 10" test1.js test2.js --reporter xunit > results.xml
To run them in the cloud using BrowserStack, the command line would be something like this (BROWSERSTACK_USERNAME and BROWSERSTACK_ACCESS_KEY environment variables would need to be defined beforehand):
testcafe "browserstack:Chrome@66.0:Windows 10" test1.js test2.js --reporter xunit > results.xml
After running the tests and generating the JUnit XML reports (e.g., results.xml), they can be imported to Xray (either by the REST API or through the Import Execution Results action within the Test Execution).
JUnit's Test Case is mapped to a Generic Test in Jira, and the Generic Test Definition field contains the value of the "it" concatenated with the several "describe"' that make up the test case.
The Execution Details of the Generic Test contains information about the Test Suite, which in this case corresponds to the concatenation of the test's "describe".
References
- https://devexpress.github.io/testcafe/
- https://devexpress.github.io/testcafe/documentation/getting-started/
- https://devexpress.github.io/testcafe/documentation/recipes/using-page-model.html
- https://github.com/DevExpress/testcafe-reporter-xunit
- https://dzone.com/articles/testcafe-e2e-testing-tool
- https://testcafe-studio.devexpress.com/documentation/getting-started/
- https://medium.com/yld-engineering-blog/evaluating-cypress-and-testcafe-for-end-to-end-testing-fcd0303d2103