Several UIs are created instead of one

[denis-anisimov]

I'm not sure whether this is portal demo issue or not (most likely not) but each time when I reload the page 2 or 3 UIs are created and registered in the session. There should be only one UI instance.

Most likely this is Flow issue but I may reproduce it with patient portal demo at least.

To see this : create a route target and put the code inside its CTOR:

UI.getCurrent().setId(UUID.randomUUID().toString());
VaadinSession session = VaadinSession.getCurrent();
System.out.println(session.getUIs().size());
for (UI ui : session.getUIs()) {
      System.out.println(ui.getId());
            if (!ui.getId().isPresent()) {
                ui.close();
            }
        }

Each time when the browser tab is reloaded I see at least two more UI instances (session.getUIs().size() is increasing at least by 2). Sometimes even 3 new instances are added. Only one of those instances is real instance created as a result of handling client request. This UI instance has randomly generated id. Other UI instances has empty id which means they have not been created as a result of navigation. As you can see in the code the are closed via ui.close(); which doesn't break anything.

[Legioth]

I suspect those "extra" UIs are showing 404 error views for some missing files that are still loaded for some reason?

[denis-anisimov]

Network doesn't show me any 404 error

[denis-anisimov]

Might be related to service workers (sw.js)

[denis-anisimov]

The additional UI is created because /sw.js service worker file is requested.

[denis-anisimov]

This is actually not a bug neither in patient portal project nor in Flow. The reason of additional UIs creation as I said is requesting /sw.js service worker file. It doesn't exist in the project and should not be actually requested at all.

It's quite specific situation when it's requested for me personally (and may be anyone else who is running several projects locally): the service worker should be registered explicitly on the client side via the navigator.serviceWorker.register() call. It looks like I had some other project running the service worker and it has been deployed to the same URL which I use for the patient portal : http://localhost:8080. Service Workers are per origin and since the patient portal uses the same origin the browser tries to reuse service worker from the cache.

This should not happen in production mode where origins don't collide and we can't do anything in Flow since we can't know the service worker file name.

So it's good to have this issue for tracking but it's invalid: nothing will be done for it.