Dialog doesn't automatically close if navigating with RouterLinks

[ttsanton]

Attached is an example project using version 13.0.0.alpha1. Made using Eclipse and a Wildfly 14 server.
DialogOpened.zip

Steps to re-create:

1. Use the top RouterLink menu bar to move other views.
2. Click on the Button to open Dialog. Do not close it out.
3. Hit the "Back" button on the Browser

The Dialog will not close on its own and will persist into the new view.

[Legioth]

Automatically closing any open Dialog whenever there's a navigation event would break use cases where there's navigation within different sections of a (modal) dialog. This means that the behaviour should somehow be configurable.

Some potential approaches for dealing with this:

1. Something like dialog.setCloseOnNavigation(true). A different question is whether the default should true or false. Closing on navigation is probably the more common case, but changing it would break backwards compatibility. The new feature would be slightly more discoverable if there would also be an overload of open() that takes this additional parameter.
2. Introducing the concept of a dialog having an owner and setting it up so that the dialog is automatically closed when the owner is detached. By default, the current UI would be the owner but it would also be possible to explicitly define some other component. This is in fact already possible by explicitly adding the dialog component as a child of some other component, but this relationship is far from obvious. An explicit API might therefore be helpful.

[ttsanton]

A method like the dialog.setCloseOnNavigation(true) @Legioth mentioned would be quite helpful.

I am able to implement a workaround for my project to address my issue by implementing a BeforeLeaveObserver to check all components currently set to the main UI of the current view, and if it matches the (modal/component) Dialog, it will close it out.

Using the project I attached as an example:

@Override
public void beforeLeave(BeforeLeaveEvent event) {
	Iterator<Component> iterator = UI.getCurrent().getChildren().iterator();
	while(iterator.hasNext()) {
		Component c = iterator.next();
		System.out.println("component: " + c.getClass().getSimpleName());
		if(c.getClass().equals(DialogComponent2.class)) {
			DialogComponent2 dialog = (DialogComponent2) c;
			dialog.close();
		}
	}
}

[knoobie]

@ttsanton not sure if it works for your use case as well, I could get around with the following:

  public class SelfclosingDialog extends Dialog implements AfterNavigationObserver {

    @Override
    public void afterNavigation(AfterNavigationEvent event) {
      this.close();
    }
  }

Dunno what's more resource hungry, AfterNavigationObserver for every created window (and hopefully automatically removed once the dialog is gone) or a BeforeLeaveObserver that is always triggered.

[Legioth]

Dunno what's more resource hungry
I can confirm that a per-component observer is less resource hungry since it is indeed only active while that particular component is attached.

In either case, you can use either AfterNavigationObserver or BeforeLeaveObserver for this purpose. Out of those, there isn't a very big difference but AfterNavigationObserver is in theory slightly more performant since it won't be triggered in cases when something else caused the navigation to be canceled.