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.
Embedding Vaadin UI twice
Dear community,
I'm trying to embed (like described here: https://vaadin.com/docs/-/part/framework/advanced/advanced-embedding.html) the same Vaadin UI in a page. The UI is a simple button the changes a label, for test purposes.
It mostly works, except the first time the embedding page is called. The fist time the page is called, everything seems to works but if I click on the button of the first initialized UI (hrough a call to vaadin.initApplication), the page is reloaded and the UIs are initialized again. It is like ther is a "timing" issue the first time the page is called because the second Vaadin UI instance has v-uild=0 has query parameter to the POST that is issued when I click on the button. And a click on the first Vaadin UI button just reload the page. After the reload, UI 1 has v-uild=1 and UI 2 has v-uild=2.
I would also like to know if it is possible the share the same UI instance in the same page, as it is possible to do with portlets.
Thanks for your help!
I can confirm the timing issue.
I wrote the following function:
function waitForVaadin(app, callback) {
if (!window.vaadin.clients[app] || window.vaadin.clients[app].initializing)
{
setTimeout(function() { waitForVaadin(app, callback) }, 5)
}
else
{
callback && callback();
}
}
To defer the initialization of the second UI after the first UI has finished is initialization. And it now works.
It would have been nice if I could set a callback function in the config params of the vaadin.initApplication (or better, if Vaadin was able to handle the issue).