Creating your First Proper Test

Search for “Reddit” on DuckDuckGo and Select a Search Result

Creating the SpecFlow Scenario

When creating our BDD scenarios, we want to keep them simple and write them in a declarative style, sticking simply to the business logic, rather than writing them in an imperative style.  A great article on this can be found at http://itsadeliverything.com/declarative-vs-imperative-gherkin-scenarios-for-cucumber.

  1. Right-click on the ‘Features’ folder and select ‘Add a New Item’
  2. In the window that appears, select ‘SpecFlow Feature File’ and create a file called ‘SearchScenarios.feature’
  3. Open up the ‘SearchScenarios.feature’ file and add the following test scenario. We can also add a SpecFlow tag either above the ‘Scenario’ (to apply to the specific scenario) or above the ‘Feature’ (to apply to all scenarios within the feature)…

    If you’ve been following all the blog posts in this series, you will notice that we have reused some existing steps in this scenario, such as;
    – “Given an internet user is on the search page”

    The other steps will still be undefined.

Creating the Undefined Step Definitions

    • Copy the method below in SearchSteps class for the undefined When step…

  1. Add the next undefined step for the ‘When I view the first result’ to the RedditSteps.cs step definition class…

  2. Add the final undefined step for ‘Then they see the Reddit homepage’ to the RedditSteps.cs step definition class file also, so that the whole thing looks similar to below…

Creating the Test Methods

We will now create test methods in C# for each of our steps.

Because we are taken to a new ‘search results’ page when we submit a search on Google, we should create a new page class for the search results page.

  1. Right-click the ‘Pages’ folder, select ‘New File’ and add a new page class file called ‘SearchResultsPage.cs’
  2. Open up the ‘SearchResultsPage.cs’ class file and edit it so it looks like below (we want it to inherit from BasePage, as that is where we navigate to the page from when we conduct our search on the ‘BasePage’)…
  3. Open up the ‘BasePage.cs’ class file in the ‘Pages’ namespace and add the following By locator at the top of the class (From Selenium WebDriver v3.11.0+, PageFactory is obsolete, so instead of using…

    …We should instead create By locators like below (this is preferred by Simon Stewart himself, the creator of Selenium)…

    We will use this By locator in our test method for sending keys to the ‘SearchField’ IWebElement. If you right-click on the search field in Chrome web browser and select ‘Inspect Element’, you can see that it has the value of ‘q’ given for its ‘name’, this is what we use to find the element in our test framework.
  4. Add the following test method within the ‘BasePage.cs’ class…

    The whole thing should look like below…

    The above added method clears the ‘SearchField’ of any text, and then sends the passed string to the ‘SearchField’, presses the Return key to submit the search, and then returns the ‘SearchResultsPage’ page class after submission.

    Because we are taken to a new ‘Reddit’ page after selecting the appropriate search result, we should create another new page class for the ‘Reddit’ page. Because when we click on a search result, we are taken to another page, this would count as a ‘ReturnClick’ method, due to a new page object being returned.

  5. Right-click the ‘Pages’ folder, select ‘New File’ and add a new page class file called ‘RedditPage.cs’
  6. Open up the ‘RedditPage.cs’ class file and edit it so it looks like below (we want it to inherit from ‘SearchResultsPage’ class, as that is where we navigate to the page from when we click through on our search result)…

  7. Add the following By locator on the Reddit page…

  8. Open up the ‘SearchResultsPage.cs’ class file in the ‘Pages’ namespace and add the following By locator in the top of the class for the search results container / content area…

    The whole thing should look like below with the using directive added too…

  9. Let’s use this By locator to make an element from it and to add an assertion to the ‘When they view the first result’ step (we will still be adding more at the start of this step definition later), with the whole thing looking like below…

  10. Next, add another By locator at the top of the ‘SearchResultsPage’ class, for the search result links…

    If we inspect the element of the first listed result, we can see that every result link returned by DuckDuckGo falls in an <a> anchor tag with the class name of “result__a”.

    We will use this ‘SearchResults’ locator in our list of search results element and then click the first result and return the RedditPage class

  11. Add the following test method within the ‘SearchResultsPage’ class, with the whole thing looking like below…

Fully defining the Step Definitions

We will now call the test methods from their appropriate step definitions.

  1. Open up the ‘SearchSteps.cs’ class file again, and refactor the ‘When I search for “<string>”‘ step so it searches for the given search term…
  2. Open up the ‘RedditSteps.cs’ class file again, and refactor the ‘When they view the first result’ step so that after the assertion of search results, it calls the SelectFirstListedSearchResult() method…
  3. Open up the ‘RedditSteps.cs’ class file again, and refactor the ‘Then they see the Reddit homepage’ step so it asserts that the user is on the Reddit page, with the whole class looking like below…
Digiprove sealCopyright secured by Digiprove © 2018
Liked it? Take a second to support Thomas on Patreon!

Previous Article

Next Article

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.