How to find JavaScript code that is waiting on promise

Question

We have a rather complex asynchronous system in JavaScript. All functions in the JavaScript library are designed to be asynchronous. We mainly use the AngularJS deferred objects and some parts use the jQuery (we don't intermingle them though - i.e. Angular code waits on Angular deferred promises).

The problem that we are coming across is that the code appears to "hang" on start-up, 2 out of 5 times. There looks like there is a problem when the JS code is cached and the timing of the promise resolutions.

There doesn't seem to be any tools or anything that can point to what the offending code is waiting on when a hang occurs.

How do you find JavaScript code that is waiting on a promise?

Thanks.

Answer 1

So the error actually ended up being not related to promises but timing of dependency loading. We are using LAB.js as the file loader. LAB.js supports a "chain" loading mechanism of JavaScript dependencies.

What was happening is that there were 2 chains that we had not released were related to each other. Both chains where being loaded asynchronously and thus, at the point of running the JavaScript files, there was an opportunity to attempt use an object that was not loaded.

What compounded the issue was the Angular.js 1.2.13 failed quietly in this scenario. An exception occurred during the loading of Angular services and the exception never propagated to higher level code nor was there any debug to say it had hit an exception:

function getService(serviceName) {
  if (cache.hasOwnProperty(serviceName)) {
    if (cache[serviceName] === INSTANTIATING) {
      throw $injectorMinErr('cdep', 'Circular dependency found: {0}', path.join(' <- '));
    }
    return cache[serviceName];
  } else {
    try {
      path.unshift(serviceName);
      cache[serviceName] = INSTANTIATING;
      return cache[serviceName] = factory(serviceName);
    } catch (err) {
      if (cache[serviceName] === INSTANTIATING) {
        delete cache[serviceName];
      }
      throw err;
    } finally {
      path.shift();
    }
  }
}

The throw err above did not get through to the browser and was caught somewhere in the system and "ignored".

Once we had found the exception, it was quite easy to track the chain loading issue.