maskedjellybean
maskedjellybean

Reputation: 719

setTimeout doesn't seem to work in Chrome

This setTimeout works perfectly in Firefox, but in Chrome nothing in function timeoutTrigger ever happens, including the alert. Any ideas?

var $this = $('.active-more');

function timeoutTrigger() {
    $this.closest(".container").nextAll(".container:first").find(".description:first").removeClass('hide');
    $this.closest(".container").nextAll(".container:first").find(".back:first").find("img.portfolio").remove();
    alert("is this thing on?");
}

setTimeout(function(){timeoutTrigger()},400)

Upvotes: 11

Views: 32548

Answers (3)

doraemon
doraemon

Reputation: 398

We had trouble with settimeout function on Chrome. We wanted to run a API check in every 10 seconds to update page content if there is change in data. But although we set settimeout function to run in every 10 seconds, Chrome does not run it correctly if browser is inactive. (While Safari runs the code correctly even if it is inactive).

Our experiment shows that Chrome runs our function about minutely or a little longer when it is inactive. So checking updates minutely does not broke our code.

But we had second function which runs every minutes and changes content locally every minutes. To be specific, we change waiting times and play times of games which we are showing in the page content. So as we can not depend on Chrome to run at exact minutes, our solution is to save when the code is run first time, and check the minutes passed between dates, and change the waiting times and playing times accordingly.

     var $first_run_time; 
     var $minutes_passed = 0;
     var $total_minutes_used = 0;
     var $interval = 10000; // 10 seconds

     $current_date = new Date();
     $first_run_time = $current_date;
     console.log('Timeout started '+ $current_date.toLocaleTimeString());
     setTimeout(my_refresh_function, $interval));

    function my_refresh_function() {
            setTimeout(my_refresh_function, $interval);
            $current_date = new Date();
            console.log('Refresh run: ' + $current_date.toLocaleTimeString());
             $minutes_passed_from_start = Math.floor((Math.abs($current_date - $first_run_time)/1000)/60);

            $minutes_passed = $minutes_passed_from_start - $total_minutes_used;
  if ( $minutes_passed > 0 ) {
    
           // Make the changes you want for passed minutes
           // for example increase play time $play_time += $minutes_passed
           // and reduce waiting times $waiting_time -=  $minutes_passed
            console.log('Minutes updated +- '+ $minutes_passed + ' mins, at: ' + $current_date.toLocaleTimeString());

    $total_minutes_used += $minutes_passed;

      }
     }

Upvotes: 0

Mike G
Mike G

Reputation: 456

Google has changed the Content Security Policy which impacts using setTimeout() in some browsers. Please read: https://developer.chrome.com/extensions/contentSecurityPolicy

Upvotes: 0

Shrey Gupta
Shrey Gupta

Reputation: 5617

Switch your setTimeout statement to the following: setTimeout(timeoutTrigger,400); The one you wrote is for when the function you're calling has a parameter. Also, you're missing a semicolon.

Upvotes: 9

Related Questions