Rejecting a Promise by passing a Promise

Question

Why is it exactly that the a resolveing promise correctly waits for the someOtherPromise to complete, but the reject does not? Run the following code sample and check the console.log output. I expected the "myFailingPromise rejected" message to show 2000 ms later, just as the "myPromise resolved" did.

let someOtherPromise = (previousPromise) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(previousPromise + ' => someOtherPromise after 2000ms');
      resolve('someOtherPromise');
    }, 2000);
  });
}

let myPromise = () => {
  return new Promise((resolve, reject) => {
    resolve(someOtherPromise('myPromise'));
  });
};

let myFailingPromise = () => {
  return new Promise((resolve, reject) => {
    reject(someOtherPromise('myFailingPromise'));
  });
};

myPromise().then((val) => {
  // this is executed after `someOtherPromise` resolves.
  console.log('myPromise resolved');
}).catch((err) => {
  console.log('myPromise rejected');
});

myFailingPromise().then((val) => {
  // this is executed after `someOtherPromise` resolves.
  console.log('myFailingPromise resolved');
}).catch((err) => {
  console.log('myFailingPromise rejected');
});

I know the intended behaviour can be achieved by using someOtherPromise.then(reject) in the second example, but my question is why the promise as an argument to reject is not possible, since it works for resolve.

Answer 1

When you're resolving a promise A, if the value with which you're resolving it is a promise B, then your promise A will match the state of the promise B.

However, when you're rejecting a promise, your only giving a reason, whether the reason looks or not like a promise doesn't matter.

What you need to do, is to resolve with someOtherPromise in both cases.

If you want to wait for the first promise and reject anyway, you can do this:

let myFailingPromise = () => {
  return new Promise((resolve, reject) => {
    someOtherPromise.then(reject);
  });
};

Answer 2

The reject only takes in a reason to highlight the error. Not another promise. You can resolve a promise with another promise of the same type, yet only the last promise's success case you will see.

Have a look at this adapted implementation:

const someOtherPromise = new Promise((resolve, _) => {
    resolve("I am a success");
});
const failingPromise = new Promise((_, reject) => {
    reject("I failed for a reason");
});

someOtherPromise
    .then((result) => {
            console.log("some other promise resolves", result);
            failingPromise
                .then((success) => {
                    console.log("never called");
                })
                .catch((reason) => {
                    console.error("failing promise rejects", reason);
                });
        }
    )
    .catch((error) => {
        console.error("also never called", error);
    });

This is the then-able approach to wait for other promises leading to a callback hell. This is why you can also use async / await syntax:

const app = async () => {
        try {
            const success1 = await someOtherPromise; // will succeed
            console.log(success1);
            const success2 = await failingPromise; // never succceds
            console.log(success2); // never be reached
        } catch (e) {
            return Promise.reject(e); // catches the error of failing promise and rethrows it, redundant but here showcases error handling
        }
    }
;

app()
    .then(() => {
        console.log("never be reached because of failing promise");
    })
    .catch(console.error);

Answer 3

In regards to your updated question with the timeout, here is what you could do in order to always await another promise:

const otherPromise = async (willBeSuccesful: boolean) => {
    console.log("started timer for case", willBeSuccesful);

    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log("resolve timer for case", willBeSuccesful);

            const successValue = "Fnord"; // whatever you want

            return willBeSuccesful
                ? resolve(successValue)
                : reject("this other promise failed because of reasons"); // only provide a reason, not another promise
        });
    };
};

const alwaysWaitForOtherPromiseThenRejectAnyway = async (otherPromise) => {
    try {
        const success = await otherPromise; // always waits 2 seconds, not matter
        console.log("other promises succeeded with value", success);
    } catch (e) {
        return Promise.reject(e); // passing through reason, redundant, only to showcase
    }

    return Promise.reject("reason why this promise failed"); // only happens after otherPromise was resolved, you could swallow that error and fail here or resolve here as well
};

const succeedingPromise = otherPromise(true);
const failingPromise = otherPromise(false);

alwaysWaitForOtherPromiseThenRejectAnyway(succeedingPromise)
    .catch((reason) => console.error(reason)); // fail after waiting for success of other promise

alwaysWaitForOtherPromiseThenRejectAnyway(failingPromise)
    .catch((reason) => console.error(reason)); // will fail as soon as otherPromise fails

It will always wait for the timeout before rejection happens. Rejection will have different reasons. Output will be:

started timer for case true
started timer for case false
resolve timer for case true
resolve timer for case false
other promises succeeded with value Fnord
reason why this promise failed
this other promise failed because of reasons