Package Exports

diffhtml-prollyfill

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (diffhtml-prollyfill) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

<±/> diffHTML Prollyfill

Stable Version: 1.0.0-beta.7

Use directly in place of diffhtml. The term prollyfill means I'd like to see it be a standard some day, but is currently not under any consideration. Click here for the "prollyfill" origin tweet.

Install

Assuming you want to install the latest version of diffHTML with the prollyfill:

npm install --save diffhtml diffhtml-prollyfill

This architecture makes it easy to swap out versions of diffHTML to use with the prollyfill.

Documentation

Quick usage:

import enableProllyfill from 'diffhtml-prollyfill';

// Enable the prollyfill which exposes globals.
enableProllyfill();

// Diff the text contents into `<body>`.
document.body.ouerHTML = `<body>Hello world</body>`;

Disclaimer: By calling this method, you are agreeing that it's okay for diffHTML to modify your browser's HTMLElement constructor, Element.prototype, the document object, and add some globals to window.

`Element.prototype.outerHTML`

Overrides the default outerHTML behavior to automatically apply a virtual DOM to the outer contents.

document.querySelector('main').outerHTML = '<new markup to diff/>';

`Element.prototype.innerHTML`

Overrides the default innerHTML behavior to automatically apply a virtual DOM to the inner contents.

document.querySelector('main').innerHTML = '<new child markup to diff/>';

`Element.prototype.release`

Cleans up a given DOM Node's association with diffHTML.

const newElement = document.createElement('main');

newElement.innerHTML = '<div></div>';
newElement.release();