Cannot react to list box selection used in a context menu

[Deleted user]

Description

I created a context menu via flow template as shown in example "Opening and Closing Events" (https://vaadin.com/components/vaadin-context-menu/html-examples#context-menu-advanced-demos).

Since the designer does not allows the linking of the context menu to the Java companion, I tried to link the listbox itself to react on selections with an value change listener.

As a result an exception occured (see attached log file).

log.txt

Request

Please allow either the access (i.e. injection) of sub elements of a template like this listbox per @id annotation or some kind of VaadinContextMenu component that allows some kind of reaction or access to the nested elements.

Versions

Vaadin 10, Beta 2

Relevant code fragments

<link rel="import" href="../../bower_components/vaadin-context-menu/src/vaadin-context-menu.html">
<link rel="import" href="../../bower_components/vaadin-list-box/vaadin-list-box.html">
<link rel="import" href="../../bower_components/vaadin-item/vaadin-item.html">
...
<vaadin-context-menu open-on="click" close-on="none" selector="vaadin-button">
	<template>
		<vaadin-list-box id="optionsList">
			<vaadin-item id="sendMailButton">Send mail</vaadin-item>
			<vaadin-item id="deleteUser">Delete user record</vaadin-item>
		</vaadin-list-box>
	</template>
	<vaadin-button aria-label="Additional options" theme="small" id="optionsButton">
		<iron-icon icon="vaadin:ellipsis-dots-h"></iron-icon>
	</vaadin-button>
</vaadin-context-menu>

@Id("optionsList")
private ListBox<Object> optionsList;

[Legioth]

Context menu is one of the Vaadin components for which there's not yet any Java API. Because of the way the content is configured in a <template>, Java support is not completely straightforward. Once implemented, we would probably have to use the same kind of workarounds as for <vaadin-dialog>, or alternatively hardcode for using <vaadin-list-box> and have a Renderer API for configuring <vaadin-item> contents.

Using @Id for elements inside an inner <template> is in general an "impossible" task because there's no way of knowing how such elements will be instantiated. As an example, <dom-repeat> will produce multiple copies of each template element. In-depth discussion on this issue can be found in vaadin/flow#2233.

I'm moving this issue to the Flow repository since it's not directly related to any defect or missing feature in the web component itself, and there isn't yet any vaadin-context-menu-flow repository for the Java API.

[Legioth]

Issue moved to vaadin/flow #3706 via ZenHub

[web-padawan]

Closing per above comment.