如何在此 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 來觸發頁面加載事件，但至少現在這可行。