I have added an event listener for mousemove
that triggers a function. For some reason, it is not getting triggered in Chrome. I can tell because I'm writing to the console during testing. The keyup
eventlistener
and the scroll
eventlistener
both trigger, but the mousemove
does not in Chrome. It works fine in Safari and FireFox. Here is my code:
document.body.addEventListener("mousemove", RenewTimeoutTime);
document.body.addEventListener("keyup", RenewTimeoutTime);
document.body.addEventListener("scroll", RenewTimeoutTime);
And the function it triggers:
function RenewTimeoutTime(){
var pageName = window.location.href;
var currentTime = new Date();
localStorage.setItem("inTimeout", false);
localStorage.setItem("AI_Timeout_Time", currentTime.getTime() + 270000;
console.log(localStorage.getItem("AI_Timeout_Time"));
}
I have added an event listener for mousemove
that triggers a function. For some reason, it is not getting triggered in Chrome. I can tell because I'm writing to the console during testing. The keyup
eventlistener
and the scroll
eventlistener
both trigger, but the mousemove
does not in Chrome. It works fine in Safari and FireFox. Here is my code:
document.body.addEventListener("mousemove", RenewTimeoutTime);
document.body.addEventListener("keyup", RenewTimeoutTime);
document.body.addEventListener("scroll", RenewTimeoutTime);
And the function it triggers:
function RenewTimeoutTime(){
var pageName = window.location.href;
var currentTime = new Date();
localStorage.setItem("inTimeout", false);
localStorage.setItem("AI_Timeout_Time", currentTime.getTime() + 270000;
console.log(localStorage.getItem("AI_Timeout_Time"));
}
Share
Improve this question
edited Apr 9, 2021 at 10:34
Brian Tompsett - 汤莱恩
5,89372 gold badges61 silver badges133 bronze badges
asked Jul 13, 2016 at 13:09
npaynenpayne
1191 silver badge7 bronze badges
7
|
Show 2 more comments
5 Answers
Reset to default 6I know this is an old post but I ran into the same issue mentioned and realized what was causing the issue in my case.
If you are using Chrome's developer tools and have the Device Toolbar toggled on, the console will not log the mousemove events if the console is open. If you close the console while the Device Toolbar is toggled on and move your mouse, the mousemove events will log.
If you toggle the Device Toobar off, you should see the events logging in the console.
The shortcut for toggling the Device Toolbar on a Windows PC is Control + Shift + M. I imagine it's Command + Shift + M on a Mac but don't quote me.
enter image description here
It does work, you just have to check if the DOM is loaded first.
Replace the current script with
<script>
document.addEventListener('DOMContentLoaded', addListen, false); //this is the important bit
function addListen(){
document.body.addEventListener("keyup", RenewTimeoutTime);
document.body.addEventListener("scroll", RenewTimeoutTime);
document.body.addEventListener("mousemove", RenewTimeoutTime);
}
function RenewTimeoutTime(){
var pageName = window.location.href;
var currentTime = new Date();
var time = currentTime.getTime(); //i replaced the time just to be neat
localStorage.setItem("inTimeout", false);
localStorage.setItem("AI_Timeout_Time", time + 270000);
console.log(localStorage.getItem("AI_Timeout_Time"));
}
</script>
Then you should be good to go. Live here
The issue seems to be that "mousemove" events are fired infrequently (only on canvas clicks) when the console is open. If the console is closed, they are fired continuously, when the mouse is moved around the screen.
turn off the device toolbar, upper left side of the chrome devtool, ctrl+shift+m
Thank you all for your input. I didn't post the HTML because I didn't think it was necessary. The web app is quite involved so I left it out. Long story short, if I watch the console while I move the mouse, the mouse movement doesn't get logged in the console. Clicking will trigger the mousemove event, and the scroll and keyup events do log in the console, but the mousemove does not. I found out by closing the console, moving my mouse around, and then viewing the console. Voila! The mousemove was logged.
I changed my code for easier debugging just during testing.
window.addEventListener("mousemove", function(){console.log("mouse move");});
window.addEventListener("keyup", function(){console.log("keyup");});
window.addEventListener("scroll", function(){console.log("scroll");});
If anyone knows why the console would not log the mousemove while I'm using the developer tools, please let me know.
)
inlocalStorage.setItem("AI_Timeout_Time", currentTime.getTime() + 270000;
Check this JSFIDDLE – brk Commented Jul 13, 2016 at 13:14scroll
andkeyup
events wouldn't work as well if that was a problem. – Alex M Commented Jul 13, 2016 at 13:19