DEV Community

Zach
Zach

Posted on

Async

In this post:

I've been sitting on some thoughts for studying and posting about the world of asynchronous and the Javascript features that help us to navigate it.

But as always, something (that feels) more pressing gets in the way, and you put it off until you can't any longer. That moment arrived for me today.

My intention as I write is to describe the issue that I faced, and solved, and then to do read and report back on alternative strategies for dealing with it. I'm hoping to cover promises and async/await in particular.

The Problem

Here's the function I was struggling with:

Oh and by the way, I'm really pleased with the way that I used git here. I used a commit to note an interesting point that I figured I'd want to revisit. After resolving the issue and deciding to post about the original condition, I was able to roll back into my commit history to find that earlier state, which I'm pasting here.

app.post('/api/create', (req, res) => {
  var email = req.oidc.user.email 
  //below should really be a 'find one query'
  var userName = fetchUsername.getUserNameFromEmail(email, (err,data)=>{
    if (err){
      throw (err)
    } else {
      console.log('test', data[0].username)
      return data[0].username
    }
  })
  console.log(userName)
  var title = req.body.title
  var text = req.body.text
  const author = {userName:userName}
  fetch.createPost(title, text, author, (err,data)=>{
  })

})
Enter fullscreen mode Exit fullscreen mode

After submitting a blog post, React would throw errors when rendering the feed (which included the new post) due to issues with the UserName. I investigated the db by performing a manual query, and say that the document was being saved without a userName field entry.

I spent some time trying to correct one obvious issue: altering the Blog schema to require a userName. But that was a rabbit hole that I wasn't willing to commit to, so I re-focused on determining the nature of the missing username.

I did some logging to see if there was an error with the email address - and it turns out that I was misreading the email address and saving them within double quotes. And yet, that wasn't the source of my problem. I fixed that small bug and continued the search.

I'll point out here I was trying to return a database query to a variable - something that I recognized was non-standard for the world of Node, but which I am comfortable doing as a standard coding practice. At this point in the debugging process, I started to suspect this was the source of my problems.

Uncovering the Issue

I threw in a few logging statements (which appear in the code above) to see what was returning from my data fetcher and I got the following results:

undefined
test zach
Enter fullscreen mode Exit fullscreen mode

What does this tell me?

Async is happening.

While the data fetcher is out querying the database, the interpreter is moving down through the code and when it reaches line 120: console.log(userName), well, the data hasn't returned to give a value to this variable, so instead it's undefined. We see that result output to the console, snd regrettably, undefined is fed into the createPost function as the userName value.

Eventually, the query data does return - as we see from the test Zach statement - but by this point it's too late.

More to come

I haven't gotten to my solution or to the alternative strategies that I think exist (nor the studying I have to do to find them). I'll save that for a future post.

Top comments (0)