Add [Symbol.iterator]() methods to HTMLCollection

This is related to https://github.com/babel/babel/issues/545 and was previously filed as https://github.com/babel/babel/issues/884

I had this code (working in Firefox without Babel):

for (let contentGroupEl of xmlDocument.getElementsByTagName('contentGroups')) {
...
}

Where xmlDocument is defined as follows:

var xmlDocument = (new DOMParser).parseFromString(content, "application/xhtml+xml");

The above loop iterates over a HTMLCollection.

Babel + Browser Polyfill from babel-core npm package (v4.4.6) generates the following JS, which throws an exception in Chrome:

for (var _iterator = xmlDocument.getElementsByTagName("contentGroups")[Symbol.iterator](), _step; !(_step = _iterator.next()).done; ) {
                var contentGroupEl = _step.value;
}

TypeError: undefined is not a function: since xmlDocument.getElementsByTagName("contentGroups")[Symbol.iterator] equals undefined.

Is is possible to extend HTMLCollection with the iterator methods as well?

My current workaround looks like this:

for (let contentGroupEl of[].slice.call(xmlDocument.getElementsByTagName('contentGroups'))) {
...

Simply extending the HTMLCollection prototype does not seem to work. This code has no effect on the HTMLCollection instances.

if (!HTMLCollection.prototype[Symbol.iterator]) {
  HTMLCollection.prototype[Symbol.iterator] = [][Symbol.iterator]
}

[SeanHayes]

I see this is marked as wontfix, but I see a linked commit that looks like it might fix this. Should iterating over HTMLCollections with for of work? It’s broken for me in Safari.

[mrichard]

@loganfsmyth when is next version of core-js expected? Thanks