Interface - Array broken on IE6/Safari/Konqueror (indexof)

Reported by:	wccrawford	Owned by:	stefan
Priority:	major	Milestone:	1.1.3
Component:	interface	Version:	1.1.2
Keywords:	array indexof	Cc:
Blocked by:		Blocking:

Description

The 'older browser helper' function in iutil.js causes arrays to exhibit odd behavior in IE6, Konqueror, and Safari. (I don't have Safari, but a co-worker showed me it's failure in it.) Firefox works fine.

The following code will exhibit the bug.

<script type="text/javascript">
// Helper function to support older browsers!
var arr = new Array();
if (!new Array().indexOf)
{
	Array.prototype.indexOf = function(v, n){
		n = (n == null) ? 0 : n;
		var m = this.length;
		for (var i=n; i<m; i++)
		{
			if ((i >= 0) && (this[i] == v))
			{
				return i;
			}
		}
		return -1;
	}
}

var arr = new Array();
arr['a'] = 'A';
arr['b'] = 'B';
arr['c'] = 'C';
arr['d'] = 'D';
for(i in arr)
{
	document.write(i);
	document.write(arr[i]);
}
</script>

Firefox outputs 'aAbBcCdD' as expected, but the other browsers output 'indexOffunction (v, n) { n = n == null ? 0 : n; var m = this.length; for (i = n; i < m; i++) { if (i >= 0 && this[i] == v) { return i; } } return -1; }aAbBcCdD'.

Attachments (0)

Change History (5)

Changed April 30, 2007 10:27AM UTC by wccrawford comment:1

I just realized I had changed the javascript attempting to find the problem. The original javascript is:

// Helper function to support older browsers!
[].indexOf || (Array.prototype.indexOf = function(v, n){
	n = (n == null) ? 0 : n;
	var m = this.length;
	for (var i=n; i<m; i++)
		if (this[i] == v)
			return i;
	return -1;
});

It does, of course, exhibit the same problem.

Changed May 30, 2007 02:35AM UTC by khmer42 comment:2

This doesn't break all arrays, only associative arrays. Remember arrays in JavaScript aren't really arrays, they are just objects presented in an array like way. Doing a for/in loop will return all properties of the array including prototype methods, which is what's happening here. There are only three ways this can be solved, none of which are particularly practical or helpful:

Stop using IE until they one day implement indexOf for arrays.
Tell all users that if they use associative arrays in their code interface will break their apps.
Re-write any interface modules that use indexOf on an array, to use a separate method which can be passed an array and perform the same task, rather than adding a new method to all arrays which fixes one problem but creates a multitude of others.

I personally think the last option would be the best and most practical, interface won't go far if it breaks existing JavaScript functionality. We all know that using associative arrays in JavaScript isn't 'best practice', but it is still common place, so must be addressed.

Changed May 31, 2007 02:46PM UTC by wccrawford comment:3

Well, the conclusion that I came to was that this should -not- be included for IE6/Safari/Konqueror as they do -not- need it. It's only older browsers that need it. Without this code, they all work fine.

To be sure, I just tested it in IE6 and IE7. They both exhibit the same behavior. Without the overridden indexOf, they both work fine. With it, they both produce the problem.

So add IE7 to the list of affected browsers as well.

Again, the real fix here should be to make sure that the code is only included on browsers that actually need it.

Changed January 07, 2008 04:52PM UTC by shula comment:4

A quick workaround: either add browser specific validation (for IE and other broken browsers), or comment out the whole block below: "// Helper function to support older browsers".

Changed March 31, 2008 01:36AM UTC by scott.gonzal comment:5

description:	The 'older browser helper' function in iutil.js causes arrays to exhibit odd behavior in IE6, Konqueror, and Safari. (I don't have Safari, but a co-worker showed me it's failure in it.) Firefox works fine.\ \ The following code will exhibit the bug.\ {{{\ <script type="text/javascript">\ // Helper function to support older browsers!\ var arr = new Array();\ if (!new Array().indexOf)\ {\ Array.prototype.indexOf = function(v, n){\ n = (n == null) ? 0 : n;\ var m = this.length;\ for (var i=n; i<m; i++)\ {\ if ((i >= 0) && (this[i] == v))\ {\ return i;\ }\ }\ return -1;\ }\ }\ \ var arr = new Array();\ arr['a'] = 'A';\ arr['b'] = 'B';\ arr['c'] = 'C';\ arr['d'] = 'D';\ for(i in arr)\ {\ document.write(i);\ document.write(arr[i]);\ }\ </script>\ }}}\ Firefox outputs 'aAbBcCdD' as expected, but the other browsers output 'indexOffunction (v, n) { n = n == null ? 0 : n; var m = this.length; for (i = n; i < m; i++) { if (i >= 0 && this[i] == v) { return i; } } return -1; }aAbBcCdD'. → The 'older browser helper' function in iutil.js causes arrays to exhibit odd behavior in IE6, Konqueror, and Safari. (I don't have Safari, but a co-worker showed me it's failure in it.) Firefox works fine. \ \ The following code will exhibit the bug. \ {{{ \ <script type="text/javascript"> \ // Helper function to support older browsers! \ var arr = new Array(); \ if (!new Array().indexOf) \ { \ Array.prototype.indexOf = function(v, n){ \ n = (n == null) ? 0 : n; \ var m = this.length; \ for (var i=n; i<m; i++) \ { \ if ((i >= 0) && (this[i] == v)) \ { \ return i; \ } \ } \ return -1; \ } \ } \ \ var arr = new Array(); \ arr['a'] = 'A'; \ arr['b'] = 'B'; \ arr['c'] = 'C'; \ arr['d'] = 'D'; \ for(i in arr) \ { \ document.write(i); \ document.write(arr[i]); \ } \ </script> \ }}} \ Firefox outputs 'aAbBcCdD' as expected, but the other browsers output 'indexOffunction (v, n) { n = n == null ? 0 : n; var m = this.length; for (i = n; i < m; i++) { if (i >= 0 && this[i] == v) { return i; } } return -1; }aAbBcCdD'.
resolution:	→ wontfix
status:	new → closed

Interface is no longer supported; consider switching to jQuery UI.

Side navigation

#1147 closed bug (wontfix)