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 I am on the search page”

    The other undefined step definitions will be highlighted as being undefined still.

Creating the Undefined Step Definitions

  1. Right-click on the ‘When I search for “<string>”‘ step and select ‘Generate Step Definitions’
  2. Copy the method for the undefined step definition to the clipboard and then paste it in to ‘SendKeysSteps.cs’ class file like below (SendKeysSteps.cs is where we contain all the step definitions which sends keys / strings to a given element)…
    •  Rename the String argument to something suitable (e.g. ‘searchTerm’)

  3. Go back to the Feature file, right-click the ‘And I view the first result’ step and select ‘Generate Step Definitions’
  4. Copy the method for the undefined step definition to the clipboard and then paste it in to ‘ReturnClickSteps.cs’ class file like below (ReturnClickSteps.cs is where we contain all the step definitions which returns a new page class when we click on an element)…

  5. Go back to the Feature file, right-click the ‘Then I see the Reddit homepage’ step and select ‘Generate Step Definitions’
  6. Copy the method for the undefined step definition to the clipboard and then paste it in to ‘ValidationSteps.cs’ class file like below (ValidationSteps.cs is where we contain all the step definitions that perform assertions / validation checks)…

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 ‘Add’ –> ‘Class’ 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 IWebElement at the top of the class (From Selenium WebDriver v3.11.0+, PageFactory is obsolete, so instead of using…

    …We should instead declare our elements like below…

    We will use this element 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.

    Also make sure that the ‘BasePage’ class has the correct namespaces referenced via the ‘using’ Directive…

  4. Add the following test method within the ‘BasePage.cs’ class…

    The above 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 an instance of 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 ‘Add’ –> ‘Class’ 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. Open up the ‘SearchResultsPage.cs’ class file in the ‘Pages’ namespace and add the following IWebElement in the top of the class for the search results container / content area…

  8. Let’s use this element to make a method to assert that the search results content area is displayed.  Add the following method to the ‘SearchResultsPage.cs’ class…

  9. Again, add another IWebEelement at the top of the 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”. Also make sure the correct using directives have been added…

    We will use this ‘SearchResults’ list of elements in our test method for clicking the link in the searchResult at Index 0.

  10. Add the following test method within the ‘SearchResultsPage’ class…

  11. Because we will want to use both the ‘SelectFirstListedSearchResult()’ and ‘AssertSearchResultsDisplayed()’ methods in our ‘And I view the first result’ step, we can make both these methods private to the class and then make another public method that calls them, like below…

  12. Next, we can assert that we see the Reddit homepage by making a method which first asserts that we are on the reddit page (and it’s loaded) and then calls all of the base validation methods we made in the previous section.  Open up the ‘RedditPage’ class again and add the IWebElement in the top of the class…

  13. Next, add a method to assert the RedditContentArea is displayed as well as calling the base validation methods to check the page title, page source and URL, the whole thing should look like below…

Connecting the Step Definitions to the Test methods

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

  1. Open up the ‘SendKeysSteps.cs’ class file again, and refactor the ‘When I search for “<string>”‘ step so it initialises the page (in this case ‘BasePage’) with the correct web elements rendered and then calls the SearchFor() method, like below…
  2. Open up the ‘ReturnClickSteps.cs’ class file again, and refactor the ‘When I view the first result’ step so it initialises the page (in this case ‘SearchResultPage’) with the correct web elements rendered and then calls the SelectFirstListedSearchResult() method, like below…
  3. Open up the ‘ValidationSteps.cs’ class file again, and refactor the ‘Then I see the Reddit homepage’ step so it initialises the page (in this case ‘RedditPage’) with the correct web elements rendered and then calls the AssertIAmOnRedditPage() method, like below…

Run the test scenario and it should now pass 😀

Digiprove sealCopyright secured by Digiprove © 2018
Liked it? Take a second to support Thomas on Patreon!

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.