How to perform mouseover event or hover on browser clickpath synthetic monitor

Mareeswaran · ‎12 Apr 2023

Summary: Sometimes, a page requires you to hover over or mouse over an element rather than clicking on it. This can be done in Dynatrace Synthetic using a JavaScript event.

Steps to perform a mouseover event in a Browser clickpath

Go to the relevant page in a Chrome browser.
Right-click on the element that you want to interact with on the page-> Inspect the element, which will open the developer tools
Right-click on the element in the Web Developer Tools -> Copy -> Copy JS path

Paste the JS path in the below element value, and add this JavaScript code into the JavaScript Event of your Browser clickpath monitor.

function triggerevent(element) 
{
var evt = document.createEvent("MouseEvent");
evt.initMouseEvent("mouseover",true, true);
element.dispatchEvent(evt);
}

var element = document.querySelector('button[id="testid"]'); //Replace with the element which you want to perform the mouseover action.
triggerevent(element);