Transpiled For...of loop through HTMLCollection throws error

Question

I use Reactjs with ES6 syntax and Babel transpiler.

When I use ES5 syntax I get expected result:

console.log(React.findDOMNode(this.refs.propertyInputs).getElementsByTagName('input'));
var propInputs = React.findDOMNode(this.refs.propertyInputs).getElementsByTagName('input');
for (var i = 0; i < propInputs.length; i++){
          propInputs[i].value = "";
}

console.log output

but when I use for...of loop

console.log(React.findDOMNode(this.refs.propertyInputs).getElementsByTagName('input'));
var propInputs = React.findDOMNode(this.refs.propertyInputs).getElementsByTagName('input');
for (let propInput of propInputs) {
         propInput.value = "";
}

Babel transpiles this code to

"use strict";

var propInputs = React.findDOMNode(undefined.refs.propertyInputs).getElementsByTagName('input');
// for (var i = 0; i < propInputs.length; i++){
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;

try {
    for (var _iterator = propInputs[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
        var propInput = _step.value;

        propInput.value = "";
    }
} catch (err) {
    _didIteratorError = true;
    _iteratorError = err;
} finally {
    try {
        if (!_iteratorNormalCompletion && _iterator["return"]) {
            _iterator["return"]();
        }
    } finally {
        if (_didIteratorError) {
            throw _iteratorError;
        }
    }
}

and I get error

Uncaught TypeError: propInputs[Symbol.iterator] is not a function