How to detect Safari, Chrome, IE, Firefox and Opera browser?

Question

I have 5 addons/extensions for FF, Chrome, IE, Opera, and Safari.

How can I recognize the user browser and redirect (once an install button has been clicked) to download the corresponding addon?

Solution 1

Googling for browser reliable detection often results in checking the User agent string. This method is not reliable, because it's trivial to spoof this value.
I've written a method to detect browsers by duck-typing.

Only use the browser detection method if it's truly necessary, such as showing browser-specific instructions to install an extension. Use feature detection when possible.

Demo: https://jsfiddle.net/6spj1059/

// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';

// Safari 3.0+ "[object HTMLElementConstructor]" 
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && window['safari'].pushNotification));

// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;

// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;

// Chrome 1 - 79
var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);

// Edge (based on chromium) detection
var isEdgeChromium = isChrome && (navigator.userAgent.indexOf("Edg") != -1);

// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;


var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isEdge: ' + isEdge + '<br>';
output += 'isEdgeChromium: ' + isEdgeChromium + '<br>';
output += 'isBlink: ' + isBlink + '<br>';
document.body.innerHTML = output;

Analysis of reliability

The previous method depended on properties of the rendering engine (-moz-box-sizing and -webkit-transform) to detect the browser. These prefixes will eventually be dropped, so to make detection even more robust, I switched to browser-specific characteristics:

• Internet Explorer: JScript's Conditional compilation (up until IE9) and document.documentMode.
• Edge: In Trident and Edge browsers, Microsoft's implementation exposes the StyleMedia constructor. Excluding Trident leaves us with Edge.
• Edge (based on chromium): The user agent include the value "Edg/[version]" at the end (ex: "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.16 Safari/537.36 Edg/80.0.361.9").
• Firefox: Firefox's API to install add-ons: InstallTrigger
• Chrome: The global chrome object, containing several properties including a documented chrome.webstore object.
• Update 3 chrome.webstore is deprecated and undefined in recent versions
• Safari: A unique naming pattern in its naming of constructors. This is the least durable method of all listed properties and guess what? In Safari 9.1.3 it was fixed. So we are checking against SafariRemoteNotification, which was introduced after version 7.1, to cover all Safaris from 3.0 and upwards.
• Opera: window.opera has existed for years, but will be dropped when Opera replaces its engine with Blink + V8 (used by Chromium).
• Update 1: Opera 15 has been released, its UA string looks like Chrome, but with the addition of "OPR". In this version the chrome object is defined (but chrome.webstore isn't). Since Opera tries hard to clone Chrome, I use user agent sniffing for this purpose.
• Update 2: !!window.opr && opr.addons can be used to detect Opera 20+ (evergreen).
• Blink: CSS.supports() was introduced in Blink once Google switched on Chrome 28. It's of course, the same Blink used in Opera.

Successfully tested in:

• Firefox 0.8 - 61
• Chrome 1.0 - 71
• Opera 8.0 - 34
• Safari 3.0 - 10
• IE 6 - 11
• Edge - 20-42
• Edge Dev - 80.0.361.9

Updated in November 2016 to include detection of Safari browsers from 9.1.3 and upwards

Updated in August 2018 to update the latest successful tests on chrome, firefox IE and edge.

Updated in January 2019 to fix chrome detection (because of the window.chrome.webstore deprecation) and include the latest successful tests on chrome.

Updated in December 2019 to add Edge based on Chromium detection (based on the @Nimesh comment).

Solution 2

You can try following way to check Browser version.

    <!DOCTYPE html>
    <html>
    <body>
    <p>What is the name(s) of your browser?</p>
    <button onclick="myFunction()">Try it</button>
    <p id="demo"></p>
    <script>
    
    function myFunction() { 
     if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 ) 
    {
        alert('Opera');
    }
    else if(navigator.userAgent.indexOf("Edg") != -1 )
    {
        alert('Edge');
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1 )
    {
        alert('Chrome');
    }
    else if(navigator.userAgent.indexOf("Safari") != -1)
    {
        alert('Safari');
    }
    else if(navigator.userAgent.indexOf("Firefox") != -1 ) 
    {
         alert('Firefox');
    }
    else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
    {
      alert('IE'); 
    }  
    else 
    {
       alert('unknown');
    }
    }
    </script>
    
    </body>
    </html>

And if you need to know only IE Browser version then you can follow below code. This code works well for version IE6 to IE11

<!DOCTYPE html>
<html>
<body>

<p>Click on Try button to check IE Browser version.</p>

<button onclick="getInternetExplorerVersion()">Try it</button>

<p id="demo"></p>

<script>
function getInternetExplorerVersion() {
   var ua = window.navigator.userAgent;
        var msie = ua.indexOf("MSIE ");
        var rv = -1;

        if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer, return version number
        {               

            if (isNaN(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))))) {
                //For IE 11 >
                if (navigator.appName == 'Netscape') {
                    var ua = navigator.userAgent;
                    var re = new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})");
                    if (re.exec(ua) != null) {
                        rv = parseFloat(RegExp.$1);
                        alert(rv);
                    }
                }
                else {
                    alert('otherbrowser');
                }
            }
            else {
                //For < IE11
                alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
            }
            return false;
        }}
</script>

</body>
</html>

Solution 3

Here are several prominent libraries that handle browser detection as of Dec 2019.

Bowser by lancedikson - 4,065★s - Last updated Oct 2, 2019 - 4.8KB

var result = bowser.getParser(window.navigator.userAgent);
console.log(result);
document.write("You are using " + result.parsedResult.browser.name +
               " v" + result.parsedResult.browser.version + 
               " on " + result.parsedResult.os.name);

<script src="https://unpkg.com/[email protected]/es5.js"></script>

*supports Edge based on Chromium

---

Platform.js by bestiejs - 2,550★s - Last updated Apr 14, 2019 - 5.9KB

console.log(platform);
document.write("You are using " + platform.name +
               " v" + platform.version + 
               " on " + platform.os);

<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.5/platform.min.js"></script>

jQuery Browser by gabceb - 504★s - Last updated Nov 23, 2015 - 1.3KB

console.log($.browser)
document.write("You are using " + $.browser.name +
               " v" + $.browser.versionNumber + 
               " on " + $.browser.platform);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.1.0/jquery.browser.min.js"></script>

Detect.js (Archived) by darcyclarke - 522★s - Last updated Oct 26, 2015 - 2.9KB

var result = detect.parse(navigator.userAgent);
console.log(result);
document.write("You are using " + result.browser.family +
               " v" + result.browser.version + 
               " on " + result.os.family);

<script src="https://cdnjs.cloudflare.com/ajax/libs/Detect.js/2.2.2/detect.min.js"></script>

Browser Detect (Archived) by QuirksMode - Last updated Nov 14, 2013 - 884B

console.log(BrowserDetect)
document.write("You are using " + BrowserDetect.browser +
               " v" + BrowserDetect.version + 
               " on " + BrowserDetect.OS);

<script src="https://kylemit.github.io/libraries/libraries/BrowserDetect.js"></script>

---

Notable Mentions:

• WhichBrowser - 1,355★s - Last updated Oct 2, 2018
• Modernizr - 23,397★s - Last updated Jan 12, 2019 - To feed a fed horse, feature detection should drive any canIuse style questions. Browser detection is really just for providing customized images, download files, or instructions for individual browsers.

Further Reading

• Stack Overflow - Browser detection in JavaScript?
• Stack Overflow - How can you detect the version of a browser?

Solution 4

I know it may be overkill to use a lib for that, but just to enrich the thread, you could check is.js way of doing this:

is.firefox();
is.ie(6);
is.not.safari();

Solution 5

In case anyone finds this useful, I've made Rob W's answer into a function that returns the browser string rather than having multiple variables floating about. Since the browser also can't really change without loading all over again, I've made it cache the result to prevent it from needing to work it out the next time the function is called.

/**
 * Gets the browser name or returns an empty string if unknown. 
 * This function also caches the result to provide for any 
 * future calls this function has.
 *
 * @returns {string}
 */
var browser = function() {
    // Return cached result if avalible, else get result then cache it.
    if (browser.prototype._cachedResult)
        return browser.prototype._cachedResult;

    // Opera 8.0+
    var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

    // Firefox 1.0+
    var isFirefox = typeof InstallTrigger !== 'undefined';

    // Safari 3.0+ "[object HTMLElementConstructor]" 
    var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);

    // Internet Explorer 6-11
    var isIE = /*@cc_on!@*/false || !!document.documentMode;

    // Edge 20+
    var isEdge = !isIE && !!window.StyleMedia;

    // Chrome 1+
    var isChrome = !!window.chrome && !!window.chrome.webstore;

    // Blink engine detection
    var isBlink = (isChrome || isOpera) && !!window.CSS;

    return browser.prototype._cachedResult =
        isOpera ? 'Opera' :
        isFirefox ? 'Firefox' :
        isSafari ? 'Safari' :
        isChrome ? 'Chrome' :
        isIE ? 'IE' :
        isEdge ? 'Edge' :
        isBlink ? 'Blink' :
        "Don't know";
};

console.log(browser());

View more solutions

Comments

[dude]

try detectjs, it can be used for all browsers

[Matthijs Wessels]

Possible duplicate of Browser detection in JavaScript?

[YakovL]

detect.js is no longer maintained (according to github.com/darcyclarke/Detect.js), they recommend github.com/lancedikson/bowser

[Luzan Baral]

I used UAParser Plugin, it is written in Vanilla JavaScript. Source: How to detect browser, engine, OS, CPU, and device using JavaScript?

[KyleMit]

Possible duplicate of How can you detect the version of a browser?

[Elijah Mock]

The MDN docs are useful: developer.mozilla.org/en-US/docs/Web/HTTP/…

[5Diraptor]

I'd like to re-surface this question - is there a reliable & simple answer to this yet? There are many (old) questions like this on SO and yet most of them work off the userAgent function which even w3schools acknowledges is inaccurate. I've tested some of the answers to this question and similar ones, and none of them seem reliable. If I'm better off asking a new question please let me know.

[Shivam Jha]

See stackoverflow.com/questions/2400935/…

[eremzeit]

The userAgent alone doesn't tell us enough. For example, my user agent is "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.85 Safari/537.36", which mentions Mozilla, Chrome and Safari. Which browser type am I?

[Nirav Mehta]

Sorry but I didn't get you for "Which browser type am I?" what you want to get?

[igauravsehrawat]

Why would one write so many lines of code? userAgent is ambiguous.

[TygerKrash]

Just worth noting that under the hood it's primarily doing User-Agent detection. Supplemented with vendor detection / some feature detection in places.

[NoR]

The !!window.MSAssertion; test doesn't work for me in the Edge beta via Remote Desktop. It returns false.

[pilau]

@NoR What version of Edge are you using? It matters

[NoR]

The VM Version: 20150801 --- Edge Version: 20.10240.16384.0

[pilau]

@NoR Oh you're using the VM... The MSAssertion trick is adjusted to version 25. But since many devs rely on the VMs, I'll try to adjust it this older version. Good call. Thanks.

[pilau]

@NoR Updated - should be futureproof. The StyleMedia (capitalized) object is specific to IE and Edge and doesn't seem to be going anywhere.

[Baldráni]

@NiravMehta What he meant is that navigator.userAgent tells you every browser possible you have.. So this is really not reliable, the only case it would work is if the user only has one browser.

[Rafael Eyng]

@TygerKrash sure, you are absolutely right. That is actually what I meant with my answer: open the source code of is.js and check how they do it.

[user6031759]

What about Microsoft Edge?

[Ricardo stands with Ukraine]

doesn't work. Using Chrome 51 and user agent includes Safari string: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36

[Ricardo stands with Ukraine]

jQuery used to include similar properties: $.browser.msie... Were removed from version 1.9 api.jquery.com/jquery.browser

[Golak Sarangi]

the answer above checks for chrome before checking for safari. because safari will not have chrome keyword in the useragent. example of safari useragent - mozilla/5.0 (macintosh; intel mac os x 10_11_5) applewebkit/601.6.17 (khtml, like gecko) version/9.1.1 safari/601.6.17

[nevf]

FYI This doesn't work with Chrome Extensions as window.chrome.webstore is undefined there. Haven't checked it with Firefox Extensions. is.js mentioned elsewhere does work in both Chrome and Firefox Extensions.

[vityavv]

Stackoverflow uses this method

[gman]

isSafari doesn't work with Safari 10. I'm going to argue this is a bad solution (not that I have a good one). There's no guarantee many of the things your checking for won't be removed OR won't be added by other browsers. Every site that was using this code for check for Safari just broke with macOS Sierra or Safari 10 upgrades :(

[Sebastien Lorber]

@gman I agree with you. This solution works fine when you deploy it, but is not really future-proof as browsers evolves.

[pilau]

@gman I also agree with you. Regardless, I just evolved my solution to include Safaris from 9.1.3 and up :)

[Marek Möhling]

This breaks JS execution in Safari 10.0.1 as it doesn't know the objects "opr" and window.chrome, therefore I added two checks:

[Marek Möhling]

var oprAddons = (typeof opr === 'object')? opr.addons : false;

[Marek Möhling]

var isOpera = (!!w.opr && !!oprAddons) || !!window.opera || n.userAgent.indexOf(' OPR/') >= 0;

[Marek Möhling]

var chromeWebstore = (typeof window.chrome === 'object')? window.chrome.webstore : false;

[Marek Möhling]

var isChrome = !!window.chrome && !!chromeWebstore;

[Marek Möhling]

I don't know how to insert line breaks in comments so I used several comments. btw., I've no Mac at home so I used macincloud.com for Safari testing. Very slow RDP connection to a virtual Mac but nifty anyway, 24h trial for 99c.

[alejnavab]

In Chrome it says "true" also for Blink.

[DrZ214]

But has this been tested on the mobile versions of those browsers as well as the desktop versions too? And truthfully, there are different mobile versions and different desktop versions per platform. So really, firefox has 3 binaries for Windows, Linux, Mac OS, and 2 binaries for Android and iOS.

[Riz]

in Edge browser, it returns Chrome

[adripanico]

I am particularly trying to detect if the browser is Chrome or Firefox, and it seems to work great in Windows, Debian and MacOS for both browsers. In Android, it fails detecting Chrome, and in iPhone it fails for both of them.

[dnns]

Thank you. Though, just tested on Chrome 55.0.2883.87 m, and it didn't work.

[dnns]

Work smoothly on Chrome 55, Firefox 50 and IE 11, but not on Edge 38.14393.0.0 (shows "Chrome"). Thank you.

[Manuel]

I'd like to check for chrome and this is definitely not working on latest chrome mobile .55 version :/

[pilau]

@eFriend I updated the answer to the latest browser tests.

[N00b Pr0grammer]

A general question though, why !!document.documentMode? Instead this is good without this !!.

[johnp]

Mozilla added the runtime.getBrowserInfo() WebExtension-API to get information about the browser in which an add-on is running.

[Juvenik]

this is not a reliable way to detect browser. Some useragents includes both chrome and safari, so there is not way to detect which one should we consider and last but, not the least, useragent can be modified by the web page.

[LeOpArD]

It does not work with desktop version of Safari/603.2.4, anyone knows a solution?

[pilau]

@IssacGable let's fix it - which version?

[Issac Gable]

@pilau Safai Version 10.1.2 (12603.3.8)

[Issac Gable]

I have also found UAParser a js plugin that still maintained and has be highly accurate and easy to use.

[Andrew]

Edge has safari in it, need to check edge prior to safari

[buggedcom]

@LeOpArD add /constructor/i.test(function HTMLElementConstructor() {}) || to the beginning of the safari test

[Mikko Ohtamaa]

The current isSafari does not work under <iframe> under Safari 10.1.2

[Admin]

and what we should write for chrome in ipad?

[HoldOffHunger]

I like this, but I would have preferred a fallback to userAgent(), instead of "Don't know".

[HoldOffHunger]

Most of the answers here are not concerned with being "hacky" if they are the only reliable method. userAgent, as noted multiple times, is easily spoofed, and is therefore, unreliable.

[HoldOffHunger]

Is there a point to telling the user what browser they're using? I imagine they'd already know this.

[HoldOffHunger]

@RafaelEyng: I think the issue with it doing User-Agent detection is that this method is unreliable.

[HoldOffHunger]

ReactJS Addendum: Since React is strongly-typed, this will cause compile-time errors for lack of definition in var's opr and safari.

[Alexander O'Mara]

Note: When Chrome is run headless, there is no window.chrome object.

[Joe Borg]

@HoldOffHunger it's main intention was more to adapt the most compatible code to the active browser, rather than to inform the user which browser they're using. Unless the browser they're using is super outdated and has been excluded from backwars compatibility, in which it wouldn't hurt to let the user know they can benefit from a better experience should they switch to something more up to date

[Badrush]

I get this error in safari 'safari' is not defined

[Kyle Vassella]

When testing this in Opera (latest version), this returns 'Chrome' for me. To fix this, I changed the Opera if statement to: if(navigator.userAgent.indexOf("Opera") != -1 || navigator.userAgent.indexOf('OPR') != -1 )

[Vadim]

That's a great idea: you don't need neither "window", nor "navigator" objects!

[Vadim]

My suggestion is to get rid document and window completely. See IE chunk: return "firefox"; } else if(err.search("[object Error]") !== -1 && e.message != null && e.description != null){ return "IE"; } else if(err.search("cannot convert e into object") !== -1){ return "opera";

[Mason Jones]

How does that differentiate between IE and edge?

[Vadim]

Strange, I can't reproduce err.search("[object Error]") anymore. Anyway, for me firefox vs chrome vs some thing else is enough. I use it in a PAC file where window and document objects are not available.

[Vadim]

Just figured out the cause. It looks like that for funning a PAC file Windows 7 does not use IE11, which is installed at my machine, but rather IE7-like engine (probably from the Windows host). So err.toString() there gives "[object Error]" while inside the IE11 it gives "Unable to get property..." string as in your code. So, the code above should fail with the IE7.

[Admin]

Thanks for the ans. Worked for Desktop but not working in Android phone especially for Chrome. tell me if any solution there,, thanks again...

[Joshua]

At least use a switch block.

[Katana314]

"It's trivial to spoof this value" -- Why is this being acknowledged at all? ANY form of browser detection can be spoofed. That doesn't matter at all; browser detection is largely a form of convenience to let people know of browser UI hints, known issues, etc., and user agents are a perfectly valid way to do that. This answer feels like a terrible mixed misunderstanding of feature detection vs user agent sniffing, and I'm really not sure why it's so popular. Nothing you've said is technically incorrect, but this is an incredibly unhelpful answer.

[Alex Nikulin]

If you dislikes me, please explain why.

[S. Mayol]

Detecting mobile browser: stackoverflow.com/questions/11381673/…

[Ally]

FYI !!window.chrome && !!window.chrome.webstore; returns false when Chrome is in headless mode.

[deathangel908]

a thousand lines of code you call lightweight?

[Katie]

Firefox typeof InstallTrigger is returning undefined for me in Firefox v25. I am using it in the debug console

[Katie]

For some reason my navigator.userAgent in chrome includes Safari: "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36" but my firefox does not: "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:25.0) Gecko/20100101 Firefox/25.0"

[brasofilo]

Running Chrome 67 and Opera 54 (OS X), they both return the same error string :(

[HoldOffHunger]

Chrome v.64 will report back "Safari".

[st_bk]

window.chrome.webstore is deprecated starting from Chrome ver. 71: blog.chromium.org/2018/06/…

[ali-myousefi]

!!window.chrome.webstore return false from chrome on android.

[LB2]

Chrome test (due to v71 obsolescence) can be fixed by !!window.chrome && !isOpera.

[David]

As chrome and others are non-standard window properties it would be safer to use window.hasOwnProperty('chrome'). In other hand I am personally not a big fan of double negation. It is confusing when reading code.

[NishM]

I think you get less credit so thank you for coming up with a great solution. The usage of navigator.userAgent is rampant and i feel that your direction should be implemented natively.

[LB2]

Turns out !!window.chrome && !isOpera doesn't work as it matches for Edge.

[xdumaine]

!!window.navigator.plugins.namedItem('Chrome PDF Plugin')

[raj]

Its browser version dependent and doen't work in Chrome 71(tested). My code broke and it took lot of time to figure out.

[Bedla]

Property window.chrome.webstore was removed in Chrome 71, so this approach is no longer working.

[Bedla]

Property window.chrome.webstore was removed in Chrome 71, so this approach is no longer working.

[user3112634]

isChrome: false with Chrome 71 win7

[aldoblack]

Can confirm on chrome. Does no work on Chrome 71 & 72.

[Matt L]

var isChrome = !!window.chrome && !!window.Browser && window.Browser.name === 'chrome'; This appropriately identifies Chrome, but excludes Edge. Haven't tested with Opera.

[RyanNerd]

FYI Edge will be switching to the Chromium engine: theverge.com/2018/12/4/18125238/…

[kashiraja]

This is definitely the most robust approach when you assume that the UA string hasn't been modified. It also properly detects OS (android, win, mac, linux); device type (desktop, tablet, mobile). It can also test for version of browser.

[Reza]

it's false for all on chrome on ios

[Reza]

this will show 'safari' while browsing with 'chrome' on ios

[eyecatchUp]

Took some time to figure out, so it might help some: !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime) will fail when you open local domains or IPs! Chrome seems to invalidate the runtime when you browse to a local page.

[murrayju]

Adding to @eyecatchUp, it seems that the chrome test works on https pages, but not http pages (without ssl).

[Ryan Shillington]

This seems to work better: var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.csi) It at least works when the URL is not SSL and reports correctly on Edge. I'm not sure about Safari.

[Stender]

As of right now, my chrome Version 74.0.3729.169 says isChrome: true and isBlink: true So seems like there is an issue here.

[vrintle]

Why used: false || !!document.documentMode if it is equivalent to !!document.documentMode? Am I missing something?

[Carlos López Marí]

isChrome being true through Opera. Not a problem as Opera behaviour is too similar to Chrome but is still a missmatch.

[Timar Ivo Batis]

you can overwrite the function with a function that simply returns the cachedResult and omit the if statement. The first time around you have to still return the result. browser = function(){ return cachedResult}; return cachedResult;

[akcasoy]

is.js Bug: is.Chrome() returns false on the Google Chrome of all iOS Devices. MacOS on Chrome works.

[Sam Hobbs]

Says Don't know for Microsoft's new Chrome version of Edge.

[UKMonkey]

"because it's trivial to spoof this value." so what? If a browser is pretending to be something else, then why should the site care?

[Kiura]

@UKMonkey, have you found any lightweight solution to find a browser using userAgent?

[UKMonkey]

@Kiura not sure what exactly you mean, but the answer from Nimesh seems to be what you're looking for?

[Kiura]

@UKMonkey, yes, It is what I am looking for. Although I needed more browsers (like Yandex browser, Vivaldi, etc..). So finally I found a library that does what I need, in case other people are interested the library is called bowser

[Chethan]

use document['documentMode'] instead of document.documentMode, if you want to get rid of the error/warning message

[Yonatan Nir]

Why do you have some ifs with "false" as a condition?

[Vic]

did you test chrome on ios?

[dmikester1]

Seems pretty ridiculous to me that we have to go through all this to find out which browser is being used. I would think it would make sense for the browser vendors to agree on a standard javascript variable they can all send down, some crazy name like 'browserName'!

[scunliffe]

Isn’t the Edge Chromium detection of just the substring “Edg” going to match on the old “Edge” (Trident based)?

[Elijah Mock]

I've heard navigator.userAgent is unreliable because of spoofing...

[Tiago Sousa]

Anyone has code to also detect Safari 11, 12 and 13?

[Lucas Azevedo]

@YonatanNir I think it's meant to detect conditional compilation: developer.mozilla.org/en-US/docs/Web/JavaScript/…

[111]

Well worth a few Kb of overhead to not reinvent the wheel.

[ygoe]

Chrome 80 and 81 are not detected with this. And not Safari on iOS (no idea where it has its version tag).

[Przemo]

Unfortunately, it's not a good answer. Edge has Chrome in his userAgent message. It's better to use !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);

[nightrain]

I tried this in Safari, Firfox, and Chrome, always returns Don't know.

[BReddy]

This has failed to detect Firefox 78.

[BReddy]

This method worked with Chrome and Firefox on desktop and Safari on iOS. It fails with Chrome and Firefox on iOS.

[Alex Nikulin]

@BReddy retest this please, I haven't any apple device:)

[BReddy]

I tested this with Firefox (78.0.1 on Win10), Chrome (83.0 on Win10), Edge (83.0 on Win10 - Chromium base), Firefox(27 on iOS), and Chrome (83.0 on iOS) successfully. This logic still reported Safari (on iOS 13.5.1) still reported as 'chrome'. Could this be because Chromium is derived from WebKit base?

[Alex Nikulin]

@BReddy yes all webkits are similar, but have some different features.But browsers can have different useragents on ios. For example firefox and chrome on ios have fxios and crios strings. Retest it please)

[jamess]

isEdgeChromium is false for Edge Version 83.0.478.61 (Official build) (64-bit). Otherwise this works for the latest Safari, Firefox, and Chrome on Windows 10 and OSX Catalina.

[Alex Nikulin]

I came from android with microsoft edge browser. Your code says that I am "ubuntu with chrome"

[Ray Shan]

Safari detection is no longer working as of Safari 14 Beta 2 on macOS 10.15.6 Catalina.

[pompalini]

It does work on both Chrome and Safari on macOs. @BReddy: Order does matter here, hence the Safari check needs to be after Chrome.

[Shaun Roselt]

I'm running Edge Chromium, but it says false for it. Everything is false.

[Landaida]

your answer also fail for Opera browser

[PHP Guru]

After reading all the comments I will never use duck typing to detect which browser is being used ever again. Using the userAgent string is not without it's problems but still seems like the best option and is still the preferred method by Google.

[igolkotek]

Unfortunately not working under iOS 12.4.9 ipad Air in all three browsers: Safari, Chrome, Firefox

[PjotrC]

Is it intended, that on EdgeChromium and on Opera also isChrome == true? Besides that, it is kind a cool hack! :)

[Bayleef]

Please do not do that. It creates issues down the line for browser implementers and web developpers. When using non standard API for detecting a browser, basically we solidify the existence of this API and makes it part of the Web platform. The more people rely on it, the more the browser implementer will be unable to remove it one day because removing it will break websites.

[RobG]

@dmikester1—one reason vendors do not want to standardise navigator.useragent is because they do not want their users to see "Your browser is not supported, please download a supported browser from …" like in the Netscape vs IE days.

[Tamsamani]

please update it, because it's doesn't work in Edge Chromium, (!!window.chrome.webstore || !!window.chrome.runtime) always return false

[greensin]

Chrome 71+ returns false. This answer needs to be updated...

[dilipkumar katre]

isChrome: true on edge browser

[Jorge Monroy]

Typescript say the same with this: Argument of type '{ new (): HTMLElement; prototype: HTMLElement; }' is not assignable to parameter of type 'string'

[Krish1992]

Doesn't work in modules it seems, well it's pretty damn stupid that this sort of approach is what one would have to resort to. It's brittle & can change at any time. Well, seeing as its javascript pretty much explains most of it.

[joantoh]

it's not working anymore

[Dev]

It's picking up Safari when I'm in Chrome...

[Mike 'Pomax' Kamermans]

Which is expected and desired: if someone sets their UA to a different browser, they're doing that to get the content that would get served for that browser. User agent spoofing is literally why you want a browser detection solution based on userAgent instead of using duck typing, as you're generating different content for different browsers (as opposed to trying to implement progressive enhancement based on JS support, which should use duck typing because you'd need feature detection).

[Hyuga Hinata]

This is my userAgent string in Chrome!! 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.102 Safari/537.36' This method doesn't work since it contains Safari and Mozilla too.

[Eray]

Only this one worked for me. Thank you.

[Tanriol]

As of 2022, Firefox detection with InstallTrigger is going to break because it's going away around Firefox 103 or so.