UI testing is a type of testing, also known as user interface testing, in which we check whether the application’s interface works properly or has any bugs that hinder user behavior and do not conform to written specifications. It is critical to understand how the user will interact with the site to perform UI tests, where the tester tries to mimic the user’s behavior to see how the user will interact with the program and to see if the site is performing as expected and if there are defects.

In the last automated Testing series (part 2), I gave you a general introduction to the concept of API testing and the implementation of practice in toothfish. This article focuses on the concept of UI testing and the implementation of practice in Choerodon.

Here is a detailed introduction to the UI test functions provided by toothfish:

What are UI tests

UI testing covers the user interaction portion of the site, including the structure and visual portion of the site where users are concerned. Web Sites contain many different Web elements from CSS, JavaScript, and many other languages that can be connected to a screen, keyboard, mouse, or any other tool a user uses to interact with the site, and UI tests capture, test, and declare these elements.

When performing UI tests, care needs to be taken to ensure that your application does not have any cross-browser compatibility issues. Because each browser uses a different browser engine, it may not support the same CSS functionality. Therefore, it is important to ensure that the UI is rendered seamlessly across all major browsers. Testing on different browsers is called cross-browser testing, which helps testers test their sites in a variety of combinations across all major browsers and devices, including phones, tablets, and so on.

Manual or automatic, how to choose?

Like any other type of testing, UI testing can be performed manually or through automation. Manual testing requires testers to manually execute each test on each element. For example, a test input field would need to type different values over and over again for any differences. If the site UI has fewer components, it is best to do UI testing quickly through a manual process. However, it is not suitable for complex sites, where rich user interfaces make manual UI testing very inefficient, time-consuming, and error-prone.

Suitable for UI automated testing scenarios

Not all test scenarios are suitable for automated testing, which can be assisted by the following criteria:

  • The requirements of the project do not change frequently
  • The UI of the page has stabilized
  • The project cycle is long enough
  • A lot of regression testing tasks

Among them, some projects are obviously not suitable for the use of UI automation testing, such as video players, music players and other highly interactive, concurrency dependent software.

Advantages of UI automated testing

The UI test automation process simplifies the process of creating UI tests, running tests, and viewing the results. Development and test teams choose to automate UI tests for a number of reasons, most notably:

  • Time – Manual testing is slow and out of sync with many development processes.
  • Cost – Manual testing is resource-intensive and expensive.
  • Accuracy – Manual testing is prone to more errors when performing repetitive tasks. On the contrary, automation reduces the opportunities for these errors.
  • Scale – When performing complex iterations, it is difficult to rely on manual testing.
  • Trends – Most organizations have realized how they can benefit from automated testing, so there is increasing pressure to jump on the automation bandwagon.

UI test automation design principles

  • One test case completes a function point test (common) : one manual test case for one automated test case;
  • A script is a complete scene;
  • Script between independence, not rely on mutual isolation between (script) : for example use cases related to login status: individual orders center, order details, such as shopping, if the script is not independent, between depend on each other, on the test script failure cases, can lead to personal center, order details, order demise on shopping test scripts and all subsequent repair and maintenance cost is high;
  • Set appropriate checkpoints: Determine use case success with assertions;
  • Well-designed framework: UnitTest and PyTest are commonly used test frameworks in Python. Using the framework and encapsulating common test modules reduces the workload of automatic test script maintenance.

This section describes the WEB UI test tool

The API test case consists of four parts: basic information of the use case, pre-steps, request script, and assertions.

UTF

UTF(Unified Functional Testing) = Quick Test Pro (QTP) + Service Test (ST) Developed by HP. It is an enterprise-level automatic testing tool, providing a powerful and easy-to-use recording and playback function, compatible with object recognition mode and image recognition mode two recognition modes, supporting B/S and C/S two architectures of software testing, is the mainstream automated testing tool. Mainly used for regression testing and new version testing of the same software.

Robot Framework

Python is an automated testing framework written based on Python language, with good scalability, support keyword driven, can simultaneously test a variety of types of clients or interfaces, can be distributed testing.

Selenium

The Selenium profile

Selenium is also a tool for Web application testing that supports multiple platforms, browsers, and languages for automated testing, and is currently most widely used in the field of Web automation.

Selenium is one of the most widely used open source Web UI (user interface) automation test suites. It was originally developed by Jason Huggins in 2004 as an in-house tool for Thought Works. Selenium supports automation across different browsers, platforms, and programming languages.

Functional characteristics of Selenium

  • Selenium is an open source and portable Web testing framework.
  • Selenium IDE provides playback and recording capabilities for authoring tests without learning the test scripting language.
  • It can be considered the leading cloud-based testing platform that helps testers document and export their operations as reusable scripts, with an easy-to-understand and easy-to-use interface.
  • Selenium supports a variety of operating systems, browsers, and programming languages. The list is as follows:
    • Programming languages: C#, Java, Python, PHP, Ruby, Perl and JavaScript
    • Operating systems :Android, iOS, Windows, Linux, Mac, Solaris.
    • Browsers: Google Chrome, Mozilla Firefox, Internet Explorer, Edge, Opera, Safari, etc.
  • It also supports parallel test execution, which reduces time and improves test efficiency.
  • Selenium can be integrated with frameworks such as Ant and Maven for source code compilation.
  • Selenium can also integrate with testing frameworks such as TestNG for application testing and reporting generation.
  • Selenium requires fewer resources than other automated testing tools.
  • The WebDriver API has been attempted in Selenium, and this is one of the most important changes to Selenium.
  • The Selenium Web driver does not require a server installation, and the test scripts interact directly with the browser.
  • Selenium commands are categorized according to different classes, making them easier to understand and implement.
  • Selenium Remote Control(RC), together with the WebDriver API, is called Selenium 2.0. This release is designed to support vibrant web pages and Ajax.

Three major advantages of Selenium

  • Speed: Time is every company’s primary resource, and automated testing can save a lot of time. Selenium Automation testing requires us to write tests once, and then run them over and over again without any intervention with different values and different scenarios.
  • Accuracy: Selenium Automation tests can help us execute tests correctly as long as they are written correctly. The main disadvantage of manual testing is that it is prone to human error.
  • Transparency: Selenium Automation testing also helps to quickly generate reports and share them with the team immediately after testing is complete. Manual testing, on the other hand, requires time to extract the results and report them manually to generate a report either through software or manually.

Choerodon UI test

The installation

To use UI testing in Choerodon, you need to install Selenium IDE first.

Selenium IDE is an open source Web test automation tool under Selenium Suite. Unlike Selenium WebDriver and RC, it does not require any programming logic to write its test scripts, but simply logs the interaction with the browser to create test cases. After that, you can rerun the test case using the play option. Note: Selenium IDE is only available as a Firefox and Chrome plug-in, and it cannot record test cases on browsers other than Firefox and Chrome. Recorded test scripts can also be exported to programming languages such as C#, Java, Ruby or Python.

The Firefox browser

  • Open the URL = > addons.mozilla.org/en-us/firef… , which redirects to the official Firefox add-on page.
  • Click the Add to Firefox button.

Chrome

  • In the plug-in shops (chrome.google.com/webstore/ca… %E6%90%9C%E7%B4%A2)Selenium IDE
  • Click Add to Chrome

use

Record and play back scripts using Selenium IDE on Chrome

1. Open the IDE, and the initialization interface is shown as follows:

2. Create and start recording, and enter the web address for recording

3. After recording, right-click the test case to save or export it. Selenium IDE keeps single files on. Side

UI tests in Choerodon are imported into the system through side files recorded in Selenium IDE, and corresponding test cases and steps are generated in the UI test interface. Then it can directly execute the corresponding test file to test the interface UI operation, you can intuitively see the generated test report.

conclusion

UI testing is an important part of the software testing cycle and an important driver of improving user experience and customer satisfaction, with most end users more concerned with what they actually see and touch. Therefore, this is why the UI, or user interface, becomes so important to do UI testing.

This article was originally written by the toothfish technical team.The official website of toothfish