Web application test automation

In-house explanatory material. An overview of automated testing with Selenium Webdriver.

Basic information

• Written by: 2018/07/23
• Update: 2020/01/16
• OS:Windows10

What is Selenium

Many sites are written as a framework (library) for testing web applications, but it may be easier to understand the expression "RPA tool specialized for web browsers".

What you can do

By programming the operations performed by humans on the browser and creating a "browser operation robot", the test man-hours during Web application development can be reduced. I think the following are the merits.

1. You can complete the test with the touch of a button. (No human work required)
2. Can be tested in different browsers. (Depending on the construction, but usually does not require recoding)
3. Become a legacy. (Effective use of costs)

The test man-hours for developing a Web application are recorded as development costs, but I think this test cost tends to be "disposable". By creating a test scenario in Selenium, it can become a "legacy" that can be used thereafter.

* Inside the PC Image of a robot (Selenium) in.

How to use (basic)

Use a tool called Selenium Webdriver. You can control web pages (character input, button press, etc.) by executing the Webdriver API from any programming language (C #, Groovy, Java, Perl, PHP, Python, Ruby and Scala: by wikipedia). I can do it. This time, I will introduce how to write using Java. The following export is a standard pattern when using IE.

System.setProperty("webdriver.ie.driver", "./driver/32/IEDriverServer.exe");
WebDriver driver = new InternetExplorerDriver();
driver.manage().timeouts().implicitlyWait(120, TimeUnit.SECONDS);

The actual control can be done with the following syntax.

driver.findElement(By.xpath("PATH_TO_TARGET")).OPERATION("PARAMETER");

The meaning of this syntax is to specify the element to be controlled with "PATH_TO_TARGET", give the parameter specified with "PARAMETER" when the element is found, and perform the operation specified with ".OPERATION". The setting method of "PARAMETER" and ".OPERATION" is explained below.

Specifying PATH_TO_TARGET

In order to control the elements on the screen, you have to specify "where the controlled element is (position)" in some way. The method of specifying "coordinates (x, y)" on the screen may come to mind first, but if you use coordinates, the position will differ depending on the size of the display or window, so it will fail at runtime. There is a concern that the number of cases will increase (runtime accuracy is low). As a result, Selenium allows you to specify elements in an accurate coordinate-independent way.

For example, yahoo's search word input field starts with the tag and ends at the tag, as shown in the image above. The path from to is called xpath. The xpath of the input item is as follows.

/html/body/div[1]/div[1]/div[3]/form/fieldset/div[1]/p/label/input

• XPath is shown as an example this time, but css selector etc. can also be used.

Designation of OPERATION

Now that you know how to identify an element, you need to specify what action to take on that element (.OPRERATION part). The main ones are clicks and string input, as mentioned above.

Below is a sample of clicking a hyperlink.

driver.findElement(By.xpath("PATH_TO_TARGET")).click();

The following is a sample for inputting a character string in the input item.

driver.findElement(By.xpath("PATH_TO_TARGET")).sendkeys("PARAMETER");

Specific usage

Anyone who has touched any programming language can do it. I introduced earlier

driver.findElement(By.xpath("PATH_TO_TARGET")).OPERATION("PARAMETER");

It's very easy because you just apply it to and arrange the automated processes. It is necessary to change the writing style slightly depending on the control on the screen you want to control, but basically, if you remember the two types introduced earlier and the control method of the drop-down list box (this also has a standard), 7 ~ It seems that 80% of the processing can be covered.

Means of comparison with expected value

As with the manual (keystroke) test, it is basically necessary to make a (pass / fail) judgment of the result for the given input. It is easy to create a test case using a testing framework such as JUnit and make a judgment. We will introduce two types of judgment methods.

• Compare the expected value string for input with output
• Compare the expected value image for input and the output image

Compare with the expected value string for input

This is the standard method. Pick up the result obtained for input from the screen and compare it with the value prepared in advance by assert. In the case of JUnit, you can see at a glance the test case that failed because the judgment result was false.

Compare with the image of the expected value for input

Selenium also has a function to take screenshots, which is a way to get the desired image and compare it with the expected value image. It takes a lot of work compared to the case of character strings, but it is an effective means for regression tests when upgrading the version of the Web application server and the version of the browser used. I won't go into the details, but you can easily and inexpensively automate image comparisons using software such as ImageMagic.

I am creating sample code. https://github.com/knsquai/BrowserAutoTest

We are looking for friends to work with us to promote test automation. https://www.nittsu-infosys.com/recruit/2019/index.html