Как проверить динамические изменения в DOM через JavaScript с помощью Jest или какой-либо другой библиотеки тестирования? - PullRequest
0 голосов
/ 20 марта 2019

Я динамически добавляю тег <script> к документу <head> при загрузке страницы в зависимости от среды.

Функция:

export const loadScript = () => {
  // load script tag into head
  const HEAD = document.getElementsByTagName('head')
  const SCRIPT_TAG = document.createElement('script')
  SCRIPT_TAG.setAttribute('src', process.env.SCRIPT_SRC)
  SCRIPT_TAG.setAttribute('async', true)
  HEAD[0].append(SCRIPT_TAG)
}

Я хочу написать тестон проверяет, если после запуска функции loadScript() тег <script> попадет в голову.Наша среда настроена с помощью Jest, и я не нашел удовлетворительного примера, который демонстрирует, как это сделать или работает.

Я новичок в тестировании и буду признателен за любые решения или предлагаемые подсказки.

1 Ответ

0 голосов
/ 20 марта 2019

Я полагаю, что самый простой способ проверить это было бы примерно так:

test('loadScript', () => {
  process.env.SCRIPT_SRC = 'the-src';
  loadScript();
  expect(document.head.innerHTML).toBe('<script src="the-src" async="true"></script>');
});

Это работает, потому что стандартная среда тестирования для Jest равна jsdom, которая имитируетdocument.

...