Javascript Jest与vanilla JS-测试DOM上生成的元素

在网上搜索了很多，但找不到获取元素的innerHTML的最佳方法，只需将其与应该呈现的结果进行比较（我正在尝试与字符串进行比较）

expect（document.body.innerHTML.toString（））.toBe（“测试”）；

我尝试的是添加一些空白，测试失败，所以我猜有更好的方法

此外，无法查询在主体内部生成的特定元素，为什么？

您可以使用它来测试DOM树结构

当您希望确保UI不会意外更改时，快照测试是一个非常有用的工具

例如

---

谢谢有没有更好的方法来检查一个真正大的div（有许多内部div）？@misspato您想如何检查？

expect(document.body.innerHTML.toString()).toBe("<div class='wrapper'><span>test</span></div>");

describe('67618056', () => {
  it('should pass', () => {
    document.body.innerHTML = `
        <div class='wrapper'>
            <span>test</span>
        </div>
    `;
    expect(document.body.innerHTML.toString()).toMatchInlineSnapshot(`
      "
              <div class=\\"wrapper\\">
                  <span>test</span>
              </div>
          "
    `);
  });
});

 PASS  examples/67618056/index.test.ts (7.563 s)
    ✓ should pass (17 ms)

 › 1 snapshot written.
Snapshot Summary
 › 1 snapshot written from 1 test suite.

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   1 written, 1 total
Time:        8.03 s, estimated 9 s