Setting up Selenium UI tests with headless Chrome in Windows20th August 2017
Simple step-by-step guide to setup automated UI tests with Selenium and headless Chrome in Visual Studio. We will also show you the proper way to crawl the web, while at it.
Even though unit testing is very useful for covering your business logic testing needs, some bugs in the user interface are very hard to find, and are often the ones that frustrate your users the most. Did you spend two months writing a cool new feature that allows people to insert-cool-feature-description-here, and just released it to your production servers? Well, too bad it broke your registration screen, you won't be getting new users to use it any time soon.
Wouldn't it be cooler if there was an easy way of testing all the critical functions and navigation paths of your web application magically, every time you made changes to your codebase? Well, Selenium Webdriver does just that: it loads your favorite browser (
Just follow these simple steps. They are so simple you really have no excuse not to give it a go right now!
1. Install Selenium WebDriver
The first thing you have to do is install Selenium Webdriver. Launch Visual Studio and create a new Unit Test project. Then open up nuget package manager and type:
PM> Install-Package Selenium.WebDriver
This will add the necessary Selenium references to your project.
2. Install ChromeDriver
Next, you have to download ChromeDriver, the executable that implements the WebDriver wire protocol and actually controls Chrome from your code. It is developed by members of the Chromium and WebDriver teams, and can be downloaded from here. Make sure to download the latest version (2.31 as of this writing), one that supports Chrome 60. Once you download it, make sure to extract the single executable file in an easy-to-find location (e.g. c:\chromedriver)
3. Update Chrome
Support for launching Chrome in headless mode was introduced for Linux in version 59, and for Windows in version 60. So make sure you have updated Chrome to the latest version (to find out the current version, go to ⋮ -> Help -> About Google Chrome)
Let's crawl the web!
We now have everything we need in our arsenal to write UI tests. As a simple example, we will perform a sanity check by crawling Google's own search engine and verifying that it returns google.com as the first result for the keyword google.com (googleception!). In comparison, think how difficult this task would have been if you tried doing the same using WebClient and HTML parsing.
//Create a new ChromeOptions object and pass an argument //to activate headless mode var options = new ChromeOptions(); options.AddArgument("headless"); //Launch ChromeDriver specifying the folder that contains //the chromedriver.exe executable (from step 2 above) var driver = new ChromeDriver(@"c:\chromedriver", options); //Navigate to Google's homepage driver.Navigate().GoToUrl("https://www.google.com/"); //Find the search textbox using a CSS selector var search = driver.FindElementByCssSelector("input[name='q']"); //Type the search keyword and press Enter search.SendKeys("google.com\n"); //Find the first <cite> element var cite = driver.FindElementByTagName("cite"); //Check if the url is google.com Assert.IsTrue(cite.Text == "https://www.google.com/"); //Great success!
Wrapping it up
We have seen how easy it is to setup Selenium Webdriver and Chromedriver in order to control Chrome in headless mode for UI testing. This is also a great alternative for setting up a crawler that renders pages exactly the same as in the Chrome browser.