For...of with HTMLCollection

[n2westman]

Hi,

Getting a compile error when trying to compile:

// ul is an HTMLElement
for (let child of ul.children) {
    //body
}

I get the following error: error TS2495: Type 'HTMLCollection' is not an array type or a string type.

Is there a way to get type support for this? Or is too much work to bother with?

[xLama]

HTMLCollection is not an array.

https://developer.mozilla.org/en-US/docs/Web/API/NodeList#Why_can't_I_use_forEach_or_map_on_a_NodeList.3F

[n2westman]

xLama, I am aware. However, the compiled code only needs an interface of .length, which means psuedoarrays should also be able to compile with the for..of syntax, right?

[xLama]

I think If ECMAScript does not support HTMLCollection like an array, TypeScript neither.

However ECMAScript 6 supports it, so I am agree.

[n2westman]

That's a good point!

[xLama]

You can do this por the moment:

var foo:HTMLCollection;
var bar = [].slice.call(foo);
for (var g of bar){}

[n2westman]

Yeah. The other thing you can do (if you promise not to mess with the body of the DOM in the loop) is:

for(let c of <any>bar) {}

[n2westman]

Thanks! :)

[saschanaz]

ES6 does not support HTMLCollection on for-of loop as it is not iterable. NodeList is iterable and should be supported. Check #2695.

[xLama]

@saschanaz What about this? #2696
for-of only works on arrays for ES3/ES5 by design.

[saschanaz]

@xLama You are right. A limited number of iterable interfaces should be supported but currently not. #4947 is also related.

[xLama]

@saschanaz There is a problem. How do you want to iterate them when emit to ES3/5 without complicate it?