Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
JavaScript after Component is attached in DOM
Hello,
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];
if(node.id==idWeAreLookingFor){
//Do something and then disconnect the observer because we got what we where looking for
observer.disconnect();
}
}
});
});
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.
The SizeReporter 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.