-
Notifications
You must be signed in to change notification settings - Fork 25
Home
WORK IN PROGRESS (MAY NOT BE CORRECT)
To begin using the custom elements, you must first ensure that the browser can load them (i.e. you have to load the polyfills). To do so, copy and paste the following to your <head>
.
For HTML Web Components to function:
<!-- ES5 Adapter -->
<script src="https://b5dc4e33c725947e6dec-30cf78e7985757466f892e6ab6b08f81.ssl.cf1.rackcdn.com/custom-elements-es5-adapter.js"></script>
<!-- Polyfill Loader -->
<script src="https://b5dc4e33c725947e6dec-30cf78e7985757466f892e6ab6b08f81.ssl.cf1.rackcdn.com/webcomponents-loader.js"></script>
The adapter provides Custom Element v1 API compatibility for legacy browsers that do not support ES6 syntax (e.g. IE11). It does so via some clever wizardry. Since v1 APIs require custom element constructors to be defined with ES6 classes, it wraps native APIs to make it compatible for ES5 browsers, but ensures that ES6 browsers still follow spec.
- This script is expected to raise a syntax exception in browsers that do not support ES6 syntax (e.g. IE11).
- DO NOT attempt to concatenate or compile this file to ES5.
Using feature detection, the loader will automatically determine the minimum polyfills needed for the user's browser. The loader will add the polyfills via an additional <script>
to the <head>
. If the browser doesn't need any polyfills, this additional <script>
will not be added.
TBD