Rafał Bagrowski
Rafał Bagrowski

Reputation: 243

JavaScript Promise.all - how to check resolve status?

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.

Upvotes: 10

Views: 4003

Answers (2)

Orhun Alp Oral
Orhun Alp Oral

Reputation: 754

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 + "%");
}));

Upvotes: 6

Jonas Wilms
Jonas Wilms

Reputation: 138257

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);

Upvotes: 12

Related Questions