Skip to content

Load deferred scripts that survive vulcanisation/bundling in Polymer 1.x

License

Notifications You must be signed in to change notification settings

TheProfs/defer-script

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

<defer-script>

Build Status

Load deferred scripts that survive vulcanisation/bundling.

Usage

$ bower install --save defer-script

Basic

In the below example, testLib will be loaded after the element is attached, regardless if this element was vulcanised/bundled.

In short, the src is not included in any bundles.

<defer-script src="/lib/test-lib.js"></defer-script>

Important: All non-http/https scripts are passed through this.resolveUrl() to resolve their relative path.

Multiple scripts

You can provide multiple src's by separating them with a comma.

<defer-script src="/lib/foo.js, /lib/bar.js"></defer-script>

Checking load status

When all srcs have loaded successfully, a loaded attribute will be added to the element.

<defer-script src="/lib/foo.js, /lib/bar.js" loaded></defer-script>

The element will also fire load/error events where appropriate:

// Success, all srcs have loaded
document.querySelector('defer-script').addEventListener('load', () => {
  console.log('loaded')
})

// Error, at least 1 src has failed to load
document.querySelector('defer-script').addEventListener('error', e => {
  console.error(e.detail)
})

Tests

$ polymer test

Authors

License

MIT License