918615 - getElementsByTagName object behaves unexpecedly with for/in loop

Status: RESOLVED DUPLICATE of bug 843840

(Firefox :: Untriaged, defect)

Description

[constant_irritation]

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:24.0) Gecko/20100101 Firefox/24.0 (Beta/Release)
Build ID: 20130911160237

Steps to reproduce:

<div id="parent">
<div id="child1"></div>
<div id="child2"></div>
</div>

<script>
divs = document.getElementById('parent').getElementsByTagName('div');

document.write('divs.length: ' + divs.length + '<br><br>');

document.write('IDs as reported in a for... loop: ');
var forcount = 0;
for (i = 0; i < divs.length; i++) { document.write(divs[i].getAttribute('id') + ' '); forcount++; }
document.write('<br>incrementer after a for loop: ' + forcount + '<br>');

var forincount = 0;
for (var i in divs) forincount++;
document.write('<br>incrementer after a for/in loop: ' + forincount + '<br>');

document.write('IDs as reported in a for/in loop: ');
for (var i in divs) { document.write(divs[i].getAttribute('id') + ' '); }
</script>


Actual results:

divs.length: 2
IDs as reported in a for... loop: child1 child2
incrementer after a for loop: 2
incrementer after a for/in loop: 8
IDs as reported in a for/in loop: child1 child2 child1 child2

-----------------------------------------------

There are only two elements, but they are each reported twice using a for/in loop.  It appears that the getElementsByTagName method is returning every node twice into the resulting object/array, yet still (correctly) the reports the length.

Additionally, you'll also see an error as the getAttribute method attempts to access a 5th element that obviously doesn't exist.


Expected results:

This is what it returns in other browsers (mostly as expected)

divs.length: 2
IDs as reported in a for... loop: child1 child2
incrementer after a for loop: 2
incrementer after a for/in loop: 4
IDs as reported in a for/in loop: child1 child2

Comment 1

[Mardeg]

This looks to be a dupe of bug 396252.

From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in

"for..in should not be used to iterate over an Array where index order is important. Array indexes are just enumerable properties with integer names and are otherwise identical to general Object properties. There is no guarantee that for...in will return the indexes in any particular order and it will return all enumerable properties, including those with non–integer names and those that are inherited.

"Because the order of iteration is implementation dependent, iterating over an array may not visit elements in a consistent order. Therefore it is better to use a for loop with a numeric index (or Array.forEach or the non-standard for...of loop) when iterating over arrays where the order of access is important."

See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of and
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

Comment 2

[constant_irritation]

Oh ... I see.  My apologies.

Still, it's interesting that it works in every browser I've tried other than later versions of Firefox

Comment 3

[Mardeg]

Actually this mirrors bug 843840 more accurately and there's much better discussion of how other browsers fail to follow the HTMLCollection spec.