Safe feature-based way for detecting Google Chrome with Javascript?

Question

As the title states, I'd be interested to find a safe feature-based (that is, without using navigator.appName or navigator.appVersion) way to detect Google Chrome.

By feature-based I mean, for example:

if(window.ActiveXObject) {
    // internet explorer!
}

Edit: As it's been pointed out, the question doesn't make much sense (obviously if you want to implement a feature, you test for it, if you want to detect for a specific browser, you check the user agent), sorry, it's 5am ;) Let me me phrase it like this: Are there any javascript objects and/or features that are unique to Chrome...

Answer 1

isChrome = function() {
    return Boolean(window.chrome);
}

Answer 2

_{This answer is very outdated, but it was very relevant back then in the stone age.}

I think feature detect is more usefull than navigator.userAgent parsing, as I googled Opera ambiguosity here. Nobody can know if IE16 will parse the /MSIE 16.0;/ regexp - but we can be quite sure, there will be the document.all support. In real life, the features are usually synonyms for the browsers, like: "No XMLHttpRequest? It is the f....d IE6!" No nonIE browser supports document.all, but some browsers like Maxthon can scramble the userAgent. (Of course script can define document.all in Firefox for some reason, but it is easilly controllable.) Therefore I suggest this solution.

Edit Here I found complete resources.

Edit 2 I have tested that document.all is also supported by Opera!

var is = {
  ff: window.globalStorage,
  ie: document.all && !window.opera,
  ie6: !window.XMLHttpRequest,
  ie7: document.all && window.XMLHttpRequest && !XDomainRequest && !window.opera,
  ie8: document.documentMode==8,
  opera: Boolean(window.opera),
  chrome: Boolean(window.chrome),
  safari: window.getComputedStyle && !window.globalStorage && !window.opera
}

Using is simple:

if(is.ie6) { ... }

Answer 3

For all the standards nazis... sometimes you might want to use bleeding "standard technologies" which aren't just yet standard but they will be... Such as css3 features.

Which is the reason why I found this page.

For some reason, Safari runs a combo of border-radius with box-shadow just fine, but chrome doesn't render the combination correctly. So it would be nice to find a way to detect chrome even though it is webkit to disable the combination.

I've ran into hundreds of reasons to detect a specific browser/version which usually ends up in scrapping an idea for a cool feature because what I want to do is not supported by the big evil...

But sometimes, some features are just too cool to not use them, even if they aren't standardized yet.

Answer 4

Not exactly an answer to the question... but if you are trying to detect a specific browser brand, the point of feature-checking is kind of lost. I highly doubt any other browsers are using the Chrome userAgent string, so if your question is 'is this browser Chrome', you should just look at that. (By the way, window.ActiveXObject does not guarantee IE, there are plug-ins for other browsers that provide this object. Which kind of illustrates the point I was trying to make.)

Answer 5

I often use behavior/capability detection. Directly check whether the browser supports functionality before working around it, instead of working around it based on what might be the browser's name (user-agent).

A problem with browser-specific workarounds, is you don't know if the bug has been fixed or if the feature is supported now. When you do capability detection, you know the browser does or doesn't support it directly, and you're not just being browser-ist.

http://diveintohtml5.ep.io/everything.html

Answer 6

So, if you accept Marijn's point and are interested in testing the user agent string via javascript:

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;

(Credit to: http://davidwalsh.name/detecting-google-chrome-javascript )

---

Here's a really nice analysis/breakdown of the chromes user agent string: http://www.simonwhatley.co.uk/whats-in-google-chromes-user-agent-string

Answer 7

There might be false positives since opera also has window.chrome object. As a nice solution I use;

var isOpera = !!window.opera || !!window.opr;// Opera 8.0+

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

This solution almost always works. However one thing I discovered is that, isChrome returns false in iPad Chrome version 52.0 as window.chrome returns false.

Answer 8

One reason you might need to know the browser is Chrome is because it 'is' so damn standards compliant. I have already run into problems with old JavaScript code which I thought was standards compliant (by FF or Opera standards - which are pretty good), but Chrome was even more picky. It forced me to rewriting some code, but at times it might be easier to use the if(isChrome) { blah...blah ) trick to get it running. Chrome seems to work very well (I'm for standard compliance), but sometimes you just need to know what the user is running in grave detail.

Also, Chrome is very fast. Problem is, some JavaScript code unintentionally depends on the slowness of other browsers to work properly, ie: page loading, iframe loading, placement of stylesheet links and javascript links in page head, etc. These can cause new problems with when functions are really available to interact with page elements. So for now, you really might need to know...

Answer 9

I use this code to make bookmarks for each browser (or display a message for webkit)

if (window.sidebar) { 
// Mozilla Firefox Bookmark
window.sidebar.addPanel(title, url,"");
} else if( window.external ) { // IE Favorite
  if(window.ActiveXObject) {
  //ie
  window.external.AddFavorite( url, title);
  } else {
  //chrome
  alert('Press ctrl+D to bookmark (Command+D for macs) after you click Ok');
  }
} else if(window.opera && window.print) { 
// Opera
  return true; }
 else { //safri
 alert('Press ctrl+D to bookmark (Command+D for macs) after you click Ok'); }

Answer 10

You shouldn't be detecting Chrome specifically. If anything, you should be detecting WebKit, since as far as page rendering is concerned, Chrome should behave exactly like other WebKit browsers (Safari, Epiphany).

If you need not only to detect WebKit, but also find out exactly what version is being used, see this link: http://trac.webkit.org/wiki/DetectingWebKit

But again, as other people said above, you shouldn't detect browsers, you should detect features. See this ADC article for more on this: http://developer.apple.com/internet/webcontent/objectdetection.html

Answer 11

isIE: !!(!window.addEventListener && window.ActiveXObject),

isIE6: typeof document.createElement('DIV').style.maxHeight == "undefined",

isIE7: !!(!window.addEventListener && window.XMLHttpRequest && !document.querySelectorAll),

isIE8: !!(!window.addEventListener && document.querySelectorAll && document.documentMode == 8),

isGecko: navigator.product == 'Gecko',

isOpera: !!window.opera,

isChrome: !!window.chrome,

isWebkit: !!(!window.opera && !navigator.taintEnable && document.evaluate && navigator.product != 'Gecko'),