Skip to the content...

Welcome to the David Walsh Blog. I'm a MooTools, Dojo, jQuery, CSS, and PHP Web Developer located in Madison, Wisconsin, United States. Please contact me if I can make your experience on my website better.

Detecting Google Chrome Using JavaScript

24 Responses »

As we all know, Google's Chrome browser hit the web yesterday. Whether you wanted to or not, you definitely downloaded Google's effort to see what ingenuity they put into their browser. It's clean, fast, and more stable than Firefox has been for me lately. Of course, there's always a chance that Chrome will have a quirk that none of the other browsers have and you may need to use client side detection to fix the problem. You can detect Chrome by using the following bit of JavaScript:

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

The following string represents Chrome's full user agent:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13

Have any Chrome-specific functionality you want to build? Maybe a MooTools slide-in script that says "Hey, you're using Google's new browser!" It's probably too soon to try to fix Chrome-related bugs, but knowing how to detect it sooner rather than later is a good thing.

Discussion

  1. September 3, 2008 @ 9:27 am

    Thanks for sharing this. I hope there won’t be any Chrome-specific fixing :)

  2. September 3, 2008 @ 9:32 am

    Thank you! Very clever!!!

  3. September 3, 2008 @ 9:46 am

    Chrome crashed a couple of times of by now.

    Keeping FireFox for now, Chrome does have some nice fresh ideas like e.g. the way it separates various threads.

    Thank you for the js-tip!

  4. martin
    September 4, 2008 @ 3:08 am

    It’s a nice idea. The only problem is that Google Chrome have exactly the same userAgent string as Apple’s Safari (at least on the Windows platform). I was trying to find out if there is anyway to tell the difference between them by searching the web and that’s how I ended up on your nice blog.

  5. September 4, 2008 @ 4:00 am

    As it’s still beta there may be one or two bugs, none that I have found so far, but I can’t imagine Google signing off on a product that didn’t fully adhere to standards. So maybe it will be the fixes we’ve had to implement for other browsers that cause issues in Chrome.

    Since Chrome was built to handle the next generation of web applications I can see us developers needing code to detect chrome in order to allow more functionality to be shown that legacy browsers maybe cannot handle and which is turned off or hidden by default.

    Anyway, thanks for the code snippet, though hopefully I’ll never need it.

  6. September 4, 2008 @ 8:36 am

    Thanks a lot for sharing..! But i still have no idea what should we fix in Chrome =D

  7. September 4, 2008 @ 8:41 am

    Chrome appears to pass Acid2, but does not pass Acid3 (linktest failed, and only 79 scored for me on Vista Home Premium). So there may be some issues, particularly when using JS libraries.

  8. September 16, 2008 @ 6:40 am

    i keep learning about more and more advantages and features with Chrome, with privacy, for example; now if only they would take care of it’s cookie management glitches…

  9. September 24, 2008 @ 3:28 am

    http://browserspy.dk/googlechrome.php will also show you the version and some additional information about Google Chrome.

  10. chrismarx
    September 28, 2008 @ 2:41 am

    I’m having trouble with a custom cursor (.cur file). chrome doesn’t appear to be respecting the correct hotspot set on the cursor. ff/ie have no problem.

  11. September 28, 2008 @ 8:47 am

    @chrismarx: Interesting, I hadn’t heard of that issue.

  12. chrismarx
    September 28, 2008 @ 1:05 pm

    looks like they might be on to the problem, check it out:

    r2406 Fix an issue with tooltips showing up in the wrong location.

    http://dev.chromium.org/getting-involved/dev-channel/release-notes

  13. sling
    October 5, 2008 @ 2:59 pm

    CSS margin tag doesn’t work with a percentage value in chrome.
    eg.
    .class{margin:10% 15%} doesn’t work

  14. October 9, 2008 @ 3:17 am

    Chrome doesn’t always handle events that IE and Firefox consistently do. For example:

    HTML

    Javascript

    function menu2Down(e){
    findTarget(e)
    …. }

    function findTarget(e){

    var targ;

    if (!e) {var e = window.event }

    if (e.target){ targ = e.target; }

    else if (e.srcElement){ targ = e.srcElement; }

    Perhaps you could check it out with a simple example

  15. October 11, 2008 @ 12:47 am

    You can also use this JavaScript library to detect any browser including chrome. Not only this, you can trim a string, detect mouse positions etc

    http://rochakchauhan.com/blog/2008/10/11/rochakjs-javascript-class-of-common-functions/

  16. October 11, 2008 @ 3:37 pm

    Thanks for that! It’s been a great help! I’VE FOUND ANOTHER GOOGLE CHROME BUG:
    (sorry, didn’t mean to shout, was just to grab your attention!) lol.
    Overall I love Google Chrome, but one thing has just come up that I thought would be useful to point out: Google Chrome doesn’t respond to XML in the same way (as I’ve just found out!) Both IExplorer and Firefox use different methods to acheive this, and usually Google Chrome is easy to deal with because from a javascript point of vew, has behaved as though it was a clone of Netscape/Mozilla/Firefox! HOWEVER…
    BEWARE THE DANGERS OF CODING THEM THE SAME, as your browser will just assume you’re using Firefox, and anything that Google Chrome does not do, will go by undetected. No Warnings, No Nothing! (Which is fine just so long as the code it’s skipping wasn’t majorly important) but generally speaking, if you’ve gone to all the trouble to code it in XML, then there’s a likelyhood that the code it has skipped is VERY IMPORTANT INDEED, and thus losing it could be disasterous! However, thankfully this handy Google Chrome detection will help me to further seperate the code being used, and I can get to work on figuring out how the google has messed with the XML part! …Wish me luck!!

  17. November 5, 2008 @ 2:12 pm

    Just downloaded chrome its blazing fast almost as fast as FireFox Beta 3 “hacked”.

    Just wanted to give everyone a heads up that When it comes to Frames or basically anthing that you resize with Javascript, that Chromes height variable is typically off by about 25px, however this just might be because of programing a resizing frame for all 3 browers. Because I checked the variables with Chromes nifty Inspector tool and the clientHeight variable is exact. So im guess it’s just another incompatability of IE to any other browser again. Altho IE still does nice color shading and easy margins lmao. =D.

  18. james umokoro
    January 9, 2009 @ 8:32 am

    Chrome is very nice.. but it would be nicer if it could show error messages like that that of the Windows Internet Explorer. Or may be should have a debugger. Guys don’t you think it will make good sense? Love the work these guys have done.

  19. sameer
    June 11, 2009 @ 6:20 am

    Browser detection is fine how to change the input type using js in chrome.

  20. August 18, 2009 @ 6:29 am

    Chrome is nice, but still rather unstable I think

  21. mis_p
    October 17, 2009 @ 10:45 pm

    @Martin: did you find a way to differentiate user agent for safari and chrome..because I am trying to extract the “chrome” from the user agents long string but still it does not work.

  22. December 5, 2009 @ 9:07 pm

    Hi that is a great news for all people like me….I don’t know a lot about wave and thus that is very new for me…but that is a very very good news for me because collaboratively I can use their service along with twitter and many other features at a time that is nice…thanks Google and thanks web master of this site..

  23. rhoel
    December 7, 2009 @ 7:01 am

    @Htoo Tay Zar:

    i have discovered the interpretation of the Khmer (Cambodian) Unicode font is tiny in Chrome when compared to FF and IE. So maybe a need to script around to make the font size readable.

    Not a big issue.

    Do like Chrome though – can’t wait to see the roll out on Chrome OS

    Rhoel
    Phnom Penh, Cambodia.

  24. July 29, 2010 @ 9:58 am

    Thanks again david :) I didn’t know it was so easy to detect a browser via javascript…

Be Heard!

Share your thoughts with fellow developers of all skill levels! I want to hear from you!

Name*:
Email*:
Website:  
Wrap your code with <code> tags, f00!