@aofl/polyfill-service

@aofl/polyfill-service

Implements a customized version of @webcomponents/webcomponentsjs/webcomponents-loader.js that uses dynamic imports to load polyfills. It also allows for lazy loading other polyfills based on a config file.

Api Documentation

Installation

npm i -S @aofl/polyfill-service

Config file

// sample-config.js
export default {
  'Object.assign': () => import('@aofl/polyfill-service/src/object-assign-polyfill'),
  'fetch': () => import('isomorphic-fetch'),
  'Reflect': () => import('harmony-reflect'),
  'Array.prototype.find': () => import('array.prototype.find'),
  'html-imports': {
    test() {
      return !('import' in document.createElement('link'));
    },
    load: () => import('@webcomponents/webcomponentsjs/webcomponents-bundle')
  }
};

Usage

// init-polyfill-service.js
import {Polyfill} from '@aofl/polyfill-service';
import polyfills from './sample-config';

const ready = Polyfill.loadAll(polyfills); // promise

export default ready;

polyfill.loadAll() returns a promise. In addition to this WebComponentsReady is fired once all promises are loaded.

Gotchas

If using webpack you will have to use imports-loader to fix the global variable in webcomponents polyfills.

// webpack.config.js
...
  module: {
    rules: [
      {
        test: /@webcomponents/,
        loader: 'imports-loader?this=>window'
      },
    ]
  }
...

Changelog

v3.5.0 - 2020-02-25

[Added]

• @aofl/wdio - Web Components support with Local and SauceLabs presets
• @aofl/cli - source-map-loader
• npmignore unnecessary files from the packages

[Changed]

• @aofl/unit-testing-plugin - refactored to use WebdriverIO
• unit testing config to work with new version
• @aofl/cli - devtool source-map as default for development builds
• @aofl/cli - updated workbox and pwa-manifest

[Deprecated]

[Removed]

• lodash
• mkdirp
• webcomponents-tester

[Fixed]

• Exclude babel built-ins from generated bundles
• Source map files of generated bundles
• @aofl/cli - eslint loader cache set to false
• @aofl/templating-plugin - routes loader cache set to false. Build will pick up updated routes configs.
• @aofl/cli - init - repo and branch name support

[Security]

• Replaced WebComponentsTester with WebdriverIO
• Updated npm packages
• Changed .gitignore

---