Im building a bookmarklet to automatically perform actions on my browser. The site im trying to make this work with (i dont control the site’s source code) has some elements that change when hovering with the mouse (or pointer) and im trying to trigger that state change.

The main problem (i think) is that the site is based on reactjs, so it has its own set of handlers.

I have tried multiple approaches to programmatically trigger the hover event , but nothing has worked so far:

• Forcing changing the state of the browser (with Force state -> hover)
• Creating a custom Event, then dispatching it.

When monitoring the events on the site, even filtering I cant seem to be able to find which element is actually triggering the event (the site has a heavily nested react DOM as all react sites do).