Why am I getting Promise { } when using fetch in Promise.all?

Question

This works fine:

....
.then(() => fetch(link, { headers: {"Content-Type": "application/json; charset=utf-8"} }))
  .then( res =>  res.json())
  .then((response)=>{
    console.log(util.inspect(response, {showHidden: true, depth: null, colors: true}));
  })

But whenI try to combine the fetch with another promise:

let dbconnect = require('mongodb').MongoClient.connect("mongodb://localhost:27017/mydb", { useNewUrlParser: true } ),
    call = fetch(link, { headers: {"Content-Type": "application/json; charset=utf-8"} });


Promise.all( [dbconnect, call] )
  .then( res => [res[0], res[1].json()])
  .then( res => {
    database = res[0];
    sales = res[1];
    console.log(util.inspect(res[1], {showHidden: true, depth: null, colors: true}));
  })

I get Promise { <pending> } as the output, it seems as though the Promise.all get run before call() is completed

You don't actually *resolve* the promise of the JSON, you just return an array containing it. Why not include unwrapping the JSON in `call`? — jonrsharpe, Nov 10 '18 at 18:39
@jonrsharpe I see, not sure how to do that though, since I want to include res[0] aswell... — Himmators, Nov 10 '18 at 18:45
Make it part of the chain you're passing to all in the first place? Or have the callback on `res[1].json()` pass through `res[0]` too. — jonrsharpe, Nov 10 '18 at 18:46
https://stackoverflow.com/questions/37555031/why-does-json-return-a-promise — Jameel Moideen, Nov 10 '18 at 18:48

score 0 · Accepted Answer · answered Nov 10 '18 at 19:00

You have to use .then() on res[1].json() because it just returns a promise and you aren't waiting on that promise anywhere.

What I would suggest is that you change to this:

let call = fetch(link, { headers: {"Content-Type": "application/json; charset=utf-8"} })
    .then(response => response.json());

Then, your call variable has already made the .json() call and Promise.all() will wait on it for you.

let dbconnect = require('mongodb').MongoClient.connect("mongodb://localhost:27017/mydb", { useNewUrlParser: true } ),
    call = fetch(link, { headers: {"Content-Type": "application/json; charset=utf-8"} })
              .then(response => response.json());

Promise.all( [dbconnect, call] ).then( res => {
    console.log(res[0]);
    console.log(res[1]);
});

Why am I getting Promise { } when using fetch in Promise.all?

1 Answers1

Linked