Describe the bug

This manifests when performing heavy operations or in high latency environments. First you delete an element in storage and then undo that delete. If your undo operation is submitted before the ack of the original delete returns, the delete ack will temporarily remove the element once again. Once the undo ack returns the element in local storage will resolve correctly.

In our app, which is very similar to the collaborative whiteboard example, this causes a flicker of elements on screen. The user experience of this bug is that they delete an element accidentally and immediately undo. They'll see the element restored successfully, but shortly after it will disappear again for no reason. Eventually the element comes back, but until then the user is left trying to figure out if their element is gone forever.

To Reproduce

Steps to reproduce the behavior:

1. Ensure websocket delay either through a large storage state or network latency
2. Perform a delete operation

• Elements should disappear from local state and UI

3. Immediately undo

• Elements should reappear

4. Wait for the delete ack to return

• Elements will disappear a second time

5. Wait for the undo ack to return and restore the elements

• Elements will finally reappear

Expected behavior

If a delete operation has been undone, the ack of that delete should not remove the restored elements from local state.

Illustrations

Here you can see a screenshot of the websocket when this situation manifests in our app. Note the message size and timings on the right. Both acks return after the user operations are submitted, and the elements disappear in-between the first and second acks.

Environment (please complete the following information):

• @liveblocks/[email protected]
• chrome v117.0.5938.149