For instance, we have function reallyHeavyOperation, that blocks javascript thread for some time. And, during this operation execution, user clicks a button with a listener attached to it.

For the code below, Chrome logs "click" after reallyHeavyOperation is finished.

test.addEventListener('click', () => {
  console.log('click')
})
reallyHeavyOperation();

As I know, browsers handle such DOM events synchroniously(please tell me if I'm mistaken). But how can they do it, when execution thread is blocked with some work? Is there something like UI events queue, where browsers store interactions and then dispatch them, when the call stack becomes free?

I would really appreciate if someone could give links to specifications or source code, so that I could read more about this!