javascript - Dom 操作（AppendChild）在 Jest 中失败

Question

我在下面的测试用例中需要一些帮助：appenChild 在 Jest 中失败

updatePopupContent(data) {
    const sectionFragment = new DocumentFragment();
    //create section return HTML element as per data passed
    data.costSection && sectionFragment.appendChild(this.createSection(data.costSection));// test fails here
    this.dom.content.appendChild(sectionFragment);
}

describe('test functionality', () => {
            const data = {
                costSection: {
                    price: "10 USD"
                }
            }
            it("should create subsections ", () => {
                context.createSection = jest.fn().mockImplementation(() => {
                    const section = document.createElement("div");
                    section.innerHTML = "Test Section";
                    return section;
                })
                context.updatePopupContent(data); // throwing error : TypeError: Cannot read property 'adoptNode' of undefined
                expect(context.createSection).toHaveBeenCalledTimes(1);
            })

实际上这是 JSDOM 的一个问题：https ://github.com/jsdom/jsdom/issues/2274 我需要在测试中进行哪些更改才能解决错误。

谢谢

Answer 1

因此，如果我理解正确，提交 f9dc6271a8ed557d7557967b87b51bed42a4d932可以解决您遇到的问题。并且似乎包含在 JSDom 16.0.0 release中。

您需要做的就是更新您的jest, 所以它的jest-environment-jsdom点至少要jsdom 16.0.0. 根据历史，您package.json至少需要26.0.1