Thursday, February 9, 2023

How do I Refresh on page Focus - Web Development | How to refresh page after focus on browser tab

I would like to refresh a page after it got back into the focus
The tricky part is how do I determine when to refresh? Because ta may get focused many times in it's lifecycle.

First the window has to loose the focus (which could be determined through .blur() I assume and hope will work this way).

Only after the window which lost focus gets back into focus should trigger the refresh of itself and thats it.
In my development environment I added below snippet of JavaScript to the expected page - whenever the page becomes active after becoming inactive it reloads automatically, so for example if you type in your text editor then click back onto your browser the page will reload once without an infinite loop. It also works when chaining active tab or active window within the same browser session will occur.
var blurred = false;
window.onblur = function() { blurred = true; };
window.onfocus = function() { blurred && (location.reload()); };

No comments:

Post a Comment