Inconsistent order of events

Currently many events are emitted synchronously in response to local function calls, for example submitOp emits an op event synchronously. This leads to some unexpected behaviours, for example:

doc.on((op, source) => { if (source === '1') submitOp(op1, '2') })
doc.on((op, source) => console.log(source))
doc.submitOp(op1, '1')

prints:

2
1

instead of:

1
2

which reflects the actual order of operations.

Here's what happens in the example above:

1. op1 is submitted.
2. An 'op' event is emitted with source '1'.
3. The first handler is called with source '1' and submits op2.
4. An 'op' event is emitted with source '2'.
5. The first handler is called with source '2' and exits.
6. The second handler is called with source '2' and prints it.
7. The second handler is called with source '1' and prints it.

In order to deal with this issue perhaps we could use an approach similar to MutationObserver, where synchronous operations are recorded in an Array and then a single event is emitted asynchronously with the list as a parameter?

Related issues:

• Inconsistent callback execution - sync vs async
• [Proposal] Op Event Changes

Start by tracing submitOp and the synchronous 'op' event handlers in the example, then read the linked issue 206 and pull request 129 alongside the MutationObserver reference. The work is done only when the intended event and callback ordering is agreed and the behavior is consistently defined for nested submissions.