Disabling context menu with mf.menuItems = [] does not work on mobile

[gunnarmein-ts]

Description

mf.menuItems = [] works fine on a laptop, but on mobile (in a simulator and on the device), the menu appears anyway.

Steps to Reproduce

load attached test.html in mobile iOS browser (simulator will be fine), context menu was disabled by mf.menuItems = []; press and hold any part of mathfield

Actual Behavior

context menu appears

Expected Behavior

Nothing should happen (as is the case on non-mobile)

Environment

mathlive 0.98.6 iOS Safari, latest version

[gunnarmein-ts]

@arnog Seems like this could be fixed by changing

// If no items visible, don't show anything if (!menu.visible) return false;

to

// If no items visible, don't show anything if (!menu.visible || !menu.menuItems?.length) return false;

at the end of src/ui/menu/context-menu.ts (around line 83 in my fork)

[arnog]

The .visible accessor should already return false if there are no menu items:

  get visible(): boolean {
    this.updateIfDirty();
    return this._menuItems.some((x) => x.type !== 'divider' && x.visible);
  }

[gunnarmein-ts]

Don't know what to tell you. Try the test case I attached above on a phone. Perhaps _menuItems is not updated correctly when menuItems is empty.

[arnog]

FYI, I don't see an attached test.html.

[gunnarmein-ts]

test.html.zip Apologies, that must not have worked.

[arnog]

It's a script execution/timing issue. The <script> tag on line 29 is executed before the <script> on line 6 which has a defer attribute. Note that this may or may not be the case depending on the browser, environment, etc... since the defer attribute is not prescriptive.

When the line 36 mf.menuItems = [] is executed, the mf has not yet been converted to a MathfieldElement. So, the menuItems attribute get set, but it has no effect since the base HTMLElement doesn't know what to do with it. Later, when this element is upgraded to a MathfieldElement instance, the menu is reset to the default.

To avoid this issue, listen for a mount event from the mathfield element. When this event is dispatched, the mathfield is ready to be configured. Set the menuItems property in the handler of that event.

[gunnarmein-ts]

Duh! I should have known better. Thanks!

[arnog]

Closing.