title: How do I trigger the window load event in this Jest test?
body: <p>I'm trying to set up my first DOM-manipulation/JQuery Jest test in my Rails project. In its essential form at the moment, I'm just trying to clear a basic hurdle of 'imported Javascript functions do anything at all'.</p>
  
  <p>To that end, I have the following code in PledgeFormUpdates.js.test:</p>
  
  <pre><code>'use strict';
  
  import pledge_form_updates from '../../app/javascript/components/PledgeFormUpdates.js';
  
  test('Displays GDPR checkbox on EU country selection', () =&gt; {
  
    // Set up our document body
    document.body.innerHTML =
      '&lt;select id="pledge_pledgor_home_country" class="country-select"&gt;&lt;/select&gt;'// +
  
      pledge_form_updates();
      const $ = require('jquery');
  
      $(window).trigger('load');
      $("#pledge_pledgor_home_country").trigger('change');
  });
  </code></pre>
  
  <p>And in PledgeFormUpdates.js I have the following:</p>
  
  <pre><code>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')
      });
    });
  };
  </code></pre>
  
  <p>So when I run the test, I'm expecting to see printout including 'hello world', 'mellow curled' and 'yellow twirled'. But in practice it's stopping after the first output, and so presumably the window <code>load</code> event isn't actually getting triggered (which I confirmed by commenting out the <code>window.addEventListener...</code> line, then seeing all three printouts).</p>
  
  <p>What am I doing wrong here - or rather, how <em>should</em> I trigger the load event? (I also tried <code>$(window).load();</code>, but that just raises a TypeError)</p>