Microsoft Edge – don’t do browser detection

This article is part of a series of posts detailing specific compatibility tollgates for a modern web, and how you can take action to make sure your site works as intended in the world of modern web browsers:

• EdgeHTML interoperability
• Legacy plug-ins & features
• Frameworks & Libraries
• Browser detection (this post)
• CSS prefixes

Don’t do browser detection

Browser Detection is a technique to determine how the webpage should render across many different versions of browsers. In a script this would mean using code like navigator.userAgent to act differently depending on what User Agent string is supplied to the page. Every browser you’re using has a User Agent string that contains information about the browser. Only problem with that “unique” string is that since way back they’ve more or less imitated each other, and today they hold (pretty much) the same information. It is not a reliable way of determining if a feature is supported or not. Simply put – User Agents can’t be trusted.

Why is it important?

Your users will get their best experience in their preferred browser. You can spend less time maintaining separate code bases for various modern browsers including Microsoft Edge.

What will we look for?

We check if the webpage may be using browser detection techniques to determine how the webpage should render across many different versions of browsers, like browser.userAgent.

How can you fix it?

We recommend that instead of browser detection you go with feature detection – a practice that first determines if a browser or device supports a specific feature and then chooses the best experience to render based on this information. Feature detection is a great alternative to browser detection and is commonly used via popular JavaScript libraries like Modernizr or through feature detection code. There’s also sites like CanIUse.com that easily lets you check what features are available in what version of what browser.

Where can you learn more?

• Read more on what’s different about the Microsoft Edge UA string
• View list of unsupported features in Microsoft Edge including conditional comments
• View list of upcoming web platform status by feature in Microsoft Edge
• Learn feature detection
• Implement feature detection with Modernizr
• Understand what features are available in what browser using CanIUse.com
• jQuery on Browser Detection (bad) vs Feature Detection (good)
• History of the Browser User Agent string

Comments

• Anonymous
  August 18, 2015
  The comment has been removed
• Anonymous
  May 11, 2017
  I disagree for some cases. For example, a website might want to ask a user to install a Chrome extension for Chrome, an XPI addon for Mozilla, and a .exe installer for IE. In such a scenario, we need to identify which browser is being used.