JavaScript after Component is attached in DOM


I need to execute some JavaScript after a component has been attached to the DOM. Is there an event I can listen to? Or a method to override?

Because the Components AttachEvent does not work, as this - as far as I can see it - does not tell that the component is attached to the dom but to the application.

Thanks you for your help!

While there is no Vaadin event as far as I know you could use a Javascript Observer in (e.g.) a Javascript Extension:

              var observer = new MutationObserver(function(mutations) {
                  mutations.forEach(function(mutation) {
                    if (mutation.addedNodes) mutation.addedNodes
                    for (var i = 0; i < mutation.addedNodes.length; ++i) {
                          var node = mutation.addedNodes[i]
                          //Do something and then disconnect the observer because we got what we where looking for

                observer.observe(document.body, {
                    childList: true
                  , subtree: true
                  , attributes: false
                  , characterData: false

I use it in one of my Extension. Before i start the Observer though i set the ID of the Vaadin component i’m looking for on the server-side with setId() and then transfer this ID to the Js client where i then check every new Element against this “idWeAreLookingFor”. As soon as i have the correct element i disconnect the observer.

addon may be usefull to set a listener for “onLoad” component event.

Thank you, the size reporter addon helps a lot!
It has a one time listener, this is exactly what I needed.