Skip to content

Router links in menu bar function inconsistently if placed in root vs submenu #1440

@theshoeshiner

Description

@theshoeshiner

When using AppLayout, I have added MenuBar to the top nav area, and embedded RouterLinks into the menu bar. When clicking a router link that was added directly to the MenuBar (not a submenu) the entire page refreshes and creates a new UI instance. If I add the exact same RouterLink to a Sub menu, the router link functions correctly.

It seems like this may be related to other issues concerning refreshes and new UI instances, but those seem to more related to the PreserveOnRefresh functionality, not anything related to MenuBar, and they are seeing fairly consistent results, whereas with this the result is dependent on the MenuBar.

menuBar = new MenuBar();
//This home link causes a full refresh and new UI
MenuItem home = addMenuElement(menuBar,HomeView.class, "Home");
MenuItem admin = addMenuElement(menuBar,null, "Administration");
//This sub menu router link functions correctly and just loads the new View
addMenuElement( admin.getSubMenu(), RolesView.class, "Roles");
...
private MenuItem addMenuElement(HasMenuItems sub,Class<? extends Component> navigationTarget,String name) {
   	 MenuItem mi;
   	 if(navigationTarget != null) {
   		 RouterLink rl = new RouterLink(name, navigationTarget);
   		rl.addClassName("router-link");
   		mi = sub.addItem(rl, null);
   	 }
   	 else {
   		 mi = sub.addItem(name, click -> { });

   	 }
           return mi;
       }

I would expect both router links to function the same.

Versions:

- Vaadin / Flow version: 14.2.2
- Java version: 8
- OS version: Windows 10
- Browser version (if applicable): Chrome 83
- Application Server (if applicable): Tomcat
- IDE (if applicable): Eclipse + STS

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions