title: JSDOM + Ava – test function that relies on `document` global
body: <p>I'm writing some utilities that are related to the <code>document</code> object.</p>
  
  <p>Let's say that I'm writing a that uses <code>document</code> browser object.</p>
  
  <pre><code>// utils.js
  export function myFn(callback) {
    document.addEventListener(callback);  
  }
  </code></pre>
  
  <p>My test file is like so:</p>
  
  <pre><code>// utils.test.js
  import test from "ava";
  import { JSDOM } from "jsdom";
  import sinon from "sinon";
  import { myFn } from "./utils";
  
  let dom, document;
  
  test.beforeEach(() =&gt; {
    dom = new JSDOM();
    document = dom.window.document;
  });
  
  test("it calls the callback when document is ready", t =&gt; {
    let fakeCb = sinon.spy();
    myFn(fakeCb);
    t.true(fakeCb.called);
  });
  
  </code></pre>
  
  <p>After running this test I got a ReferenceError telling that "document is not defined", which makes sense.</p>
  
  <p>My question is: what would be a good way to make the <code>document</code> variable from my test be used inside the function under test?</p>
  
  <p>This function works if I pass a <code>document</code> parameter to it, but this is an  ugly solution.</p>