enable-window-document
Advanced tools
Enables "window" and "document" globals so browser code does not throw errors in Node. Built with JSDOM.
window and documentThe goal of this package is to work as a quick-and-dirty one-liner that will allow Node to require and otherwise execute traditional browser code without throwing errors. Simply set the window and document globals with:
/* [CommonJS] */
require('enable-window-document');
- or -
/* [ES6] */
import 'enable-window-document'
No variable assignment required, just call it! The variables are stored on the global object so you can refer to them as you normally would in browser JS.
Won't work:
console.log(document.createElement('a'));
> ReferenceError: document is not defined
Works like a charm:
require('enable-window-document');
console.log(document.createElement('a'));
> HTMLAnchorElement {Symbol(impl): HTMLAnchorElementImpl}
The specific need for this functionality came from the web-widgets package, which generates widget trees using DOM operations like document.createElement(). The Node runtime cannot build out this widget tree by default, as it does not have access to the window and document variables, so it throws a ReferenceError.
By importing this package (which depends on JSDOM), we can expose the window and document globals to the whole project, meaning we can write all of our browser-optimized (and DOM-heavy) code in a file like browser.js, but still use that same code for server-side rendering in Node with require('browser.js').
In Node, web-widgets builds out the widget tree on the virtual DOM and then exports it as flat HTML using the Node.outerHTML property, and in the browser, the DOM is manipulated directly on-the-fly (i.e. with Node.appendChild). With enable-window-document, all that is needed to reuse the original browser library is creating an separate JS file for Node, importing this package, and then importing your browser code:
require('enable-window-document');
require('browser.js');
myBrowserObject.doStuff();
// code like you're in the browser =)
This package simply creates a blank JSDOM with four lines of code, and stores the global window and document variables, which point to the empty DOM:
let JSDOM = require('jsdom'),
DOM = new JSDOM.JSDOM(`<html><body></body></html>`);
global.window = DOM.window,
global.document = window.document;
It should really take zero extra lines to run browser-compatible JS in Node, but one line will do for now. The important part is that instead of writing everything for Node and then using browserify and other tools to polyfill it for the browser, we can write strict code for the browser and force Node to interpret Javascript in the same way the browser does.
Why the Node runtime does not expose window and document OOTB is a valid question, as whatever rationale exists behind that decision cannot be more concrete than the principle that code which can execute in a browser should be able to execute in the Node runtime. Javascript output from one environment should === the same Javascript run in another. It's supposed to be a lingua franca!
FAQs
Enables "window" and "document" globals so browser code does not throw errors in Node. Built with JSDOM.
We found that enable-window-document demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Malicious Go packages are impersonating popular libraries to install hidden loader malware on Linux and macOS, targeting developers with obfuscated payloads.
Security News
Bybit's $1.46B hack by North Korea's Lazarus Group pushes 2025 crypto losses to $1.6B in just two months, already surpassing all of 2024's $1.49B total.
Security News
OpenSSF has published OSPS Baseline, an initiative designed to establish a minimum set of security-related best practices for open source software projects.