polyfill-generator v0.1.3

Polyfill-Generator

A collection of polyfills that can be put together programmatically

What is it

First of all, this is a collection of polyfills. They can be imported inside or outside a global context and will automatically apply themselves to the global object, whether it is window in the browser, self in ServiceWorkers or global in Node.

The polyfills target IE8 and forward. Some or many of these will probably also work in IE6 and 7, but I cannot offer any guarantees.

But there's more. It exports a single method, polyfillGenerator which takes a browser name, a browser version and a few other optional arguments. All the polyfills needed by that specific browser will then be generated and returned as a Buffer. You can then inject that in your build-chain however you like.

The following properties are polyfilled and can be applied if you like. All of them works on IE8 except for those marked with a ' *** ' symbol:

• Array.prototypeSymbol.iterator
• Array.prototype.entries (polyfills/iterators)
• Array.prototype.keys (polyfills/iterators)
• Array.prototype.values (polyfills/iterators)
• String.prototypeSymbol.iterator
• NodeList.prototypeSymbol.iterator
• NodeList.prototype.entries (polyfills/iterators)
• NodeList.prototype.keys (polyfills/iterators)
• NodeList.prototype.values (polyfills/iterators)
• Node.prototype.parentElement (polyfills/parentelement)
• Element.prototype.parentElement (polyfills/parentelement)
• Attr.prototype.parentElement (polyfills/parentelement)
• Text.prototype.parentElement (polyfills/parentelement)
• Window (polyfills/window)
• JSON (polyfills/json)
• AudioContext (polyfills/audiocontext)
• Date.prototype.toISOString (polyfills/datetoisostring)
• Date.now (polyfills/datenow)
• Document (polyfills/document)
• HTMLDocument (polyfills/htmldocument)
• Element.prototype.classList (polyfills/classlist)
• Element.prototype.placeholder (polyfills/placeholder)
• Function.prototype.bind (polyfills/functionbind)
• Math.sinh (polyfills/es6math)
• Math.cosh (polyfills/es6math)
• Math.tanh (polyfills/es6math)
• Math.asinh (polyfills/es6math)
• Math.acosh (polyfills/es6math)
• Math.expm1 (polyfills/es6math)
• Math.log10 (polyfills/es6math)
• Math.log2 (polyfills/es6math)
• Math.log1p (polyfills/es6math)
• Math.sign (polyfills/es6math)
• Math.cbrt (polyfills/es6math)
• Math.hypot (polyfills/es6math)
• Math.trunc (polyfills/es6math)
• Math.fround (polyfills/es6math)
• Math.clz32 (polyfills/es6math)
• Math.imul (polyfills/es6math)
• Number.isNaN (polyfills/es6math)
• Number.isFinite (polyfills/es6math)
• Number.isInteger (polyfills/es6math)
• Number.isSafeInteger (polyfills/es6math)
• Number.EPSILON (polyfills/es6math)
• Number.MAX_SAFE_INTEGER (polyfills/es6math)
• Number.MIN_SAFE_INTEGER (polyfills/es6math)
• btoa (polyfills/atob)
• atob (polyfills/atob)
• devicePixelRatio (polyfills/devicepixelratio)
• document.getElementsByClassName (polyfills/getlementsbyclassname)
• document.head (polyfills/documenthead)
• Document.prototype.querySelector (polyfills/queryselector)
• Document.prototype.querySelectorAll (polyfills/queryselector)
• fetch (polyfills/fetch)
• document.hidden (polyfills/visibilitystate)
• document.visibilityState (polyfills/visibilitystate)
• localStorage (polyfills/localstorage)
• sessionStorage (polyfills/localstorage)
• Storage (polyfills/localstorage)
• getComputedStyle (polyfills/getcomputedstyle)
• customElements (polyfills/customelements) (*)
• innerHeight (polyfills/viewport)
• innerWidth (polyfills/viewport)
• pageXOffset (polyfills/viewport)
• pageYOffset (polyfills/viewport)
• scrollY (polyfills/viewport)
• setImmediate (polyfills/setimmediate)
• Reflect (polyfills/reflect)
• Proxy (polyfills/proxy) (*)
• Promise (polyfills/promise)
• Event (polyfills/events)
• Window.prototype.Event (polyfills/events)
• CustomEvent (polyfills/customevents)
• onhashchange (polyfills/onhashchange)
• requestAnimationFrame (polyfills/requestanimationframe)
• Object.defineProperty (polyfills/defineproperty)
• Object.getOwnPropertyNames (polyfills/getownpropertynames)
• Object.create (polyfills/objectcreate)
• Object.defineProperties (polyfills/defineproperties)
• Object.getPrototypeOf (polyfills/es5objects)
• Object.keys (polyfills/es5objects)
• Object.getOwnPropertyDescriptor (polyfills/es5objects)
• Object.assign (polyfills/es6objects)
• Object.is (polyfills/es6objects)
• Object.setPrototypeOf (polyfills/es6objects)
• Object.values (polyfills/es7objects)
• Object.entries (polyfills/es7objects)
• Object.getOwnPropertyDescriptors (polyfills/es7objects)
• Array.isArray (polyfills/es5arrays)
• Array.prototype.forEach (polyfills/es5arrays)
• Array.prototype.indexOf (polyfills/es5arrays)
• Array.prototype.lastIndexOf (polyfills/es5arrays)
• Array.prototype.every (polyfills/es5arrays)
• Array.prototype.some (polyfills/es5arrays)
• Array.prototype.map (polyfills/es5arrays)
• Array.prototype.filter (polyfills/es5arrays)
• Array.prototype.reduce (polyfills/es5arrays)
• Array.prototype.reduceRight (polyfills/es5arrays)
• Array.from (polyfills/es6arrays)
• Array.of (polyfills/es6arrays)
• Array.prototype.find (polyfills/es6arrays)
• Array.prototype.findIndex (polyfills/es6arrays)
• Array.prototype.fill (polyfills/es6arrays)
• Array.prototype.includes (polyfills/es7arrays)
• String.prototype.trim (polyfills/es5strings)
• String.prototype.contains (polyfills/stringcontains)
• String.prototype.codePointAt (polyfills/es6strings)
• String.prototype.repeat (polyfills/es6strings)
• String.prototype.includes (polyfills/es6strings)
• String.prototype.startsWith (polyfills/es6strings)
• String.prototype.endsWith (polyfills/es6strings)
• String.fromCodePoint (polyfills/es6strings)
• String.raw (polyfills/es6strings)
• String.prototype.padStart (polyfills/es7strings)
• String.prototype.padEnd (polyfills/es7strings)
• Map (polyfills/map)
• Set (polyfills/set)
• WeakMap (polyfills/weakmap)
• WeakSet (polyfills/weakset)
• Symbol (polyfills/symbol)
• Symbol.hasInstance (polyfills/symbol)
• Symbol.isConcatSpreadable (polyfills/symbol)
• Symbol.iterator (polyfills/symbol)
• Symbol.match (polyfills/symbol)
• Symbol.replace (polyfills/symbol)
• Symbol.search (polyfills/symbol)
• Symbol.split (polyfills/symbol)
• Symbol.toPrimitive (polyfills/symbol)
• Symbol.toStringTag (polyfills/symbol)
• Symbol.unscopables (polyfills/symbol)
• MutationObserver (polyfills/mutationobservers)
• performance (polyfills/performance)
• performance.now (polyfills/performance)
• navigator.geolocation (polyfills/geolocation)
• screen.orientation (polyfills/orientation)
• location.origin (polyfills/locationorigin)

Usage

If you simply want to pick and choose polyfills, you can import them from polyfills/<name>/polyfill[.min.js|.js]. For instance, here's how to load localStorage:

import "polyfill-generator/polyfills/localstorage/polyfill.min.js";

Of course, it works from a script tag as well:

<script src="node_modules/polyfill-generator/polyfills/localstorage/polyfill.min.js"></script>

If you want to programmatically generate polyfills tailored to a specific browser and version, its incredibly easy as well from. Here's how to import the polyfillGenerator method:

import polyfillGenerator from "polyfill-generator";

// ...Inside your code somewhere:
const [polyfillBuffer] = await polyfillGenerator("ie", 8);
console.log(polyfillCode); // Buffer of all the polyfills. Write to disk or inject it programmatically with your build-tool.

Changelog

v0.1.3:

• Updated map polyfill.

• Updated parentelement polyfill

v0.1.1:

• Updated reflect polyfill.

v0.1.0:

• The list of props to be assigned is now sorted in the same order as the actual order of the polyfills.
• Polyfills that doesn't work in IE8 will no longer be written to the Buffer.
• Fixed a typo in the atob polyfill.

Documentation

The 'Browser' parameter.

A browser is any of the following:

 "chrome"|"safari"|"opera"|"ie"|"edge"|"firefox"|"firefox_mobile"|"opera_mini"|"opera_mobile"|"blackberry"|"android_stock"|"samsung_internet"|"uc_browser"|"ie_mobile";

The polyfillGenerator method has the following signature:

function polyfillGenerator (browser: Browser, version: number, minified: boolean = true, forceApplyAll: boolean = false): Promise<[Buffer, string[]]>

Arguments

• browser: Browser - The browser to generate polyfills for.
• version: number - The main browser version to generate polyfills for (must be an integer, otherwise it will be rounded down to the nearest whole number)
• minified: boolean - Whether or not the polyfills should be minified. default: true
• forceApplyAll: boolean - Whether or not all polyfills should be applied, even if the browser already supports them natively.

Return value

• Promise<[Buffer, string[]]> - A tuple where the first position is a Buffer of the polyfills and the second position is an array of all the properties that will be assigned on the root context based on the polyfills (e.g. 'Object.defineProperty' or 'fetch').