Setup Selenium Web Browser Automation using Asp.net MVC

There exist many kind of test: unit tests, integration tests, acceptance tests…, UI tests.
In this tutorial, I will be interested on UI tests, indeed this kind of test, allows us to validate the IHM by launching the browser, clicking on elements and verify the result. So we can validate the behavior of the application on many browsers: chrome, safari, Firefox, internet explorer, etc…We can also use a specific version of a browser: for sample IE9.

In this tutorial, I will not show how to write Selenium tests in details but I will focus on browser automation in order to execute UI tests on a build environment.

So, let’s go ahead and create an asp.net mvc web project and a Unit Test Project:

  • install-package Selenium.WebDriver
  • install-package Selenium.Chrome.WebDriver
  • install-package SpecFlow
  • install-package SpecFlow.NUnit
  • install-package NUnit3TestAdapter

Specflow scenario

Given the scenario below :

if a anonymous user attempt to create a new blog post, then the user must be redirected to the login page.

Using specflow,  I can write the given scenario as:

createblogfeature

  • Generate Step definitions

Step definitions is the code behind the scenario . To generate this code, right click on the feature file and click on generate step definitions

Generate step definition

Click on Generate button , choose the destination folder and register

Save step definition

The file below will be generated and my scenario steps binded :

example :  Given I m an anonymous user  is matched to the method   [Given(@”I m an anonymous user”)]  public void GivenImAnAnonymousUser().

ScenarioContext.Current.Pending(); means that my step is not implemented yet.  What I have to do is to replace all occurrence of ScenarioContext.Current.Pending();  with my functional tests

StepFile

The final implementation look like this :

StepFile1

Using Selenium

I inject an instance of IWebdriver and grab the root element of my view  :   private IWebElement Root => _webDriver.FindElement(By.Id(“listBlogTable”));

  • _webDriver.FindElement(By.Id(“MyId”)); : to find an element by its ID for example divId
  •  _webDriver.FindElement(By.ClassName(“MyCssClass”)); : to find an element by its ClassName for example CSS class Name
  •  _webDriver.FindElement(By.CssSelector(“MyCssSelector”)); : to find an element by its CssSelector
  •   _webDriver.FindElement(By.TagName(“MyTagName”)); : to find an element by its TagName

For more information about selenium please take a look at : https://docs.seleniumhq.org/

Using selenium

Setup IIS Express to web application

To use it , I need a live website , But I don’t wont to setup and deploy a test environment, so I use IIS Express. I run IIS Express in my local computer or my build agent , I deploy my mvc application to IIS Express, then I use selenium to start the browser.

Notes :The process is different when using asp.net core or owin because they allow me to  host and run a web application directly on the console

For asp.net core please take a look at : Setup Selenium Web Browser Automation and Asp.net Core

My MVC application is on localhost : 62301

My MVC application name is LogCorner.BlogPost.Web.Mvc

web.configBrowser iisStartrup

IisRexpressServerStartup class produces the following

SeleniumStartrup

If all test are executed, I must kill my IIS Express server

kil iisexpress

Startup class start the process before every test and cleanup the process after all tests

StartUp

SEE IT IN ACTION

SOURCE CODE

https://github.com/logcorner/Setup-Selenium-Web-Browser-Automation-and-Asp.net-Mvc

 

Gora LEYE

I'm a microsoft most valuable professional (MVP) .NET Architect and Technical Expert skills located in Paris (FRANCE). The purpose of this blog is mainly to post general .NET tips and tricks, www.masterconduite.com Gora LEYE