Jest是否在每个套件或测试后重置JSDOM文档？

Question

我正在测试在安装和卸载时到达DOM结构之外的几个组件,以提供其他方式无法实现的特定交互功能.

我正在使用Jest和默认的JSDOM初始化来在节点内创建类似浏览器的环境.我在文档中找不到任何建议在每次测试执行后Jest重置JSDOM,并且如果不是这样的话,没有关于如何手动执行此操作的明确文档.

我的问题是,Jest是否在每次测试,套件之后重置JSDOM实例,还是在所有测试运行中保留一个JSDOM实例？如果是这样,我该如何控制它？

Answer 1

纠正(误导性)接受的答案并明确强调以前评论之一的非常重要的信息:

不.在每次测试运行后,Jest 都不会清理JSDOM文档!它只在完成整个文件中的所有测试后清除DOM.

这意味着您必须在每次单次测试运行后手动清理测试期间创建的资源.否则会导致共享状态,从而导致非常微妙的错误,难以跟踪.

以下是在jest测试套件中的每次单个测试之后清理JSDOM的一种非常简单但有效的方法:

describe('my test suite', () => {
  afterEach(() => {
    document.getElementsByTagName('html')[0].innerHTML = ''; 
  });

  // your tests here ...
});

Answer 2

Rico Pfaus 是对的，尽管我发现按照他建议的方式重置innerHTML 破坏性太大并导致测试失败。相反，我发现选择要从文档中删除的特定元素（按类或 ID）更有效。

describe('my test suite', () => {
    afterEach(() => {
        document.querySelector(SOME CLASS OR ID).innerHTML = ''
    })
})