Advanced JavaScript and Testing

Disney+Hotstar's playback team fetches manifests for several video quality levels in parallel before starting playback, and caches each one so a later request for the same quality is instant. A teammate's implementation below intermittently returns an empty result list, and duplicate network requests show up in the logs for the same video quality fired moments apart.

let cache = {};

function fetchManifest(quality) {
  return fetch(`/manifests/${quality}.json`).then((res) => res.json());
}

function loadVideoManifests(qualities) {
  const promises = qualities.map((quality) => {
    if (cache[quality]) {
      return cache[quality];
    }
    const promise = fetchManifest(quality)
      .then((data) => {
        cache[quality] = data;
        return data;
      })
      .catch((err) => {
        console.log('manifest failed');
      });
    logFetchStart(quality);
  });

  return Promise.all(promises).then((results) => {
    return results.filter((r) => r !== undefined);
  });
}

function logFetchStart(quality) {
  return fetchAnalytics(quality).then(() => true);
}

Explain what is wrong with how this code handles promises and caching, and describe the unit tests you would write to catch each issue before it reached production.