如何在测试库中查看getELementsByClassName中的HTML

Question

我使用getElementsByClassName使用React测试库

测试容器对象

let e = container.getElementsByClassName("my-Table-row");

如何查看"e"？ 我所有的东西看起来像:

Proxy {Symbol(impl): HTMLCollectionImpl}

…这没什么用。

console.info (. .)也没有任何令人满意的反馈。

Answer 1

由于getElementsByClassName返回一个HTMLCollection，您需要对其进行迭代，然后使用innerHTML获取每个HTMLElement的HTML。

const { container, debug } = render(
<>
<div class="my-Table-row"><div>Table row</div></div>
<div class="my-Table-row"><div>Table row</div></div>
</>
);
const itemsAsHtmlStrings = Array
.from(container.getElementsByClassName('my-Table-row'))
.map(item => item.innerHTML);
console.info(itemsAsHtmlStrings.join('n'));