BrowserStack

For Cross Browser Testing

Have you ever caught in a situation when an application is not working in one browser but working fine in another browser?

If yes, then that application is not tested for browser compatibility.

Testing for browser compatibility can be the biggest pain for any Software Tester. But thanks to all Cross-Browser Test tools available which help in minimizing the testing efforts.

What is cross-browser testing?

Cross-browser testing is simply what its name means — that is, to test your website or application in multiple browsers- and making sure that it works consistently. (Applicable to both web and mobile applications)

What kinds of applications undergo this? Customer-facing applications are the best choice.

What is the intent of cross-browser testing? The appearance of the page & the functionality.

What is BrowserStack?

•BrowserStack is a cloud web and mobile testing platform that enables developers to test their websites and mobile application across different browsers, operating systems, and mobile devices.

•Users can select more than 1,200 real mobile devices, browsers, and operating systems and rely on a secure, stable infrastructure to support thousands of concurrent manual and automation tests.

Suppose if you want to run your test case on multiple browsers/multiple machines but the requirement is one-time requirement, so for that particular requirement if you want to set up all multiple browsers/multiple machines it will be very costly also it will take a lot of effort & time. To avoid that we can use BrowserStack where they will provide the inbuilt infrastructure for us to test on multiple browsers/multiple machines. So you can just select whatever the operating system you want, browser, browser version, and all.

How BrowserStack works?

• BrowserStack.com works by connecting you with a real machine running in one of their geographically distributed Data Centers. (15 data centers across 12 locations)

Globally distributed Data Centers

Other cross-browser testing tools

Other cross-browser testing tools

Pricing Comparison

Price comparison

Key Features of BrowserStack

•Live & Automate — to test your websites

•App live & App Automate — to test your mobile apps

•Real devices to test your applications

•Testing across a wide range of browsers and get perfect experience across all browsers, browser versions, & operating systems

•Enjoy testing through the browsers with the help of DevTools

•Support for Beta & Dev versions

•Never remove old browsers/versions

•Flexibility to test your locally hosted web sites

•Integration capability with different bug tracking & project management tools etc.

Framework & Language Support

Framework & Language Support

Integrations

Popular Integrations

Prerequisites need to work with BrowserStack

• Sign up & create your own BrowserStack account. Then once you create your own account, BrowserStack will provide you an access key.
• Use particular Access key in your selenium script.

BrowserStack is a commercial tool but it also has a free trial plan. You can sign in entering your business email and password if you already have an account.

As soon as you log in to the site, you will get a dashboard page all four products are listed on the top of the screen.

Four main products in BrowserStack

1. Live: Applies for manual testing on live products across desktop & mobile browser devices
2. Automate: Automation testing across web & mobile browsers
3. APP Live: Manual testing of real native apps
4. APP Automation: Use for app automation

You can see a wide range of devices, OS versions, & browsers.

Wide range of devices, OS versions, & browsers

Also, they support for Beta & Dev versions for windows and Mac applications and don’t remove older versions.

Support for Beta & Dev versions for windows and Mac desktop applications

Live/Manual Testing

You can start a particular session by clicking any browser available on the dashboard. You can also access dev tools for that particular browser.

Live/Manual testing session

Live/Manual testing

Test Local Websites

You have the flexibility to test local websites as well. There are overall 2 ways to do that

1. LocalTesting feature available in the online site

Local Testing Feature

2. Desktop app (use only for manual testing)

BrowserStack Desktop App

Reporting Bugs

BrowserStack has integration capability with different bug tracking tools (Jira, Trello, Github & Slack). Apart from that, they have the ability to edit and download/email the screenshots.

Reporting a bug feature

Automation Setup

All you need to do is to keep your test case as it is, no change required for your test case. The only thing that you need do is to add capabilities that identify the browser, browser version, OS, OS version. Other capabilities you can add as optional capabilities.

DesiredCapabilities caps = new DesiredCapabilities();
caps.setCapability(“os”, “Windows”);
caps.setCapability(“os_version”, “8.1”);
caps.setCapability(“browser”, “Chrome”);
caps.setCapability(“browser_version”, “84.0 beta”);
caps.setCapability(“project”, “Test Project”);
caps.setCapability(“build”, “Test Build”);
caps.setCapability(“name”, “Test Session”);
caps.setCapability(“browserstack.debug”, “true”);
caps.setCapability(“browserstack.networkLogs”, “true”);
driver = new RemoteWebDriver(new java.net.URL(URL), caps);

There are standardized documents for JAVA & TestNG, you can refer them for detail explanations.

Apart from the capabilities, you need to provide your credentials in the script.

public static final String USERNAME = “Your User Name”;
public static final String AUTOMATE_KEY = “Your Automate Key”;
public static final String URL = “https://” + USERNAME + “:” + AUTOMATE_KEY + “@hub-cloud.browserstack.com/wd/hub”;

Sample Test Code

Capabilities Generator

You can generate the capabilities you want easily. You just need to enter the data on the screen left side & capabilities will generate on the right side.

Capabilities Generator

Browser List

https://www.browserstack.com/automate/browsers.json is a JSON file that has a list of browsers & OS combinations including real device browsers which are supported in BrowserStack.

Whenever a new browser gets supported this file will also be updated. You can call this file at run time and pick a specific OS and browser version or you can periodically download to local infrastructure and then capture the specific browser/OS combination you interested in.

browsers.json

BrowserStack Automation Dashboard

BrowserStack automation dashboard will show all the builds, if you go into a particular build you will be able to see different sessions you have run on BrowserStack.

Different sessions you have run on BrowserStack

If you select a particular session on a particular browser you would be able to see a few logs.

1. Video Log
2. Text logs -with visuals (These visuals are coming because of the custom parameter that BrowserStack implemented, which is called BrowserStack debugging is true. These are not the screenshots that you explicitly took but if you specify the debug parameter, at every screen change they would take screenshots. That would help you to debug in a better way based on the visual generated at different points of the application.
3. Console Logs
4. Network Logs
5. Selenium Logs

Test logs

Latency

When you running your test on a remote cloud there could be a latency factor in terms of browser getting faster/slower.

References

BrowserStack: https://www.browserstack.com

DZONE article — Top 5 Cross-Browser Testing Tools — https://dzone.com

Let’s meet with another exciting article.

Till Then Happy Testing!!!!