I'm trying to create an automated program by using javascript console only. I need to use setInterval to make a loop for my program. The relevant part of the code is just like this:

refreshIntervalId=setInterval(tick,500);

So the "tick" function will be recalled every 500 milliseconds.

But the problem is whenever the browser tab is being inactive i.e I minimize it to do something else, the setInterval stop working. When I open the browser again it suddenly repeated so many times to "pensate" for the time the fucntion had not been executed. It is not what I am expected.

I've heard that web workers can solve the problem. I just need one (or two) single code line to work via web workers but since I'm an amateur to IT, I cannot understand all of them. I can only access the browser via JS console and I don't have the access to both HTML and its scripts.

My main goal is to make it loop and break it (setInterval and clearInterval) normally while the browser can still in the inactive mode.

What should I do now? Thank you for reading and hopefully someone can help me solve it!

I'm trying to create an automated program by using javascript console only. I need to use setInterval to make a loop for my program. The relevant part of the code is just like this:

refreshIntervalId=setInterval(tick,500);

So the "tick" function will be recalled every 500 milliseconds.

But the problem is whenever the browser tab is being inactive i.e I minimize it to do something else, the setInterval stop working. When I open the browser again it suddenly repeated so many times to "pensate" for the time the fucntion had not been executed. It is not what I am expected.

I've heard that web workers can solve the problem. I just need one (or two) single code line to work via web workers but since I'm an amateur to IT, I cannot understand all of them. I can only access the browser via JS console and I don't have the access to both HTML and its scripts.

My main goal is to make it loop and break it (setInterval and clearInterval) normally while the browser can still in the inactive mode.

What should I do now? Thank you for reading and hopefully someone can help me solve it!

• javascript
• setinterval
• web-worker
• console.log
• clearinterval

• 1 Why do you think it's either necessary or appropriate for your code to be running when that tab is not open? – T.J. Crowder Commented Jul 14, 2016 at 12:15
• 1 See if this can help you stackoverflow./questions/5927284/… – Erick Gallani Commented Jul 14, 2016 at 12:23
• "I can only access the browser via JS console and I don't have the access to both HTML and its scripts." That doesn't make much sense. – T.J. Crowder Commented Jul 14, 2016 at 12:40
• Hi Crowder I have to make an automated program for clicking buttons on a website, even when I was typing a document or doing something else. What I mean by "access the browser via JS console" is that I can only write in Javascript console to make the program, I did not have access to the website HTML and its scripts so Web workers is a little bit hard. – Vũ Nguyễn Commented Jul 14, 2016 at 13:05
• Gallani: Thank you, I used the Hack Timer, it was great until the page refreshed itself. I don't know why but it would halted all the code. – Vũ Nguyễn Commented Jul 14, 2016 at 13:15

2 Answers 2

Okay, this might be a little late, but I hope this will be of some use anyway.

Put this code into your main JavaScript:

let intervalWorker = new Worker('worker.js');
intervalWorker.onmessage = /* Your function here */;

...and this could be an example for the code in a new file 'worker.js':

setInterval(() => {
    postMessage();
}, 500);

The worker will post an empty message to your main thread every 500ms. When that happens, your main thread will call the "onmessage" function on your worker. So just assign whatever you function you need to happen every 500ms to that property.

Note: You need to run this on a server for the JS to load the worker file - otherwise it will plain because of 'safety' reasons.

Excellent basic solutions above. If you wanna get more plex, this is part of my current WIP implementation (for some reason intervals only fire once, but timeouts are working great). This is inside the worker.js file.

onmessage = (e) => {
    //e.data is the data sent
    var data;
    if(typeof(e.data)=="string") {
        data = {
            mand:e.data
        };
    } else {
        data = e.data;
    }
    if(typeof(data.mand)=="undefined") {
        sendError("Invalid data received by workerTimeouts.js (no mand)",e.data);
        return;
    }

    switch(data.mand.toLowerCase()) {
        case "dump": {
            postMessage({
                clocks:clocks,
                mand:'dump'
            });
        }
        case "start": {
            if(typeof(data.name)=="undefined") {
                sendError("Invalid data received by workerTimeouts.js (name)",e.data);
                break;
            }
            if(typeof(data.duration)=="undefined") {
                sendError("Invalid data received by workerTimeouts.js (duration)",e.data);
                break;
            }
            if(typeof(data.type)=="undefined") {
                data.type = "timeout";
            }
            if(typeof(data.payload)=="undefined") {
                data.payload = null;
            }
            //start the timeout
            if (data.type.toLowerCase() == "timeout") {
                startTimeout(data.name,data.duration,data.payload);
            }
            if (data.type.toLowerCase() == "interval") {
                startInterval(data.name,data.duration,data.payload);
            }
        } break;
        default: {
            sendError("Invalid mand received by workerTimeouts.js (mand)",e.data);
        }
    }
}

back in the main thread i do startTimer("keepalive",60000,keepalive,"timeout");

function startTimer(name,duration,callback,type="timeout",payload=null) {
    if(window.workerSupported) {
        //create callback
        window.timerCallbacks[name] = callback;
        //start timer
        window.workersBin.timers.postMessage({
            mand:'start',
            name:name,
            duration:duration,
            type:type,
            payload:payload
        });
    } else {
        if(type.toLocaleUpperCase()=="timeout") {
            setTimeout(()=>{callback(payload)},duration);
        }
        if(type.toLocaleUpperCase()=="interval") {
            setInterval(()=>{callback(payload)},duration);
        }
    }
}

there's some things missing here, like on page load i determine if the worker is supported or not so legacy browsers will still sort of work for my site (using setTimeout instead of the worker).

It sucks that intervals arent working for me as i have a background loop that i want on a 250ms interval, but i solve that by using a timer and then having bgLoop() end by starting a new timer for bgLoop(), which i prefer anyway as it prevents race conditions due to execution lag, especially if i'm doing Ajax in the loop.