Vaadin TestBench MenuBarElement - Not able to Select sub-menus with Integration Test

Question

I am implementing Vaadin Integration Test Case for the Menu Item as shown below

 MenuBar.MenuItem homeMenu = menuItem.addItem("Home", null, null);
        homeMenu.addItem("Dashboard", homeMenuCommand);
        homeMenu.addItem("UserForm", homeMenuCommand);

        MenuBar.MenuItem studentsAdmissionYear = menuItem.addItem("Admission Year", null, null);
        studentsAdmissionYear.addItem("2018", myCommand);
        studentsAdmissionYear.addItem("2019", myCommand);
        studentsAdmissionYear.addItem("2020", myCommand);
        studentsAdmissionYear.addItem("2021", myCommand);
        studentsAdmissionYear.addItem("2022", myCommand);

And my Test Class is

package org.example;


import com.vaadin.testbench.TestBenchTestCase;
import com.vaadin.testbench.elements.*;
import org.junit.After;
import org.junit.Before;
import org.junit.Test;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

    import java.net.MalformedURLException;
    import java.net.URL;
    
    import static org.junit.Assert.assertEquals;
    
    public class ApplicationFullIT extends TestBenchTestCase {

    WebDriver webDriver;

    @Before
    public void setUp() throws Exception {
        setDriver(new ChromeDriver());
        getDriver().get("http://localhost:8082/");
    }

    @Test
    public void testMenu() throws MalformedURLException {
        URL userFormUrl = new URL("http://localhost:8082/#!UserForm");
        MenuBarElement menuBarElement = $(MenuBarElement.class).first();
        menuBarElement.clickItem("Home","UserForm");

      //  assertEquals(getDriver().getCurrentUrl(),userFormUrl);
    }

    @After
    public void tearDown(){
        getDriver().quit();
    }
}

The code

**MenuBarElement menuBarElement = $(MenuBarElement.class).first();
            menuBarElement.clickItem("Home","UserForm");**

works till selection of Home menu but not working with the sub menu "UserForm"

Can you please help with a solution? I tried all possible solutions available by Googling but it is not helping me.

Answer 1

One approach to get deeper in how TestBench tests are created is to study the integration tests of the Vaadin Framework themselves. For example here is link to the MebuBar's integration test

https://github.com/vaadin/framework/blob/master/uitest/src/test/java/com/vaadin/tests/components/menubar/MenuBarIconsTest.java

There you see, that there are basically three ways to find menu item

From Vaadin 8.12.1 onwards you can set id for you MenuBar in your java code, and you can find the menu item by using id and index number (item index in order of creation)

findElement(By.id("fontIcon-4"))

Or by class name, nth occurrence

findElements(By.className("v-menubar-menuitem")).get(4);

Or caption text if the captions are unique

findElement(By.vaadin("#Sub item"))

Answer 2

I tried your example (I assume menuItem is a MenuBar) and there's nothing fundamentally wrong with it as far as I can tell. I'm afraid clickElement can be a bit flaky in some circumstances, though, and they are usually very minor timing issues.

You could try clicking the items one at a time rather than in a group, and if that doesn't do the trick either, add a small delay between each call.

Likewise if you are trying to call several menu paths in a row, a small delay or e.g. moving focus to some completely different element (e.g. a Label) after each selection that triggers a command can stabilize the test. Especially if your commands happen to be heavy.