Let's say, I have an array of promises, each element beign an AJAX call for an image (png) of a view.

const images = Promise.all(views.map(view => {
   return fetch(`/sites/${siteId}/views/${view.id}/image/`);
}));

Is there any possibility to check current status of promise resolution using Promise.all? If not, is there any other way?

For example, if 10 / 20 images were downloaded, I would like to give user a feedback, that we have downloaded 50% images for him.

Let's say, I have an array of promises, each element beign an AJAX call for an image (png) of a view.

const images = Promise.all(views.map(view => {
   return fetch(`/sites/${siteId}/views/${view.id}/image/`);
}));

Is there any possibility to check current status of promise resolution using Promise.all? If not, is there any other way?

For example, if 10 / 20 images were downloaded, I would like to give user a feedback, that we have downloaded 50% images for him.

• javascript
• arrays
• asynchronous
• promise

2 Answers 2

Just increment a variable whenever a promise resolves:

const promises = views.map(view => fetch (`/sites/${siteId}/views/${view.id}/image/`));
const images = Promise.all(promises);

let progress = 0;
promises.forEach(p => p.then(() => progress++));

setInterval(() => {
  console.log(progress / promises.length * 100 + "%");
}, 1000);

No need for using the setInterval. Only update the progress when it is updated.

const promises = views.map(view => fetch (`/sites/${siteId}/views/${view.id}/image/`));
const images = Promise.all(promises);

let progress = 0;
promises.forEach(p => p.then(() => {
  progress++;
  console.log(progress / promises.length * 100 + "%");
}));