This is a follow-on from my previous post on Cross-platform testing. Hope you enjoyed the realms of wandering around the way you could potentially plan your platform testing. I thought I would take some time to explain some of the concepts on cross-platform testing with examples from Browserstack.

Browserstack (www.browserstack.com) is a standard tool these days for testing your web application across multiple platforms.

The current Browserstack product family offers the following three broad service lines (The website offer a good amount of details on different products and offerings)

a. Browserstack live: This allows users to initiate real time interaction with the Browserstack environment.

b. Browserstack Automate: With the BS Automate, users will be able to run selenium-based automated scripts in BS VMs , remotely

c. Browserstack Screenshots : This is more relevant for static contents in the website where the users can generate screenshots across multiple OS-Browsers-device combinations at one go

Let’s take each one of them and talk in a bit more detail.

A. Browserstack Live: A typical Browserstack Live session is more about real time interaction with the VMs on the Browserstack cloud. Depending on the users’ choice, Browserstack will generate a connection with one of the VMs and initiate a session with the chosen Browser/OS.

The process is relatively simple. You will select your OS, and then select your preferred Browser or device. A sample screen looks like the one below. BSFig 1

Fig: Interactive testing with BS

This will spawn a session with the nearest available VM and open your website with the preferred device/OS/browser combo.

There is another great feature that we all should be aware of – ability to use Browserstack in your local environment. What that means – you should be able to use Browserstack for your local Dev environment or the static files in your PC. Browserstack provides you with an extension to your Chrome or Firefox browser. This helps to create a tunnel to the Browserstack VM with the local environment. All you need to do is to use that extension and establish a connection with your local dev. BSFig 2

Fig: connecting to your local environment

B. Browserstack Automate: Another great feature of the tool is the ability to create automated test cases that can run against the Browserstack VMs remotely.

BS subscription allows to get a user specific key through which you will establish a secure connection to the BS VMs and run tests there. All you need to do here is to write your automated code ( they support Selenium) and run them in your preferred OS/Brwoser combo.

A sample code snippet will look like this.

namespace browserStackAutomate
{
[TestFixture()]
public class BrowserstackTestWeb
{
private IWebDriver driver;
private string baseURL;

[SetUp]
public void Init()
{
DesiredCapabilities capability = DesiredCapabilities.Firefox();
capability.SetCapability(“browser”, “firefox”);
capability.SetCapability(“browser_version”, “26.0”);
capability.SetCapability(“os”, “Windows”);
capability.SetCapability(“os_version”, “7”);
capability.SetCapability(“resolution”,”1024×768″);
capability.SetCapability(“browserstack.debug”,”true”);
capability.SetCapability(“browserstack.user”, “userxyz”);
capability.SetCapability(“browserstack.key”, “samplekey”);
capability.SetCapability(“acceptSslCerts”, “true”);
driver = new RemoteWebDriver(
new Uri(“http://hub.browserstack.com/wd/hub/”), capability
);
baseURL = “https://samplewebsite.com”;
}

[Test]
public void LoginToAEOTest()
{
driver.Navigate().GoToUrl(baseURL + “/home”);
StringAssert.Contains(“Login”, driver.Title);
// Body of the actions – Test to be run against BS VM
}

[TearDown]
public void Cleanup()
{
driver.Quit();
}
}

You can use a standard framework like NUnit to run the test cases remotely.

A typical remote Execution will look like the one below where you should be able to view the execution logs real time through Browserstack console.

BSFig 3

Fig: Execution on a desktop browser

 43

Fig: Execution in a Mobile device

C. Browserstack Screenshot: Browserstack has another capability of capturing a series of screenshots of your website pages in your preferred OS/Browser/deice combo. You can specify the different combinations that you will need the screenshots for and it will collect them for you.

An integration component for Developers: Interesting part of using Browserstack is you can use it right from the time you are writing your code. Browserstack comes up with a Visual Studio integration that allows you to test your pages against different browsers within your VS console.

BSFig 5

One thing you need to ensure that you have Microsoft ASP.NET and Web Tools 2012.2 installed for Visual Studio 2012. This will help register BrowserStack in the list of browsers on which you can test. On clicking on BrowserStack, you will see a list of browsers and OSs being supported, and then use the BrowserStack cloud infrastructure to view your website. If you’ve already installed the BrowserStack extension, it should show up in the ‘Browse With’ menu after installing ASP.NET and Web Tools 2012.

To conclude, there are many tools in the market that will allow you achieve similar outcome. This is a demonstration for just one of those – that you might end up using it and make your website better !

I am sure that should be enough to get you going…until then Happy Testing !

If you have any question relating your website compatibility, please reach out to us at www.kloud.com.au

Category:
Application Development and Integration
Tags:
, , , ,