Flow tabs valuechangelistener

I need to add some tabs in my form. I use <vaadin-tabs id="vaadinTabs"> template and

public class IdMappedTabs extends Component {

	public IdMappedTabs() {

	public Registration addSelectionListener(PropertyChangeListener listener) {
		return getElement().addPropertyChangeListener("selected", listener);

	public void setSelectedTabIndex(int index) {
		getElement().setProperty("selected", index);


on my server side.
Is the tabs component coupled to the tag in the template automatically? I can’t figure out how to add a ‘valuechangelistener’ to the component to switch between tabs.

I used tab.setSelected(true) and it works 50%, means it switches automatically to the one we want but if you click on some other tab, it won’t work unless you click on the selected tab.

@Srinivasa Can u show ur code pls?

Here is the code and issue I’m facing

I’m using template with id’s.

<vaadin-tabs theme="equal-width-tabs" id="vaadinTabs">
   <vaadin-tab id="com-voy"></vaadin-tab>
   <vaadin-tab id="com-voy-off"></vaadin-tab>
   <vaadin-tab id="off-hire-ent"></vaadin-tab>
   <vaadin-tab id="off-hire-two"></vaadin-tab>
   <vaadin-tab id="layover"></vaadin-tab>