@carv/polyfills NPM

@carv/polyfills

Browser polyfills

Usage

<head>
  <link rel="preload" href="/path/to/cdn/@carv/polyfills@1.x/es2020/bootstrap.js" as="script" />
  <link rel="preload" href="/path/to/cdn/@carv/polyfills@1.x/es2020/polyfills.js" as="script" />
  <link rel="preload" href="/path/to/cdn/<package>" as="script" />
</head>
<body>
  <main></main>
  <script
    src="/path/to/cdn/-/bootstrap"
    data-main="<package>"
    data-state="encodeURIComponent(<state>)"
    data-token="encodeURIComponent(<token>)"
    nonce="${request.id}"
  ></script>
</body>

Polyfills

We provide the most common APIs in a target specific bundle. APIs that are detectable globals are replaced per usage with an import to the poylfill.

If a feature is not listed here check if it is already supported by IE 11.

Bootstrapped

Promise
SystemJS

Polyfilled

Array.isArray
Array.prototype.*
DOMTokenList*
DocumentFragment*
Element*
Event*
Function*
HTMLTemplateElement
Node.prototype.* (including baseURI)
NodeList.prototype.*
Object.* except Object.fromEntries
Promise
Promise.allSettled
Promise.prototype.finally
RegExp.prototype.flags
Reflect
Reflect.*
String.prototype.*
Symbol
Symbol.*
console.*
fetch

Dynamic

AbortController
Array.from
Array.of
ArrayBuffer
Blob
CSS.supports
CustomEvent
DataView
IntersectionObserver & IntersectionObserverEntry
Intl
Map
Math.*
MutationObserver
Number
Object.fromEntries
ResizeObserver
Set
String.fromCodePoint
String.raw
URL
URLSearchParams
TextEncoder
UserTiming (self.performance)
WeakMap
WeakSet
globalThis
navigator.sendBeacon
queueMicrotask
requestIdleCallback
setImmediate

Available Scripts

npm test

Two sub scripts will came in handy from time to time:

npm start test.watch: re-run tests on change
npm start test.coverage: creates a coverage report at coverage/lcov-report/index.html

npm run format

Formats all sources using prettier.

Create a release

Update changelog
npm run format
npm test
git commit -a -m "chore: prepare release`
npm version [\ | major | minor | patch] -m "chore: release"

Folder Structure

`src/`

Put all your source code including your test files here. Test files are matched using the following regexp:

src/**/__tests__/*.{js,jsx,ts,tsx}: matches every file within a __tests__ directory but not in child directories
src/**/*.{spec,test}.{js,jsx,ts,tsx}: matches *.test.js and *.spec.js files; some for the other extensions