Simulating a menu click

[marcio]

Hey henrique,

We have https://bryntum.com/products/grid/docs/api/Core/widget/MenuItem#config-closeParent that you need to set to false on MenuItem to avoid closing the menu after clicking.

[henrique]

Thanks for the reply!

New problem now when a menu item has a menu configuration, the submenu is showed in the top of the browser, like the image below:

Screenshot_8.png (68.3 KiB) Viewed 145 times

The sample code:

import { Grid, DataGenerator, Menu, Button, MenuItem } from '../../build/grid.module.js?474079';
import shared from '../_shared/shared.module.js?474079';

const menu = new Menu({
    items    : [
        {
            icon : 'b-fw-icon b-icon-add',
            text : 'Add'
        },
        {
            icon : 'b-fw-icon b-icon-trash',
            text : 'Remove'
        },
        {
            icon     : 'b-fw-icon b-icon-lock',
            disabled : true,
            text     : 'I am disabled'
        },
        {
            text : 'Sub menu',
            menu : [{
                icon : 'b-fw-icon b-fa-play',
                text : 'Play'
            }]
        }
    ],
    // Method is called for all ancestor levels
    onItem({ item }) {
        Toast.show('You clicked ' + item.text);
    }
});

let SubMenu = new MenuItem({
    text: 'Menu Item',
closeParent: false, 
    onItem: () => { console.log('Submenu clicked') }
});

let SubMenu2 = new MenuItem({
    text: 'Menu Item 2',
closeParent: false, 
    onItem: () => { console.log('Submenu clicked 2') }
});

let SubMenu3 = new MenuItem({
    text: 'Menu Item 3',
closeParent: false, 
menu: menu,
    onItem: () => { console.log('Submenu clicked 3') }
});

let MainMenu = new Menu({
    appendTo: 'container',
    floating: false,
    maxWidth: '150px',
    onItem: () => { console.log('Clicked') },
    items: [
        SubMenu, SubMenu2, SubMenu3
    ]
});

[mats]

Let's rewind a bit, this is just for testing purposes? What's preventing you from testing the menu as it is? Which testing framework are you using? Should work perfectly fine to test the menu as is (we do upon every commit).

[Animal]

Why are you instantiating? There’s really no point. Just use nested configuration.

[henrique]

Let's rewind a bit, this is just for testing purposes? What's preventing you from testing the menu as it is? Which testing framework are you using? Should work perfectly fine to test the menu as is (we do upon every commit).

I'm trying to simulate the click of the menu, but when I call the "DoAction" give the execution error that I posted in the beginning of this discussion.

I'm not using any test framework, I just creating my test framework.

[henrique]

Why are you instantiating? There’s really no point. Just use nested configuration.

The menu is generated differently if I use the configuration item instated of the object instance?

[henrique]

Hello?

[marcio]

Hey henrique,

Using the object instance renders correctly, I tested it here. I created a ticket to fix that, as it should accept a Menu instance. https://github.com/bryntum/support/issues/8666

For now, as a workaround, you should keep with the configuration object approach.