Object Sniffing New Browsers, The khtml Triumvirate: Part 1

The article that introduced me to the original Dr. JavaScript was an excellent piece way back when Netscape 6 first came on the scene (Netscape 6, Part I: Detecting and Scripting: https://www.webreference.com/js/column72/). I was using a lot of CSS code on the Web sites I managed and needed an easy way to distinguish between the clients visiting them so I could deliver code tailored to meet the CSS properties they supported – or more realistically, the lack of such support. If you knew which browser you were dealing with, you could also tailor any DHTML code you had to work properly as well.

The only problem was that the article was written in 2000, and browser technology has moved on since then. While many Web developers are still only interested in detecting between “the big two” (i.e. recent versions of Internet Explorer and to a lesser extent, Netscape Navigator), there are more browsers out there worth keeping track of. This article looks at how you can detect some of the more recent browsers available that are based upon the khtml rendering engine, which includes Konqueror, Apple’s new Safari browser and OmniWeb 4.5+.

The Problem with User-Agent

It would be a much simpler world if you could trust the results you get from the user-agent string. The user-agent string ostensibly identifies the name of the browser to the Web server, allowing the server to do such things as collect statistics on browser usage.

If you are running Internet Explorer 6 under Windows XP, the user-agent string you send will look like this:

Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)

If you are using Netscape 7.01 on the same platform, your user-agent string should look like this:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.0.2) Gecko/20021120 Netscape/7.01

So with all the information you get with the user-agent string, why would you want to use object detection instead?

The problem was that back in 2001, MSN started telling users of non-Internet Explorer browsers that they were not able to view the page properly. MSN dropped this policy soon afterwards after swift protests from people using other browsers, but many people who used the Opera browser still experienced formatting problems. These problems disappeared when the user-agent string was changed to make Opera appear as though it was in Internet Explorer instead. Also, for a time, access to certain sections of premium sites like ESPN and the Wall Street Journal were provided to users whose browser user-agent string identified them as Internet Explorer.

Thus the idea of user-string “spoofing” was born.

Using-string spoofing simply means that you tell a Web server that you are browsing a site using a different browser than the one you are actually using. But user-string spoofing means that Web developers can no longer take the results they get at face value. All the more reason to use object detection over user-agent strings when possible.

But you have to know what to look for…

Detecting khtml and Konqueror

If you are at all familiar with Unix or Linux, chances are you have run across the K Desktop Environment, better known by its acronym KDE. It is a freely available open source computing platform that comes with a suite of applications, one of which is a Web browser known as Konqueror. Konqueror is very standards compatible, and while it hasn’t been around as long as Mozilla has under Linux, it’s a popular alternative to it.

Konqueror uses a rendering engine called khtml, which is XML/HTML4 compliant and supports the vast majority of available ECMAscript 262 (JavaScript) objects and Cascading Style Sheets properties as well as full support for handling Java applets. But when you are doing browser detection, knowing the differences between browsers is what counts.

Like many current browsers, Konqueror is capable of agent-string spoofing. But it has one honest quirk: it always displays the same vendor property: “KDE”. It would seem that all you would have to do is look for the vendor property to identify a given browser as being Konqueror, but it is not as simple as that, since another browser could conceivably spoof this vendor property. So you have to look for JavaScript objects that uniquely identify this browser. However, you can use the following code to detect whether or not a given browser is based upon the khtml rendering engine:

var is_khtml = (navigator.vendor == 'KDE')?true:false;

Konqueror does not recognize the document.all object, so that’s an easy way to distinguish it from versions of Internet Explorer. Having said that; it does utilize the document.childNodes object common to browsers that properly implement DOM 2. Though its importance will be understood later in the article, it also does not implement the deprecated navigator.taintEnabled object. So in order to do distinguish Konqueror from other browsers hitting your Web site, you can use the following browser detect code:

Created: March 27, 2003
Revised: July 12, 2003

URL: https://webreference.com/programming/javascript/sniffing

Object Sniffing New Browsers, The khtml Triumvirate: Part 1