Testing Older Browser Versions


#1

Most popular browsers such as Google Chrome and Mozilla Firefox frequently release their updates, usually every six to eight weeks. In most cases, these updates are installed automatically to ensure that the users are provided with new features and protection.
This means that when testing a particular web browser, in most cases we test the latest version.

However, your testing job doesn’t end when you make sure that your web application works great in the most recent version of Google Chrome, Mozilla Firefox, Apple’s Safari, Opera, and Microsoft Edge.
Many users may still use older browser versions to access your web application because they have not restarted the browser after an update or because they have completely disabled automatic updates.
In addition, you cannot easily find and download an old browser version for testing purposes and not have it updated automatically during testing.

All of this makes it difficult to ensure that your web application will work correctly across different browsers, including previous versions.

So how can we then test the older versions of a particular browser?

The first method: Testing via custom endpoint using Ranorex Webtestit and Browserstack

For many developers, Browserstack is the main tool for testing a wide range of devices and browsers, including their older versions. Ranorex Webtestit allows you to use the Browserstack’s resources via endpoint to test previous browser versions. In the following paragraphs, we will explain how to do that.

Browserstack requires that users have a registered account, so you’ll need to sign up if you don’t have one. Browserstack also provides a free trial that will allow you to try out its features before you buy the subscription.

After logging into your Browserstack account, copy your username and access key from the Dashboard.

Next, create your test in Ranorex Webtestit. After you have finished, add an endpoint to run your test. Choose the ‘Custom Endpoint’ tab and rename it as you like.

In URL field, add:

https://UserName:[email protected]/wd/hub

Replace the ‘UserName’ and ‘AccessKey’ with your actual Browserstack credentials you copied from the Dashboard.

Next, select the version of the browser you want to use to run tests. To do this, you need to provide the capabilities to your endpoint.
You can use the Browserstack’s Capabilities Generator and copy the values into the capabilities field.

Basically, we need only operating system, OS version, browser, and browser version for this test. For example, if we want to test Chrome 62 on Windows 10, we’ll add the following code into the capabilities field:

{
  "os": "Windows",
  "os_version": 10,
  "browserName": "Chrome",
  "browser_version": "62.0"
}

Note: You can change these entries depending on which browser and its version you want to test.

Here’s how the Endpoint dialogue should look like:

After completing the test, you’d get a report in Ranorex Webtestit and in your Browserstack dashboard (including the video of the test).

As you can see, this method is quite simple. However, it only works if you have Browserstack account.

The second method: Testing via remote endpoint using Ranorex Webtestit and Sauce Labs

This method is even simpler than the previous one. After creating a test in Ranorex Webtestit, we’ll choose ‘Remote endpoint’ tab instead of ‘Custom,’ and Sauce Labs as our endpoint.

Just like in the previous method, you’ll need credentials, i.e. username and access key. You can find them in the Sauce Labs Dashboard after logging into your Sauce Labs account.

  1. Click your name in the Account Profile menu in the upper-right corner
  2. Click on User Settings
  3. Click on Access Key (it will be copied to the clipboard automatically)

In Ranorex Webtestit, enter both the username and the access key into the ‘Credentials’ fields, and then select operating system, browser, and browser version you want to use for your test from the drop-down menus in the ‘Desired capabilities’ section.

After that, simply run your test and see the results in both Webtestit and Sauce Labs Dashboard.

Both methods described are very easy, but both require that users have a registered account. However, testing previous browser versions is possible even if you don’t have one.

The third method: Testing via local endpoint in Ranorex Webtestit

You can also test older browser versions locally. To do this, the older version of the browser you want to test (e.g. Chrome v62) must be downloaded and installed along with the browser’s latest version (Chrome v75). To avoid conflicts and errors, rename the older version to something like OldChrome or OldFirefox, etc.

Next, open Ranorex Webtestit and create your test. When adding an endpoint, select ‘Local endpoint’ tab and enter the endpoint name (whatever you prefer).
Leave the Desktop in the ‘Platform’ field and the latest version of your browser in the ‘Browser’ field because the settings we’ll add in the ‘Capabilities’ field would overwrite it.
Add the following code in the ‘Capabilities’ field:

{
  "chromeOptions": {
     "binary": "//Applications/Google OldChrome.app/Contents/MacOS/Google Chrome"
  }
}

Note: In order to test the older version of Chrome browser, we added the location where we installed the older Chrome version on MacOS in the "binary" part. If you use a Windows or Linux platform, you’ll need to add the correct installation location after the "binary": part.

After you’ve added capabilities, save the endpoint and run your tests.

It should be noted that you may have difficulty testing Chrome browser using this method because Ranorex Webtestit uses the latest ChromeDriver which may prevent you to test the older Chrome versions unless you also download and install an older version of ChromeDriver.

Testing older versions of Mozilla Firefox or Opera won’t cause you any problems because these browsers include older versions of WebDriver.
When testing these two browsers, omit the "chromeOptions" part and add only this piece of code in the ‘Capabilities’ field:

{
 "binary": " //Applications/Firefox.app/Contents/MacOS/firefox-bin"
}

or

{
 "binary": " //Applications/Opera.app/Contents/MacOS/Opera"
}

Again, the given examples are for MacOS. Use the appropriate browser location for Windows and Linux.