Почему не выводится набор React-компонентов?

Question

[Аня Коломенская]

Почему не выводится набор React-компонентов? - не могу отловить ошибку. Следующая штука не выводит никакого результата, хотя должна:

return document.getElementsByTagName("main")[0].getElementsByTagName("section").map(theArrayElement => <p>Paragraph!</p>);

Однако если проверить первую часть выражения (где формируется массив элементов):

return document.getElementsByTagName("main")[0].getElementsByTagName("section").length;

...то совершенно правильно выводится "2" - их столько и должно быть, - так что массив формируется. Если проверить содержимое этого массива:

return document.getElementsByTagName("main")[0].getElementsByTagName("section")[0].innerText;

...то совершенно правильно выводится "Test text!" - это именно тот текст, что я запихала внутрь тестовой секции, - так что в массиве содержатся правильные элементы. Теперь проверяю вторую часть (где используется простейший map()):

return [0, 0, 0].map(theArrayElement => <p>Paragraph!</p>);

...что также работает правильно, выводя тройку абзацев с текстом "Paragraph!". Итак, у меня работает первая половина выражения и работает вторая половина выражения, но не работает всё выражение. Я не понимаю, в чём ещё может быть дело.
P.S.: Полный класс очень прост и выглядит так:

class ContentsList extends React.Component {
    render() {
        // Тот самый return - и больше ничего
    }
}

P.P.S.: Я знаю, что theArrayElement => <p>Paragraph!</p> - глупость, так как переменная theArrayElement не используется в самой функции. Но нормальная логика будет позже, и там уже переменная пойдёт в ход. Пока нужно хотя бы разобраться с этой базовой проблемой.

Answer 1

[FabiBoom]

Я не знаю, что вы пытаетесь сделать и я так понимаю, что причина в том, что метод getElementsByTagName возвращает не массив, а HTMLCollection, у которого нету метода map, который вы пытаетесь использовать.
Решить проблему можно путем приведения результата в массив:

Array.from(document.getElementsByTagName("main")[0].getElementsByTagName("section")).map(theArrayElement => <p>Paragraph!</p>);