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

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”。但实际上它在第一个输出后停止，因此大概窗口load事件实际上并没有被触发（我通过注释掉该window.addEventListener...行，然后看到所有三个打印输出来确认）。

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

Answer 1

我找到了一个解决方法，虽然它看起来很hacky。在测试文件中，如果我替换该行window.addEventListener("load", function() {,和$(window).on("load", function() {然后运行测试（包括$(window).trigger('load');语句）打印所有日志行。我一定遗漏了一些东西，因为我无法相信 Jest 会要求JQuery 触发页面加载事件，但至少现在这是有效的。