JavaScript - не удается получить документ JSDOM в тесте Jest - PullRequest
Новая
       39

JavaScript - не удается получить документ JSDOM в тесте Jest

0 голосов
/ 20 ноября 2018

У меня есть модуль, который предоставляет некоторые вспомогательные функции для манипулирования DOM, которые я пытаюсь протестировать с помощью Jest и jsdom, но я, кажется, что-то делаю не так в его создании.

Из прочтения других вопросов иответы (например, этот ) Я понимаю, что среда тестирования Jest автоматически настроена на использование jsdom и вам нужно заменить global.document, но она не работает, как у меня сейчас.

Вот наименьший тестовый пример для воспроизведения проблемы: 

// domUtils.js

function el(id) {
    return document.getElementById(id);
}

и 

// domUtils.test.js

import { JSDOM } from "jsdom";

import * as domUtils from "../src/domUtils";

describe("DOM operations", () => {
    // Workaround for jsdom issue 2304 - needed for later localStorage tests
    const url = "http://localhost";

    const documentHTML = '<!DOCTYPE html><div id="lorem" class="test">Lorem ipsum</div>';

    global.document = new JSDOM(documentHTML, { url });

    test("Get an element from the DOM", () => {
        const loremDiv = domUtils.el("lorem");

        expect(loremDiv.constructor.name).toEqual("HTMLDivElement");
    });
}

В результате получается TypeError: Cannot read property 'constructor' of null.Замена вызова на domUtils.el() на document.getElementById() приводит к той же ошибке.

Это какая-то проблема порядка загрузки или что-то еще?

1 Ответ

0 голосов
/ 21 ноября 2018

Хорошо, решение было - мне совершенно не нужно было выполнять какую-либо настройку jsdom, потому что Jest уже сделал это.Вы можете установить document.body.innerHTML непосредственно в своих тестах, и Боб станет вашим дядей.

Я попал на очень короткую страницу Jest по тестированию DOM и пропустил пример кода, использующего jQuery, потому что я не использую jQuery, - и попал в параграф, в котором упоминается, что он предоставляетjsdom.Но это не объясняло этого и не ссылалось на документы JSDOM, поэтому я искал и нашел их.И они не упоминают Jest ни разу - поэтому я следовал инструкциям по настройке jsdom, который оказался полностью избыточным и привел к ошибке, которую я получил.Честно говоря, одно предложение «Если вы используете Jest, вам не нужно создавать экземпляр jsdom самостоятельно», спасло бы меня примерно на два дня, чтобы вырвать мои волосы.

...