Detecting Microsoft's edge or spartan with javascript

Question

Is the user agent for Edge or Spartan browsers known already? Can anyone tell me how to detect this browser and diferentiate it from IE in advance of its release?

Answer 1

A simple google search found me the answer you are looking for: http://forum.piwik.org/read.php?3,125732

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0

Therefore you should match: "Edge\/\d+"

Answer 2

According to this answer:

// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;

Answer 3

Microsoft Edge UA string:

Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.10136

I detail why in this blog post.

Neowin recently reported that Microsoft’s new browser for Windows 10, Spartan, uses the Chrome UA string, “Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0″. That is done on purpose.

You’ll also notice that the entire string ends with “Edge/12.0″, which Chrome does not.

I should point out, that this isn’t a redical departure from what Microsoft did with IE 11, which on Windows 8 reads: Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko, as explained in this post.

What is User Agent sniffing?

Often, web developers will UA sniffing for browser detection. Mozilla explains it well on their blog:

Serving different Web pages or services to different browsers is usually a bad idea. The Web is meant to be accessible to everyone, regardless of which browser or device they’re using. There are ways to develop your web site to progressively enhance itself based on the availability of features rather than by targeting specific browsers.

Here’s a great article explaining the history of the User Agent.

Often, lazy developers will just sniff for the UA string and disable content on their website based on which browser they believe the viewer is using. Internet Explorer 8 is a common point of frustration for developers, so they will frequently check if a user is using ANY version of IE, and disable features.

The Edge team details this even deeper on their blog.

All user agents strings contain more information about other browsers than the actual browser you are using – not just tokens, but also ‘meaningful’ version numbers.

Internet Explorer 11’s UA string:

Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko

Microsoft Edge UA string:

Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.10136

The userAgent property has been aptly described as “an ever-growing pack of lies” by Patrick H. Lauke in W3C discussions. (“or rather, a balancing act of adding enough legacy keywords that won’t immediately have old UA-sniffing code falling over, while still trying to convey a little bit of actually useful and accurate information.”)

We recommend that web developers avoid UA sniffing as much as possible; modern web platform features are nearly all detectable in easy ways. Over the past year, we’ve seen some UA-sniffing sites that have been updated to detect Microsoft Edge… only to provide it with a legacy IE11 code path. This is not the best approach, as Microsoft Edge matches ‘WebKit’ behaviors, not IE11 behaviors (any Edge-WebKit differences are bugs that we’re interested in fixing).

In our experience Microsoft Edge runs best on the ‘WebKit’ code paths in these sites. Also, with the internet becoming available on a wider variety of devices, please assume unknown browsers are good – please don’t limit your site to working only on a small set of current known browsers. If you do this, your site will almost certainly break in the future.

Conclusion

By presenting the Chrome UA string, we can work around the hacks these developers are using, to present the best experience to users.

Answer 4

Another feature-detection based option.

function isBrowserEdge () {
    return typeof CSS !== 'undefined' && CSS.supports("(-ms-ime-align:auto)");
}

Answer 5

Look for "Edge" in the UA string.

While in the minds of the marketing people the world is perfect, in reality browsers have bugs that remain unfixed for years and it will always be the case.

In my case the issue that required me to test for Edge versus Chrome is the Chrome dropdown height bug that Spartan/Edge renders correctly. Microsoft has nothing to fix here and Google has been ignoring that bug for over a year now (it was rendering correctly in old versions of Chrome).