0
192
ViewsWhy does the click event of JavaScript not working?
I got this link from a friend of mine for testing my reaction time. https://www.arealme.com/reaction-test/en/
This is a game where a red circle will appear and after random time it will turn green. I need to click as soon as it turns green. That is my reaction time.
With real reaction, my best score is 178, in case you don't believe I have attached ss 
I know I can edit this 178 to any number I want. But I wanted to create a script that generated the click event as soon as the green circle appears.
I have planned to call the below function with setInterval
const clickCircle = (className)=> {
let greenCircles = document.getElementsByClassName(className);
if(greenCircles && greenCircles.length){
greenCircles[0].click();
}else{
console.log("No circles found with name ", className)
}
}
clickCircle("tfny-circleGreen");
The name of the class containing the green circle is tfny-circleGreen. So calling clickCircle("tfny-circleGreen") should generate a click event. But it's not.
What am I missing?
Maybe they have overridden the click function. If that's the case, how do I restore it?
Please don't ask why I want this, it's just I wanted to try it this way for fun.
1 answers
Answer question0
function triggerMouseEvent (node, eventType) {
var clickEvent = document.createEvent ('MouseEvents');
clickEvent.initEvent (eventType, true, true);
node.dispatchEvent (clickEvent);
}
const clickCircle = (className)=> {
let greenCircles = document.getElementsByClassName(className);
if(greenCircles && greenCircles.length){
triggerMouseEvent (greenCircles[0], "mouseover");
triggerMouseEvent (greenCircles[0], "mousedown");
triggerMouseEvent (greenCircles[0], "mouseup");
triggerMouseEvent(greenCircles[0], "click");
}else{
console.log("No circles found with name ", className)
}
}
setInterval(()=> {
clickCircle("tfny-circleGreen");
}, 10)This is the complete code that works :D
The click() function was not working so I had to simulate it.