title: JSDOM - Document is not defined
body: <p>I've created a very simple page that just displays a single message, as I'm trying to test out the JSDOM to use <code>document</code>. However, I'm getting the below error.</p>
  
  <p>First of all, I have seen the countless examples online, in addition to the questions posted on Stack Overflow, but I have not been able to resolve even the simplest example. As a side-note, I am new to Javascript.</p>
  
  <p>My code so far is as follows:</p>
  
  <p>Root Directory</p>
  
  <p>--->index.html<br>
  --->module.js<br>
  --->package-lock.json<br>
  --->package.json<br>
  --->test<br>
  --->--->messageTest.js</p>
  
  <p>The different files are as follows:</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;jsdom Unit Test&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
    &lt;p id='msg'&gt;Hello, World!&lt;/p&gt;
    &lt;script src="module.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>module.js</strong></p>
  
  <pre><code>function updateMsg(newMsg) {
    document.getElementById('msg').innerHTML = newMsg;
  }
  
  updateMsg("Changing message");
  
  module.exports = updateMsg;
  </code></pre>
  
  <p><strong>package.json</strong></p>
  
  <pre><code>{
    "name": "message-example",
    "version": "1.0.0",
    "description": "Testing how to use the JSDOM",
    "main": "module.js",
    "scripts": {
      "test": "mocha"
    },
    "author": "",
    "license": "ISC",
    "devDependencies": {
      "chai": "^4.2.0",
      "jsdom": "^15.1.1",
      "mocha": "^6.2.0",
      "mocha-jsdom": "^2.0.0",
      "rewire": "^4.0.1",
      "sinon": "^7.3.2"
    }
  }
  </code></pre>
  
  <p><strong>messageTest.js</strong></p>
  
  <pre><code>var updateMsg = require('../module.js');
  const expect = require('chai').expect
  const { JSDOM } = require('jsdom');
  
  describe('updateMsg', function () {
  
    before(function() {
      return JSDOM.fromFile('index.html')
        .then((dom) =&gt; {
          global.window = dom.window;
          global.document = window.document;
        });
    })
  
    it ('updates the innerHTML of element with id "msg"', function () {
      expect(document.getElementById('msg').innerHTML).to.equal('Hello, World!');
      updateMsg('The new msg!');
      expect(document.getElementById('msg').innerHTML).to.equal('The new msg!');
    });
  });
  </code></pre>
  
  <p>If I run the test with <code>npm test</code>, I get the <code>ReferenceError: document is not defined</code> error at the <code>document.getElementByID...</code> step in the <strong>module.js</strong> file.</p>
  
  <p>If I remove the <code>updateMsg("Changing message")</code>, my test obviously runs fine.</p>