Click here to Skip to main content
13,552,325 members
Click here to Skip to main content
Add your own
alternative version

Stats

13.2K views
6 bookmarked
Posted 29 Nov 2017
Licenced CPOL

Getting started with Selenium 3.7 using Visual Studio 2017/C#

, 30 Nov 2017
Rate this:
Please Sign up or sign in to vote.
This article provides detailed steps for writing test cases using Selenium 3.7.0 and Visual Studio 2017/C#.

Table of Contents

  1. Introduction.
  2. Downloading Visual Studio 2017 Community Edition.
  3. Creating a New Solution (and a Test Project)
  4. Creating a Test Case for Firefox Browser.
  5. Adding Selenium/Firefox NuGet Packages.
  6. Executing the Firefox Test Case.
  7. Creating a Test Case for Chrome Browser.
  8. Adding Selenium/Chrome Nuget Packages.
  9. Executing the Chrome Test Case.
  10. Creating a Test Case for Edge Browser.
  11. Adding Selenium/Edge NuGet Packages.
  12. Setting up the Edge Driver.
  13. Executing the Edge Test Case.
  14. Execute All Test Cases.
  15. Conclusion.

Introduction

In this article, we test-drive (no pun intendedJ) the latest version of Selenium (version 3.7.0 as of 11-30-2017) using the following browsers:

  1. Firefox
  2. Chrome
  3. MS Edge

For this exercise, we use the following test case.

  1. Open Google homepage
  2. Enter a search term in the textbox
  3. Click the "Google Search" button
  4. Verify that the test results page is displayed

We automate the test case using the community edition of Visual Studio 2017 and C#. We write a separate test case for each of the browsers mentioned above. We purposely compartmentalized the instructions for creating the test cases, to experiment with them separately.

So, let us get started!

Downloading Visual Studio 2017 Community Edition

Download and install Visual Studio 2017 community edition (Skip ahead if you already have Visual Studio 2017 installed - any version will work).

Here is the link. https://www.visualstudio.com/downloads/

Creating a New Solution (and a Test Project)

Here are the steps for creating a test project.

  1. Open Visual Studio and create a new project. Click on ‘File’, select ‘New’, then select ‘Project…’
     
  2. From the “New Project” template, select ‘Visual C#’ on the left side of the pane, then select ‘Test’. On the right side, select “Unit Test project”.


     
  3. Select a name and location for your project and click “OK”

Creating a Test Case for Firefox Browser

Now that we created a ‘Test Project’, let us focus on creating a test case for Firefox.

  1. The unit test file is created with a default name “UnitTest1.cs”

  2. Let us change the name to “GoogleSearch.cs”. The easiest way to rename the file is to right-click on “UnitTest1.cs” in solution explorer, and select rename.


     
  3. Click “Yes” for the dialog pop-up. This will rename both the file and the class. It is a best practice to give the same name to the class and the file containing it.


     
  4. Next, rename “Method1” to “Should_Search_Using_Firefox”


     
  5. After the rename, the method should look like the following.

Adding Selenium/Firefox NuGet Packages

Before we continue with the creation of the test case, let us add the required packages to the project.

  • Selenium.webdriver
  • Selenium.Support
  • Selenium.Firefox.Webdriver
  1. Right-click on the project name in the solution explorer, then select ‘Manage NuGet Packages…’


     
  2. From the NuGet window, make the following selections:
    1. Select “Browse
    2. Type “selenium” in the search box
    3. Select “Selenium.WebDriver” from the search results
    4. Put a checkmark next to “Project’
    5. Click “Install”

  3. Follow the same process to install “Selenium.Support”


     
  4. Again, follow the same process to install “Selenium.Firefox.Webdriver”


     
  5. Add a “using” statement at the top of the test file, and create an instance of the Firefox driver, as shown
    below.

The complete code for the test case is shown below

using System;
using Microsoft.VisualStudio.TestTools.UnitTesting;
using OpenQA.Selenium.Firefox;

namespace Selenium3_7_VisualStudio2017
{
 [TestClass]
 public class GoogleSearchEngineUsingFirefox
 {
  [TestMethod]
  public void Shoud_Search_Using_Firefox()
  {
   // Initialize the Firefox Driver
   using(var driver = new FirefoxDriver())
   {
    // 1. Maximize the browser
    driver.Manage().Window.Maximize();

    // 2. Go to the "Google" homepage
    driver.Navigate().GoToUrl("http://www.google.com");

    // 3. Find the search textbox (by ID) on the homepage
    var searchBox = driver.FindElementById("lst-ib");

    // 4. Enter the text (to search for) in the textbox
    searchBox.SendKeys("Automation using selenium 3.0 in C#");

    // 5. Find the search button (by Name) on the homepage
    var searchButton = driver.FindElementByName("btnK");

    // 6. Click "Submit" to start the search
    searchButton.Submit();

    // 7. Find the "Id" of the "Div" containing results stats,
    // located just above the results table.
    var searchResults = driver.FindElementById("resultStats");
   }
  }
 }
}

Executing the Firefox Test Case

Right-click on the test case in the test explorer, and select “Run Selected Tests”

(You can also right-click inside the method itself, anywhere after line 13, for example)

Creating a Test Case for Chrome Browser

Add a new test case, and give it a name: ‘Shoud_Search_Using_Chrome’.

Here is the complete code.

using System;
using Microsoft.VisualStudio.TestTools.UnitTesting;
using OpenQA.Selenium.Chrome;

namespace Selenium3_7_VisualStudio2017
{
 [TestClass]
 public class GoogleSearchEngineUsingChrome
 {
  [TestMethod]
  public void Shoud_Search_Using_Chrome()
  {
   // Initialize the Chrome Driver
   using(var driver = new ChromeDriver())
   {
     // 1. Maximize the browser
     driver.Manage().Window.Maximize();

     // 2. Go to the "Google" homepage
     driver.Navigate().GoToUrl("http: //www.google.com");
     
     // 3. Find the search textbox (by ID) on the homepage
     
     var searchBox = driver.FindElementById("lst - ib");
     // 4. Enter the text (to search for) in the textbox
     searchBox.SendKeys("Automation using selenium 3.0 in C#");

     // 5. Find the search button (by Name) on the homepage
     var searchButton = driver.FindElementByName("btnK");

     // 6. Click "Submit" to start the search
     searchButton.Submit();

     // 7. Find the "Id" of the "Div" containing results stats
     var searchResults = driver.FindElementById("resultStats");
    }
   }
  }
 }

Adding Selenium/Chrome Nuget Packages

The process for creating the test case for Chrome is very similar to that of Firefox. Basically, we use the NuGet manager to install the Chrome.Webdriver, and then we add a new test case. Here are the steps for installing the Chrome.Webdriver.

  1. Right-click on the project (or the solution)
  2. Select ‘Manage NuGet Packages for Solution…’
  3. Select ‘Browse’ from the NuGet window
  4. Enter ‘Selenium’ in the search box
  5. Select ‘Selenium.Chrome.Webdriver’ from the search results
  6. Click ‘Install’

Executing the Chrome Test Case

To execute the test case, right-click on the test case in the test explorer, then select “Run Selected Tests”. You can also right-click inside the method itself, anywhere after line 13, for example.

Creating a Test Case for Edge Browser

Add a new test case, and give it a name, such as ‘Shoud_Search_Using_EdgeBrowser’.

Here is the complete code for the test case.

using System;
using Microsoft.VisualStudio.TestTools.UnitTesting;
using OpenQA.Selenium.Edge;

namespace Selenium3_7_VisualStudio2017
{
  [TestMethod]
  public class GoogleSearchEngineUsingEdgeBrowser
  {
   // Edge driver full path: @"C:\SeleniumEdgeDriver\MicrosoftWebDriver.exe"
   string edgeDriverLocation = @ "C:\SeleniumEdgeDriver";

   [TestMethod]
   public void Shoud_Search_Using_EdgeBrowser()
   {
    // Initialize the IE Driver
    using(var driver = new EdgeDriver(edgeDriverLocation))
    {
     // 1. Maximize the browser
     driver.Manage().Window.Maximize();

     // 2. Go to the "Google" homepage
     driver.Navigate().GoToUrl("http://www.google.com");

     // 3. Find the search textbox (by ID) on the homepage
     driver.Manage().Timeouts().ImplicitWait = TimeSpan.FromSeconds(10);

     var searchBox = driver.FindElementById("lst-ib");

     // 4. Enter the text (to search for) in the textbox
     searchBox.SendKeys("Automation using selenium 3.0 in C#");

     // 5. Find the search button (by Name) on the homepage
     var searchButton = driver.FindElementByName("btnK");

     // 6. Click "Submit" to start the search
     searchButton.Submit();

     // 7. Find the "Id" of the "Div" containing results stats,
     // just before the results table.
     var searchResults = driver.FindElementById("resultStats");
    }
   }
  }
 }

Adding Selenium/Edge NuGet Packages

The process for creating the test case for Edge is very similar to that of Firefox and Chrome.

Basically, we start by using the NuGet manager to install the Edge.Webdriver. Here are the steps.

  1. Right-click on the project
  2. Select ‘Manage NuGet Packages…’
  3. Select ‘Browse’ from the NuGet window
  4. Enter ‘Selenium’ in the search box
  5. Select ‘Selenium.Webdriver.IEDriver’ from the search results
  6. Click ‘Install’

Setting up the Edge Driver

I run into 2 issues while creating the test case for the Edge browser.

  • Installing the EdgeDriver
  • Adding a timeout (10 seconds) just before locating the textbox (line 25 in the test case)

You may need to download the driver manually and place in a location that you need to reference in the test case. Here are the steps to get the edge driver to work correctly.

  1. Open the edge browser from your desktop
     
  2. Click on the ellipses “…” at the top right of the browser
     
  3. Click on “Settings”


     
  4. Scroll to the bottom of the “Settings” window


     
  5. Make note of the release number. In this case “14393”
     
  6. Navigate to the following page: https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/
     
  7. Note the release number, under the downloads section


     
  8. Click on the “Release 14393” (i.e., select the correct release for the installed version of the browser)
     
  9. Save the “MicrosoftWebDriver.exe” to a location.
     

Executing the Edge Test Case

From the 'Test Explorer', right-click on the test case and select “Run Selected Tests”. You can also click inside the method itself, anywhere after line 13, for example.

Execute All Test Cases

If you implemented all test cases, right-click on the project name in the test explorer and select “Run Selected Tests”

The results should look like the following. As a side note, notice that Edge execution is faster than Firefox and Chrome.

Conclusion

In this introductory article, we presented detailed steps for writing test cases for 3 browsers: Firefox, Chrome, and Edge. We used Selenium 3.7.0 and Visual Studio 2017 community edition/C# to write the test cases. We purposely provided separate instructions for each test case, to help beginners work through the process, one test case at a time.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Mohammed Faci
Tester / Quality Assurance
United States United States
Test Automation Architect with a focus on designing and implementing automation frameworks that are extensible and modular, with re-usable components. Areas of interest include Selenium, Coded UI, C#.

You may also be interested in...

Pro
Pro

Comments and Discussions

 
QuestionVery useful Pin
Minion no. 520-Apr-18 10:19
memberMinion no. 520-Apr-18 10:19 
AnswerRe: Very useful Pin
Mohammed Faci30-Apr-18 9:03
memberMohammed Faci30-Apr-18 9:03 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.180515.1 | Last Updated 30 Nov 2017
Article Copyright 2017 by Mohammed Faci
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid