Execute UI Tests in the Cloud- BrowserStack

WebDriver
47 Shares
Cloud Test Execution BrowserStack

A couple of weeks ago I started a new series of articles dedicated to the execution of UI tests in the cloud. The first publication was Execute UI Tests in the Cloud- Cross Browser Testing. Here I am going to present to you another cloud platform- BrowserStack. You can find even more useful information about the UI automated testing in my WebDriver Series.

Execute Tests in the Cloud- BrowserStack

How to Setup Your Tests?

1. Create a free registration at https://www.browserstack.com/users/sign_up

Free Account BrowserStack

2. Open the BrowserStack Documentation

3. Select a preferred programming language and unit testing framework

Select Preferred Programming Language BrowserStack

4. Navigate to the configure capabilities section

5. Select your preferred operating system

Configure OS BrowserStack

6. Select your preferred browser

Configure Browser BrowserStack

7. Select your preferred resolution

Configure Resolution BrowserStack

8. Copy the generated capabilities keys and values

Copy Generated Capabilities Keys and Values

9. Copy your authentication key and user name

Copy UserName and Authentication Key BrowserStack

10. Create a new .NET library project

11. Install all required NuGet packages

<packages>
<package id="NUnit" version="3.7.1" targetFramework="net452" />
<package id="NUnit3TestAdapter" version="3.7.0" targetFramework="net452" />
<package id="Selenium.Chrome.WebDriver" version="2.29" targetFramework="net452" />
<package id="Selenium.Support" version="3.4.0" targetFramework="net452" />
<package id="Selenium.WebDriver" version="3.4.0" targetFramework="net452" />
</packages>

12. Copy the sample code from the documentation

C# Setup Code Example

private string _username = "antonangelov2";
private string _authkey = "yxMDqyW62chvy3QycWRb";
private IWebDriver _driver;
[SetUp]
public void SetupTest()
{
var caps = new DesiredCapabilities();
caps.SetCapability("browserstack.debug", "true");
caps.SetCapability("build", "1.0");
caps.SetCapability("os", "Windows");
caps.SetCapability("os_version", "8.1");
caps.SetCapability("browser", "Firefox");
caps.SetCapability("browser_version", "54.0");
caps.SetCapability("resolution", "1366x768");
caps.SetCapability("browserstack.video", "true");
caps.SetCapability("build", "version1");
caps.SetCapability("project", "AutomateThePlanet");
caps.SetCapability("browserstack.user", _username);
caps.SetCapability("browserstack.key", _authkey);
_driver = new RemoteWebDriver(new Uri("http://hub-cloud.browserstack.com/wd/hub/"), caps, TimeSpan.FromSeconds(180));
}
[TearDown]
public void TeardownTest()
{
_driver.Quit();
}

In the previous points, we have copied the user name and the authentication key we use them as values with the browserstack.user and browserstack.key keys. Also, you have copied the other key value pairs we set them as well. If you want your tests to be video recorded you need to set the browserstack.video key to true. For advanced filtering of your runs, you can set different values for the build and project keys. To enable debugging from Visual Studio set the browserstack.debug key to true.

Tests Examples

[Test]
public void ScrollFocusToControl_InCloud_ShouldFail()
{
_driver.Navigate().GoToUrl(@"https://automatetheplanet.com/compelling-sunday-14022016/");
var link = _driver.FindElement(By.PartialLinkText("Previous post"));
var jsToBeExecuted = $"window.scroll(0, {link.Location.Y});";
((IJavaScriptExecutor)_driver).ExecuteScript(jsToBeExecuted);
link.Click();
Assert.AreEqual("10 Advanced WebDriver Tips and Tricks - Part 1", _driver.Title);
}
[Test]
public void ScrollFocusToControl_InCloud_ShouldPass()
{
_driver.Navigate().GoToUrl(@"https://automatetheplanet.com/multiple-files-page-objects-item-templates/");
var link = _driver.FindElement(By.PartialLinkText("TFS Test API"));
var jsToBeExecuted = $"window.scroll(0, {link.Location.Y});";
((IJavaScriptExecutor)_driver).ExecuteScript(jsToBeExecuted);
var wait = new WebDriverWait(_driver, TimeSpan.FromMinutes(1));
var clickableElement = wait.Until(ExpectedConditions.ElementToBeClickable(By.PartialLinkText("TFS Test API")));
clickableElement.Click();
Assert.AreEqual("TFS Test API Archives - Automate The Planet", _driver.Title);
}

These tests are absolutely the same as the one that we created for the CrossBrowserTesting platform.

BrowserStack- Cloud Execution- Features

On the first page of your account, you can view all past/executing test runs.

Completed Test Runs BrowserStack

If you open one of the test runs you can see its details such as OS, browser, resolution. Also, you can watch the video recording of your test.

Video Recording BrowserStack

Another unique feature of the platform is the so-called visual logs, where you can see all executed commands followed by screenshots capturing the moments after the commands' completion.

Visual Logs BrowserStack

As in the other platforms, you can see the raw requests. However, here they are displayed as a plain text.

Raw Logs BrowserStack

In the next article from the series, I will show you how to use another major cloud platform- SauceLabs.