UsefulJS.Browser

The Browser extension implements user agent detection. The following values are exposed as properties of the module:

Property name	Type	Details
`name`	String	The browser name, for example, "Firefox" or "Internet Explorer"
`version`	String	The unparsed version number of the browser software
`major`	Number	The major version number
`minor`	Number	The minor version number
`engineVersion`	String	The unparsed version number of the browser engine
`engineMajor`	Number	The major engine version number
`engineMinor`	Number	The minor engine version number
`mobile`	Boolean	An educated guess as to whether this is a mobile platform

The engine name (which is more significant than the browser name) will be one of "webkit", "gecko", "trident", "presto" or "khtml". Internet Explorer prior to version 8 did not advertise an engine. If IE7 or earlier is detected, the engine name is set to "msie" and the version is set to the browser version. Since being forced to support old versions of Internet Explorer is a primary use case for user agent detection in the first place, this is a reasonable fallback.

User-agent detection is not highly favoured these days. Possibly this is because it's been done badly in the past: comparing version numbers as strings and finding that "10" is less than "9" or only allowing for one major version digit in a regular expression and then blowing up with a null pointer exception when the regex fails to match. This is compounded by a history of obfuscation and downright dishonesty in the user agent string that makes it ridiculously hard to mine for correct and useful information One might imagine that there's an industry-wide conspiracy to ensure that no property of the navigator object returns a usable value (examine navigator.appName; it is almost always "Netscape").

Since corporate IT departments are very resistant to change, many professional developers are forced to support browsers that are now very legacy indeed. Many home users are perfectly happy with Windows XP which means that we'll have to support Internet Explorer 8 for some time to come. These legacy browsers throw up issues that no amount of feature detection can overcome. For example, imagine that you have some dynamic, pre-formatted content that you need to display so you set it as the innerHTML of a <pre> element. If the text is separated by "\n", it displays fine on IE8 and every other browser, but on IE7 the lines do not break. So you replace all "\n" with "\r\n". Now it displays fine on IE7 and every other browser, but on IE8 the text has extra line breaks. You could maybe set it, examine the offset height (assuming you know what the "correct" offset height might be) and make a correction. Or, simpler and more reliable, you can determine that your code is running on a known problem platform and compensate.

Fixes

The fixes for the Browser extension are defined in the _browser namespace of the fix options.

identify

The identify fix does something useful with the user agent information: it adds three classes to the document element identifying the engine, engine major version and engine minor version. For example, on Firefox 24 (engine version "Gecko 24.0"), these classes are added to the <html> element:

gecko gecko-24 gecko-24-0

You can use these classes to help overcome CSS issues thrown up by different engines (you know: the same line of CSS positions an element slightly differently on every browser and only one is right).

This fix has to be explicitly enabled:

UsefulJS.fix({
    _browser : {
        identify : true
    }
});