Is there some way to get notified when the cursor moves from one node to another?

[gregveres]

I am trying to build a UI using vuetify around Tiptap. One thing I am having problems with is that my menubar isn't getting updated when the cursor is moved, say in and out of a bold node or a table node.

Is there someway to have my menubar code watch for changes on the selection? I already have an onUpdate handler that is updating the content variable that was passed into my editor component.

Most of my menus use isActive.bold() or something like that. But it seems to be evaluated once and not every time the state updates.

Any suggestions?

[gregveres]

BTW, I found that the problem is the bug where editor-menu stopped updating. Things started working better when I switched from editor-menu to editor-menu-bubble.

Also, I have found that in my bubble menu vue, I need to look at the selected node to see which type of bubble menu to show. I just can't get vue to call a function when the selection changes. So what I did was on the div that wraps the bubble menu, I have vue call a function to generate the class to display. During that function I do the logic that looks at the selection and changes the menu type.

This is the only way I could figure out how to determine that selection has changed.

[richstandbrook]

I'm having the same trouble implementing with AlpineJS. Initial load shows the state of the first node and any time I make a change (bold, headings etc.) then my toolbar is updated, but not when navigating around the nodes and making selections

[hanspagel]

I don't know what’s the best way to do this in Alpine, but this workaround should force Alpine to rerender when the selection is updated:
8d5e6de

[richstandbrook]

That's solved it for now, thanks @hanspagel