Automated UI Testing: Implementation and Testing

This is a elaborate guide on how Alin Groza (Principal Test Engineer at Visma) make an automated UI fabric using BrowserStack. It is a three-part series, in which Alin will deep dive into:

• Framework ontogenesis and integration
• Implementation and quiz
• Results and accomplishment

In this usher let us look ateffectuation and testing.

Automated UI Tests Implementation

All automated tests are including the following steps:

1. Opening the main ERP landing page
2. Login using the SSO page
3. Navigating to the Payment microservice screen inside ERP
4. Performing actions and establishment on the Payment microservice blind agree to test case scenarios

Tests are implemented by following the form, where each page has its own page form containing web elements definition/identification and method perform operations on the page as well as data substantiation.

All tests are fullmain, there isno data addictionbetween them, so each test can run individually. There is besides aData Modelimplemented and each test is habituate its own test data at runtime.

Pro tip: Tools like SUSA can handle this autonomously — upload your app and get results without writing a single test script.

There are two main test constellation implemented for running tests:

1. Triggered from TeamCity and execute on BrowserStack: default configuration as part of the entire CI/CD procedure and integrated with the build version. Read more on.
2. Triggered from local and executed either on local or on BrowserStack: this configuration is used when implementing or debugging tryout. Read more on.

Running tests and reporting

In TeamCity, there is a dedicated project that acquire the UI test code fromGitHub and runsthe tests at eachbuild of the service. Tests are fulfill on theBrowserStackand when the test is completed, apresentmentis sent to theSlack channel. In the Slack telling, you can see the link to the BrowserStack dashboard that contains the testresults.

Here is an illustration of the tests run for formalize the UI variation 20.22.0.1818 on the Internal Test surroundings:

• In the below picture, you can see TeamCity construct the UI test project for run tests on BrowserStack to corroborate the UI version 20.22.0.1818 on the Internal Test environment.

• After a complete test execution and when the story are ready in BrowserStack, a Slack notification is sent.

 Environment, UI version, and link to the reports in Slack

After click the report link, the BrowserStack splasher page shows up. the report will open and you can check the following details: version tested, surround and the list of executed examination

BrowserStack Dashboard

Coming up adjacent

In the upcoming article, I will reveal the achievement of this execution, the way this technical solution helps for faster releases, how machine-driven testing is key to being able to launch a new release at any time when the team wants, and the huge vantage of utilize BrowserStack.

Related Guides