如何在此 Jest 测试中触发 window 加载事件？

Question

我正在尝试在我的 Rails 项目中设置我的第一个 DOM 操作/JQuery Jest 测试。 目前，在其基本形式中，我只是想清除“导入的 Javascript 函数可以做任何事情”的基本障碍。

为此，我在 PledgeFormUpdates.js.test 中有以下代码：

'use strict';

import pledge_form_updates from '../../app/javascript/components/PledgeFormUpdates.js';

test('Displays GDPR checkbox on EU country selection', () => {

  // Set up our document body
  document.body.innerHTML =
    '<select id="pledge_pledgor_home_country" class="country-select"></select>'// +

    pledge_form_updates();
    const $ = require('jquery');

    $(window).trigger('load');
    $("#pledge_pledgor_home_country").trigger('change');
});

在 PledgeFormUpdates.js 我有以下内容：

export default function() {
  console.log('hello world');
  window.addEventListener("load", function() {

    console.log('mellow curled');
    $("#pledge_pledgor_home_country").change(function() {
      console.log('yellow twirled')
    });
  });
};

因此，当我运行测试时，我希望看到打印输出包括“hello world”、“mellow curled”和“yellow twirled”。 但实际上它在第一个 output 之后停止，因此可能 window load事件实际上并没有被触发（我通过注释掉window.addEventListener... .

我在这里做错了什么 - 或者更确切地说，我应该如何触发加载事件？ （我也试过$(window).load(); ，但这只会引发 TypeError）

Answer 1

我找到了一个解决方法，虽然它看起来很hacky。 在测试文件中，如果我替换该行

window.addEventListener("load", function() { ,

和

$(window).on("load", function() {

然后运行测试（包括$(window).trigger('load');语句）打印所有日志行。

我一定遗漏了一些东西，因为我不敢相信 Jest需要JQuery 来触发页面加载事件，但至少现在这可行。