Writing Tests for Web Applications With TestProject OpenSDK And JUnit 5

After you have integrated the TestProject OpenSDK with JUnit 5, you can start writing the actual test methods. This blog post describes how you can write tests for web applications with TestProject OpenSDK and JUnit 5.

After you have read this blog post, you:

• Understand how you can write a new JUnit 5 test class that contains test methods which use the TestProject OpenSDK.
• Can run automated tests which use the TestProject OpenSDK and JUnit 5.

Let's begin.

Introduction to the System Under Test

During this blog post you will learn to write automated tests for the search function of this blog. The requirements of the search function are:

First, the search form is displayed on the sidebar and it's visible on every page which has a sidebar. That being said, when you write automated tests for the search function, you must open the front page of this blog (https://www.petrikainulainen.net/blog/) before you enter a search term to the search form.

The following figure identifies the location of the search form:

Second, when you want to use the search function, you have to enter the search term to the search form and press the enter key.

Third, if no results are found, the search result page displays the text: 'No results found.'. The following figure illustrates the layout of the search result page when no results are found:

Fourth, if search results are found, the search result page displays the found search results. The following figure illustrates the layout of the search result page when search results are found:

Next, you will learn to write automated tests for the search function.

Writing Tests for the Search Function

When you want to write automated tests for the search function, you must follow these steps:

First, you have to create a new test class and integrate the TestProject OpenSDK with JUnit 5. After you have done this, the source code of your test class looks as follows:

import io.testproject.sdk.DriverBuilder;
import io.testproject.sdk.drivers.web.ChromeDriver;
import org.junit.jupiter.api.AfterAll;
import org.junit.jupiter.api.BeforeAll;
import org.openqa.selenium.chrome.ChromeOptions;

class BlogSearchTest {

    private static ChromeDriver driver;

    @BeforeAll
    static void configureTestProjectOpenSDK() {
        driver = new DriverBuilder<ChromeDriver>(new ChromeOptions())
                .withCapabilities(new ChromeOptions())
                .build(ChromeDriver.class);
    }

    @AfterAll
    static void shutdownTestProjectOpenSDK() {
        driver.quit();
    }
}

Second, you have to create the inner classes which contain the actual test methods. You can create these inner classes by following these steps:

1. Create an inner class that contains the test method which ensures that the system under test is working as expected when no search results are found.
2. Create an inner class that contains the test methods which ensure that the system under test is working as expected when one search result is found.

After you have created the required inner classes, the source code of your test class looks as follows:

import io.testproject.sdk.DriverBuilder;
import io.testproject.sdk.drivers.web.ChromeDriver;
import org.junit.jupiter.api.AfterAll;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Nested;
import org.openqa.selenium.chrome.ChromeOptions;

class BlogSearchTest {

    private static ChromeDriver driver;

    @BeforeAll
    static void configureTestProjectOpenSDK() {
        driver = new DriverBuilder<ChromeDriver>(new ChromeOptions())
                .withCapabilities(new ChromeOptions())
                .build(ChromeDriver.class);
    }

    @Nested
    class WhenNoSearchResultsAreFound {

    }

    @Nested
    class WhenOneSearchResultIsFound {

    }

    @AfterAll
    static void shutdownTestProjectOpenSDK() {
        driver.quit();
    }
}

Third, you have to write the test method which ensures that the system under test is working as expected when no search results are found. You can write this test method by following these steps:

1. Open the front page of this blog (https://www.petrikainulainen.net/blog/).
2. Enter the search term to the search form and press the enter key.
3. Verify that the search result page displays the text: 'No results found.'.

After you have written this test method, the source code of your test class looks as follows:

import io.testproject.sdk.DriverBuilder;
import io.testproject.sdk.drivers.web.ChromeDriver;
import org.junit.jupiter.api.AfterAll;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Nested;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeOptions;

import java.util.List;

import static org.assertj.core.api.Assertions.assertThat;

class BlogSearchTest {

    private static ChromeDriver driver;

    @BeforeAll
    static void configureTestProjectOpenSDK() {
        driver = new DriverBuilder<ChromeDriver>(new ChromeOptions())
                .withCapabilities(new ChromeOptions())
                .build(ChromeDriver.class);
    }

    @Nested
    class WhenNoSearchResultsAreFound {

        @Test
        void shouldDisplayEmptySearchResultPage() {
            driver.get("https://www.petrikainulainen.net/blog/");

            WebElement searchField = driver.findElement(By.id("s"));
            searchField.sendKeys("noresults");
            searchField.sendKeys(Keys.ENTER);

            WebElement noResultElement = driver.findElement(
                    By.cssSelector(
                            ".template-search .content .post_box .archive_content"
                    )
            );
            assertThat(noResultElement.getText()).isEqualTo("No results found.");
        }
    }

    @Nested
    class WhenOneSearchResultIsFound {

    }

    @AfterAll
    static void shutdownTestProjectOpenSDK() {
        driver.quit();
    }
}

Fourth, you have to write the test method which ensures that the search result page displays one search result when one search result is found. You can write this test method by following these steps:

1. Open the front page of this blog (https://www.petrikainulainen.net/blog/).
2. Enter the search term to the search form and press the enter key.
3. Ensure that the search result page displays one search result.

After you have written this test method, the source code of your test class looks as follows:

import io.testproject.sdk.DriverBuilder;
import io.testproject.sdk.drivers.web.ChromeDriver;
import org.junit.jupiter.api.AfterAll;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Nested;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeOptions;

import java.util.List;

import static org.assertj.core.api.Assertions.assertThat;

class BlogSearchTest {

    private static ChromeDriver driver;

    @BeforeAll
    static void configureTestProjectOpenSDK() {
        driver = new DriverBuilder<ChromeDriver>(new ChromeOptions())
                .withCapabilities(new ChromeOptions())
                .build(ChromeDriver.class);
    }

    @Nested
    class WhenNoSearchResultsAreFound {

        @Test
        void shouldDisplayEmptySearchResultPage() {
            driver.get("https://www.petrikainulainen.net/blog/");

            WebElement searchField = driver.findElement(By.id("s"));
            searchField.sendKeys("noresults");
            searchField.sendKeys(Keys.ENTER);

            WebElement noResultElement = driver.findElement(
                    By.cssSelector(
                            ".template-search .content .post_box .archive_content"
                    )
            );
            assertThat(noResultElement.getText()).isEqualTo("No results found.");
        }
    }

    @Nested
    class WhenOneSearchResultIsFound {

        @Test
        void shouldDisplaySearchResultPageWithOneSearchResult() {
            driver.get("https://www.petrikainulainen.net/blog/");

            WebElement searchField = driver.findElement(By.id("s"));
            searchField.sendKeys("oneresult");
            searchField.sendKeys(Keys.ENTER);

            List<WebElement> searchResults = driver.findElements(
                    By.tagName("article")
            );
            assertThat(searchResults).hasSize(1);
        }
    }

    @AfterAll
    static void shutdownTestProjectOpenSDK() {
        driver.quit();
    }
}

Fifth, you have to write the test method which ensures that the search result page displays the correct search result when one search result is found. You can write this test method by following these steps:

1. Open the front page of this blog (https://www.petrikainulainen.net/blog/).
2. Enter the search term to the search form and press the enter key.
3. Ensure that the title of the displayed search result is correct.

After you have written this test method, the source code of your test class looks as follows:

import io.testproject.sdk.DriverBuilder;
import io.testproject.sdk.drivers.web.ChromeDriver;
import org.junit.jupiter.api.AfterAll;
import org.junit.jupiter.api.BeforeAll;
import org.junit.jupiter.api.Nested;
import org.junit.jupiter.api.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeOptions;

import java.util.List;

import static org.assertj.core.api.Assertions.assertThat;

class BlogSearchTest {

    private static ChromeDriver driver;

    @BeforeAll
    static void configureTestProjectOpenSDK() {
        driver = new DriverBuilder<ChromeDriver>(new ChromeOptions())
                .withCapabilities(new ChromeOptions())
                .build(ChromeDriver.class);
    }

    @Nested
    class WhenNoSearchResultsAreFound {

        @Test
        void shouldDisplayEmptySearchResultPage() {
            driver.get("https://www.petrikainulainen.net/blog/");

            WebElement searchField = driver.findElement(By.id("s"));
            searchField.sendKeys("noresults");
            searchField.sendKeys(Keys.ENTER);

            WebElement noResultElement = driver.findElement(
                    By.cssSelector(
                            ".template-search .content .post_box .archive_content"
                    )
            );
            assertThat(noResultElement.getText()).isEqualTo("No results found.");
        }
    }

    @Nested
    class WhenOneSearchResultIsFound {

        @Test
        void shouldDisplaySearchResultPageWithOneSearchResult() {
            driver.get("https://www.petrikainulainen.net/blog/");

            WebElement searchField = driver.findElement(By.id("s"));
            searchField.sendKeys("oneresult");
            searchField.sendKeys(Keys.ENTER);

            List<WebElement> searchResults = driver.findElements(
                    By.tagName("article")
            );
            assertThat(searchResults).hasSize(1);
        }

        @Test
        void shouldDisplaySearchResultPageWithCorrectSearchResult() {
            driver.get("https://www.petrikainulainen.net/blog/");

            WebElement searchField = driver.findElement(By.id("s"));
            searchField.sendKeys("oneresult");
            searchField.sendKeys(Keys.ENTER);

            WebElement searchResult = driver.findElement(
                    By.tagName("article")
            );
            WebElement resultTitle = searchResult.findElement(
                    By.className("headline")
            );
            assertThat(resultTitle.getText())
                    .isEqualTo("Java Testing Weekly 22 / 2018");
        }
    }

    @AfterAll
    static void shutdownTestProjectOpenSDK() {
        driver.quit();
    }
}

Let's move on and find out how you can run automated tests which use the TestProject OpenSDK and JUnit 5.

Running Your Automated Tests

You can run your tests by following these steps:

First, you have to start the TestProject agent and ensure that it's running before you run your tests. If you want to ensure that your agent is ready to run your tests, you have to follow these steps:

1. Open the app.testproject.io website.
2. Open the 'Agents' tab.
3. Ensure that the status of your agent is: 'Ready'.

The following figure illustrates the layout of the 'Agents' page:

Second, you have to run your tests by using one of these options:

• If you are using Gradle, you can run your tests by using the command: gradle clean test.
• If you are using Maven, you can run your tests by using the command: mvn clean test.
• You can also run (or debug) your tests by using your IDE.

You can now write tests for web applications by using the TestProject OpenSDK and JUnit 5, and you know how you can run your tests. Let's summarize what you learned from this blog post.

Summary

This blog post has taught you four things:

• You should consider using a configuration which ensures that all test methods found from the same test class are shown on the same test report.
• You should separate different scenarios by using inner classes.
• You must ensure that the TestProject agent is running before you run your tests.
• When you run your tests, the TestProject agent sends test execution data to the TestProject plaform which generates test reports and publishes the generated reports on the TestProject reporting dashboard.

P.S. You can get the example application of this blog post from Github.