mirror of
https://github.com/jlengrand/webcomponentsjs.git
synced 2026-03-10 08:51:22 +00:00
README: Add section on WebComponentsReady
This commit is contained in:
17
README.md
17
README.md
@@ -71,6 +71,23 @@ Everything in this repository is BSD style license unless otherwise specified.
|
||||
|
||||
Copyright (c) 2015 The Polymer Authors. All rights reserved.
|
||||
|
||||
## Helper utilities
|
||||
|
||||
### `WebComponentsReady`
|
||||
|
||||
Under native HTML Imports, `<script>` tags in the main document block the loading of such imports. This is to ensure the imports have loaded and any registered elements in them have been upgraded.
|
||||
|
||||
The webcomponents.js and webcomponents-lite.js polyfills parse element definitions and handle their upgrade asynchronously. If prematurely fetching the element from the DOM before it has an opportunity to upgrade, you'll be working with an `HTMLUnknownElement`.
|
||||
|
||||
For these situations (or when you need an approximate replacement for the Polymer 0.5 `polymer-ready` behavior), you can use the `WebComponentsReady` event as a signal before interacting with the element. The criteria for this event to fire is all Custom Elements with definitions registered by the time HTML Imports available at load time have loaded have upgraded.
|
||||
|
||||
```js
|
||||
window.addEventListener('WebComponentsReady', function(e) {
|
||||
// imports are loaded and elements have been registered
|
||||
console.log('Components are ready');
|
||||
});
|
||||
```
|
||||
|
||||
## Known Issues
|
||||
|
||||
* [Custom element's constructor property is unreliable](#constructor)
|
||||
|
||||
Reference in New Issue
Block a user