Promise-settimeout-setinterval interceptor for devtool

async-devtool.js

      const initDevToolCode = () => {
        const devToolSignalName = 'DEVTOOL_ASYNC_MONITOR__ASYNC_STATUS_CHANGE';
        const getNameId = (customName) => customName || `${(Math.random() + 1).toString(36).substring(7)}-${+ new Date()}`;

        // PubSub outside our app
        var eventPool = (function() {
          var topics = {};
          var hOp = topics.hasOwnProperty;

          return {
            subscribe: function(topicName, callbackListener) {
              //   Create the topic's object if not yet created
              if (!hOp.call(topics, topicName))
                topics[topicName] = [];
              // Add the listener to queue
              var index = topics[topicName].push(callbackListener) - 1;
              // Provide handle back for removal of topic
              return {
                remove: function() {
                  delete topics[topicName][index];
                },
              };
            },
            publish: function(topicName, info) {
              // If the topic doesn't exist, or there's no listeners in queue, just leave
              if (!hOp.call(topics, topicName))
                return;
              // Cycle through topics queue, fire!
              topics[topicName].forEach(function(item) {
                item(info !== undefined ? info : {});
              });
            },
          };
        })();
        window.eventPool = eventPool;

        // This section is for Promise
        (function(w) {
          var oldPromise = window.Promise;

          function SubPromise(executor, customName) {
            var promise = new oldPromise(executor);
            const nameID = getNameId(customName);

            window.eventPool.publish(devToolSignalName, {
              name: nameID,
              status: 'Pending',
              context: 'promise'
            });

            var result = promise.then((v) => {
              window.eventPool.publish(devToolSignalName, {
                name: nameID,
                status: 'Fulfilled',
                context: 'promise'
              });
              return v;
            }, (e) => {
              window.eventPool.publish(devToolSignalName, {
                name: nameID,
                status: 'Rejected',
                context: 'promise'
              });
              throw e;
            });

            return result
          }

          w.Promise = SubPromise;
        }(window));

        // This section is for SetTimeout and SetInterval
        (function(w) {
          var oldST = w.setTimeout;
          var oldSI = w.setInterval;
          var oldCI = w.clearInterval;
          var oldCT = w.clearTimeout;
          var timers = [];

          w.setTimeout = function(fn, delay, customName) {
            var id = oldST(fn, delay);
            timers.push(id);

            const nameID = getNameId(customName);
            window.eventPool.publish(devToolSignalName, {
              name: nameID,
              status: 'Pending',
              context: 'settimeout',
              id,
              delay
            });

            return id;
          };
          w.setInterval = function(fn, delay, customName) {
            var id = oldSI(fn, delay);
            timers.push(id);

            const nameID = getNameId(customName);
            window.eventPool.publish(devToolSignalName, {
              name: nameID,
              status: 'Pending',
              context: 'setinterval',
              id,
              delay
            });

            return id;
          };
          w.clearInterval = function(id) {
            oldCI(id);
            removeTimer(id);

            window.eventPool.publish(devToolSignalName, {
              status: 'Cleared',
              context: 'setinterval',
              id
            });
          };
          w.clearTimeout = function(id) {
            oldCT(id);
            removeTimer(id);

            window.eventPool.publish(devToolSignalName, {
              status: 'Cleared',
              context: 'settimeout',
              id
            });
          };

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