Search code examples
javascriptweb-component

Cannot call Webcomponent method from page

I try to make a simple webcomponent (with webcomponents.js v 0.7.23). This component has a method (setTitre()). If I call this method in my HTML page at startup, Chrome is ok but FF and IE say that the function is undefined. If I call this method from the console (document.querySelector('hello-world').setWho('new')), it's ok in all browsers.

Code is here : https://github.com/olofweb/Webcomponents

Solution

  • With the webcomponentsjs polyfill, you need to wait for the WebComponentsReady event before calling a custom element method:

    document.addEventListener( 'WebComponentsReady', function () 
{
    document.querySelector('hello-world').setTitre()
} )

    It's due to the asynchronous upgrading of the custom elements when using the non-native implementation.