About

Happy DOM is a JavaScript implementation of a web browser without its graphical user interface. It includes many web standards from WHATWG DOM and HTML.

The goal of Happy DOM is to emulate enough of a web browser to be useful for testing, scraping web sites and server-side rendering.

Happy DOM focuses heavily on performance and can be used as an alternative to JSDOM.

This package contains a utility that registers Happy DOM globally, which makes it possible to use Happy DOM for testing in a Node environment.

DOM Features

• Custom Elements (Web Components)

• Shadow Root (Shadow DOM)

• Declarative Shadow DOM

• Mutation Observer

• Tree Walker

• Fetch

And much more..

Works With

• Google LitHTML

• Google LitElement

• React

• Angular

• Vue

Installation

npm install @happy-dom/global-registrator --save-dev

Usage

Register

import { GlobalRegistrator } from '@happy-dom/global-registrator';

GlobalRegistrator.register();

document.body.innerHTML = `<button>My button</button>`;

const button = document.querySelector('button');

// Outputs: "My button"
console.log(button.innerText)

Unregister

import { GlobalRegistrator } from '@happy-dom/global-registrator';

GlobalRegistrator.register();

GlobalRegistrator.unregister();

// Outputs: "undefined"
console.log(global.document)

Performance

| Operation | JSDOM | Happy DOM | | ------------------------------------ | ------- | --------- | | Import / Require | 333 ms | 45 ms | | Parse HTML | 256 ms | 26 ms | | Serialize HTML | 65 ms | 8 ms | | Render custom element | 214 ms | 19 ms | | querySelectorAll('tagname') | 4.9 ms | 0.7 ms | | querySelectorAll('.class') | 6.4 ms | 3.7 ms | | querySelectorAll('[attribute]') | 4.0 ms | 1.7 ms | | querySelectorAll('[class~="name"]') | 5.5 ms | 2.9 ms | | querySelectorAll(':nth-child(2n+1)') | 10.4 ms | 3.8 ms |

See how the test was done here