Why is this promise returning undefined?

Question

I am trying to write a simple function like this

const joinLeague = async () => {
    const league = await attemptToJoinLeaugeIfItExists({ id, leaguePin })
    console.log(league, 'fl')

    if (league) {
        // do something 
    }
}

and I have made a firebase helper like this

export const attemptToJoinLeaugeIfItExists = ({ id, leaguePin }: any) => {
    return new Promise((res, rej) => {
        res(
            firebaseApp
                .database()
                .ref(`users/${id}`)
                .once('value')
                .then((snapshot) => { `
                    firebaseApp
                        .database()
                        .ref(`leagues`)
                        .once('value')
                        .then((snapshot) => {
                            console.log('in here')
                        })
                }),
        )
    })
}

however, league is logging out as undefined and in here is logging out second. however, I thought it would be the other way around? I thought it would "await" for this function to resolve then once it's resolved, it would show me the result. what am I doing wrong?

Did you already try to use the `then()` function at your attemptTo.. call? — Yannick, Oct 13 '20 at 19:56
You are using the [explicit promise constructor antipattern](https://stackoverflow.com/questions/23803743/what-is-the-explicit-promise-construction-antipattern-and-how-do-i-avoid-it). You don't need it, you just need to do `return firebaseApp.database().ref(/* ... */).once(/* ... */).then(/* ... */)` — VLAZ, Oct 13 '20 at 19:59
Also, the nesting of another call to `firebaseApp` inside the `.then()` is likely incorrect. I suspect there is a better way to structure this but I am not familiar with firebase and also I'm not even sure why you need that. — VLAZ, Oct 13 '20 at 20:01
You should probably use the standard naming convention of `resolve/reject` rather than `res/rej`. — jarmod, Oct 13 '20 at 20:01
Your helper is resolving immediately. But the code inside your resolve it not. — Bibberty, Oct 13 '20 at 20:04
@VLAZ Interesting, I've never seen them used. Maybe I should get out more ;-) — jarmod, Oct 13 '20 at 20:05
@Bibberty `res` receives a promise, so the whole of the result will wait for that promise to resolve first. Promises automatically flatten/merge if the result is another promise. — VLAZ, Oct 13 '20 at 20:08

score 1 · Accepted Answer · answered Oct 13 '20 at 20:07

do it like this:

export const attemptToJoinLeaugeIfItExists = ({ id, leaguePin }: any) => {
    return firebaseApp
                .database()
                .ref(`users/${id}`)
                .once('value')
                .then((snapshot) => { `
                    return firebaseApp
                        .database()
                        .ref(`leagues`)
                        .once('value')
                })
}

you're currently immediately resolving your outer promise but with an inner promise, and that inner promise doesn't return anything at all, hence undefined. Just return the promise directly. Cleaner, simpler.

ahhh! I knew it was something simple. I ended up immediately realising this and then resolving the inner part but I think yours is cleaner so will refactor to that, thanks! — Red Baron, Oct 13 '20 at 20:12

Why is this promise returning undefined?

1 Answers1