HOWTO: Check browser type and its version in your VSTS/TFS extensions

Jul 21, 2017 |

Twitter Facebook Linkedin Email WhatsApp

Ever wanted to check which browser (and browser version) your VSTS/TFS extension is running on? Microsoft Visual Studio Team Services Web Extension SDK has a great set of utility methods. In this blog post we will see couple of such methods which will help us to detect browser type and its version.

Steps

Like in previous post we need to import the module in to our typescript file. The methods we are interested are all in UI module.

import BrowserCheck = require("VSS/Utils/UI");

The imported UI module provides various methods to check the browser and its properties.

Check for Google Chrome

let chrome = BrowserCheck.BrowserCheckUtils.isChrome();

Check for Edge browser

let edge = BrowserCheck.BrowserCheckUtils.isEdge();

Check for Firefox, Safari and IE

Similar to the methods above, you can check other browser types too.

let firefox = BrowserCheck.BrowserCheckUtils.isFirefox();
let safari = BrowserCheck.BrowserCheckUtils.isSafari();
let ie = BrowserCheck.BrowserCheckUtils.isIE();

Check for browser version

You can get the browser version like below.

let version = BrowserCheck.BrowserCheckUtils.getVersion();

Check for specific IE version

If you are looking to check specific version of IE, there is method for it too.

let isIE11 = BrowserCheck.BrowserCheckUtils.isIEVersion(11);

Check if browser version is less than v8 or v9

Now if you would like to check if extension is running on lower version than IE8 or IE9, the SDK has methods to check exactly that.

let lessThanIE8 = BrowserCheck.BrowserCheckUtils.isLessThanOrEqualToIE8();
let lessThanIE9 = BrowserCheck.BrowserCheckUtils.isLessThanOrEqualToIE9();

Can I detect if my extension is running on Windows/Macintosh/iOS?

Yes, you can!

let isWindows = BrowserCheck.BrowserCheckUtils.isWindows();
let isMac = BrowserCheck.BrowserCheckUtils.isMacintosh();
let isiOS = BrowserCheck.BrowserCheckUtils.isIOS();