head.js "Modernizr" like feature doesn't detect ms-edge

256 Views Asked by At

I've noticed that head.js doesn't detect Microsoft "Edge" browser, and to top that, it adds incorrect chrome and chrome55 classes to the <html> element.

Does anyone know of a suitable way to approach this issue? The best approach I could come up with is to perform this check in my app's bootstrap - manually detect "Edge" browser, add appropriate "ms-edge" class, and remove head.js incorrect "chrome" classes:

if (window.navigator.userAgent.indexOf('Edge') > -1) {
    $('html').removeClass(function(index, classes) {
        return classes.match(/\bchrome.*?\b/g).join(' ');
    }).addClass('ms-edge');
}
1

There are 1 best solutions below

5
On

you should be using some thin like this

var str= window.navigator.userAgent.toString().toLowerCase();
// This will return "mozilla/5.0 (windows nt 6.1) applewebkit/537.36 (khtml, like gecko) chrome/55.0.2883.87 safari/537.36"

In the above string you need to check your conditions as below

if (str.includes("edge") == true) {
    $('html').removeClass(function(index, classes) {
        return classes.match(/\bchrome.*?\b/g).join(' ');
    }).addClass('ms-edge');
}

Screen shots of various test in the browser console.

enter image description here

enter image description here

enter image description here