Просмотр всех таймаутов / интервалов в javascript?

88

Я пишу приложение, которое использует тайм-ауты и интервалы JavaScript для обновления страницы. Есть ли способ узнать, сколько интервалов установлено? Я хочу убедиться, что случайно не убью браузер, настроив сотни интервалов.

Это вообще проблема?

Омар Кухеджи
источник

Ответы:

77

Я не думаю , что есть способ перечислить активные таймеры, но вы можете переопределить window.setTimeoutи window.clearTimeoutзаменить их своими реализациями , которые делают некоторый трекинг , а затем вызвать оригиналы.

window.originalSetTimeout = window.setTimeout;
window.originalClearTimeout = window.clearTimeout;
window.activeTimers = 0;

window.setTimeout = function(func, delay) {
    window.activeTimers++;
    return window.originalSetTimeout(func, delay);
};

window.clearTimeout = function(timerID) {
    window.activeTimers--;
    window.originalClearTimeout(timerID);
};

Конечно, вы можете не всегда звонить clearTimeout, но это, по крайней мере, даст вам способ отслеживать, что происходит во время выполнения.

Пол Диксон
источник
3
Я использовал это в каком-то коде сегодня, но мне нужно activeTimersбыло уменьшить, когда clearTimeoutон не был вызван. Этого легко добиться, заменив вторую строчку на window.setTimeoutэто: return window.originalSetTimeout(function() {func(); activeTimers--;},delay);
Рик Хичкок
2
Этот ответ больше не будет работать, поскольку функции JavaScript, связанные с DOM, будут «неизменяемыми».
John Greene
29

Я сделал расширение Chrome DevTools, которое показывает все интервалы. Очищенные отображаются серым цветом.

Расширение Timers Chrome Devtool

setInterval-сниффер

NVI
источник
10
К сожалению, это перестало работать с Chrome.
Джозеф Леннокс,
@JosephLennox Эта альтернатива работает, только что протестировано: chrome.google.com/webstore/detail/timeouts-and-intervals/…
Тревер Томпсон
@TreverThompson, это тоже не работает.
SeyyedKhandon
11

Поскольку Пол охватил только setTimeout, я решил поделиться счетчиком для setInterval / clearInterval.

window.originalSetInterval = window.setInterval;
window.originalClearInterval = window.clearInterval;
window.activeIntervals = 0;
window.setInterval = function (func, delay)
{
    if(func && delay){
            window.activeIntervals++;
    }
    return window.originalSetInterval(func,delay);
};
window.clearInterval = function (intervalId)
{
    // JQuery sometimes hands in true which doesn't count
    if(intervalId !== true){
        window.activeIntervals--;
    }
    return window.originalClearInterval(intervalId);
};
crv
источник
9

Вместо того, чтобы просто подсчитывать таймеры, вот реализация, которая хранит все таймеры в массиве. Он показывает только активные таймеры, в то время как принятый ответ учитывает только звонки на setTimeout& clearTimeout.

(function(w) {
    var oldST = w.setTimeout;
    var oldSI = w.setInterval;
    var oldCI = w.clearInterval;
    var timers = [];
    w.timers = timers;
    w.setTimeout = function(fn, delay) {
        var id = oldST(function() {
            fn && fn();
            removeTimer(id);
        }, delay);
        timers.push(id);
        return id;
    };
    w.setInterval = function(fn, delay) {
        var id = oldSI(fn, delay);
        timers.push(id);
        return id;
    };
    w.clearInterval = function(id) {
        oldCI(id);
        removeTimer(id);
    };
    w.clearTimeout = w.clearInterval;

    function removeTimer(id) {
        var index = timers.indexOf(id);
        if (index >= 0)
            timers.splice(index, 1);
    }
}(window));

Вот как вы можете узнать количество активных таймеров на странице:

timers.length;

Вот как вы можете удалить все активные таймеры :

for(var i = timers.length; i--;)
    clearInterval(timers[i]);

Известные ограничения:

  • Вы можете передать только функцию (а не строку) setTimeoutс этим патчем обезьяны.
  • Функция предполагает clearIntervalи clearTimeoutделает то же самое, что и они, но это может измениться в будущем.
A1rPun
источник
Можно ли получить имя всего запущенного SetIntervals? Например, var timer = setInterval(function () { }мне нужен таймер вместо подсчета интервалов бега.
Йогеш Патель
Не то, чтобы я знал, я бы предложил хотя бы глобальный поиск с ключевым словом "setInterval" и / или "setTimeout"
Карлес Алколеа
4

Мы только что опубликовали пакет, решающий именно эту проблему.

npm install time-events-manager

При этом вы можете просматривать и управлять ими через timeoutCollectionобъект (и интервалы javascript через intervalCollectionобъект).

timeoutCollection.getScheduled(); timeoutCollection.getCompleted(); timeoutCollection.getAll();

Зив Полоцк
источник
2
Я думаю, что OP и большинство людей искали что-то, что можно было бы ввести в консоли браузера в качестве первого PoC или, возможно, позже в виде расширения. Как можно было бы поместить это в консоль из информации, которую вы дали?
Carles Alcolea
1

Мне просто нужно было что-то вроде этого, и вот что я собрал:

window.setInterval = function (window, setInterval) {
  if (!window.timers) {
    window.timers = {};
  }
  if (!window.timers.intervals) {
    window.timers.intervals = {};
  }
  if (!window.timers.intervals.active) {
    window.timers.intervals.active = {};
  }
  return function (func, interval) {
    var id = setInterval(func, interval);
    window.timers.intervals.active[id] = func;
    return id;
  }
}(window, window.setInterval);

window.clearInterval = function (window, clearInterval) {
  if (!window.timers) {
    window.timers = {};
  }
  if (!window.timers.intervals) {
    window.timers.intervals = {};
  }
  if (!window.timers.intervals.inactive) {
    window.timers.intervals.inactive = {};
  }
  return function (id) {
    if (window.timers.intervals.active && window.timers.intervals.active[id]) {
      window.timers.intervals.inactive[id] = window.timers.intervals.active[id];
      clearInterval(id);
      delete window.timers.intervals.active[id];
    }
  }
}(window, window.clearInterval);

Это записывает интервал ids вместе с их функциями, а также отслеживает их статус ( active/ inactive).

акинури
источник