Looks like we dismiss the context menu when clicking outside the node but inside the editing surface (which changes the selection), but not when clicking outside the editing surface itself (which deactivates the selection, but doesn't change it).

We can probably fix that, we'll have to be careful not to break the code that handles the "edit cards" on mobile (which relies on activating/deactivating the selection to show/hide the keyboard).

Thank you for explaining, @matmarex. The demonstration you walked me through during triage leads me to think this is something we can leave alone for now.

Reason: the behavior I experienced in the video above, is likely exacerbated by how short the article was and subsequently, how "small" the editing surface is.

To explain why this is possibly and issue for mobile you need to understand the various states of a selection:

• Activated. This is a blue selection that represents a focused document. For text selections this also means there is a "real" or "native" selection with a blinking cursor controlled by the browser.
• Deactivated. This means the selection has be replaced with a "fake" selection, with blinking cursors being replaced by a fake line drawn by VE. There are two sub-states here:
  • Shown-as-deactivated. The deactivated state is conveyed to the user by making the selection grey instead of blue. Cursors just stop blinking but don't change colour. This state is used when there is one VE instance of the page (e.g. article editing) that takes up the user focus. It allows the user to click outside of the editing surface without losing their selection and disabling the toolbar. In situations where there are potentially multiple VE instances on the page (e.g. DiscussionTools & Flow) we do not deactivate the selection when focus is moved, we remove the selection entirely. This causes VE to behave more like a simple text box.
  • Not-shown-as-deactivated. This is when we want to remove the real/native selection but don't want the user to see any change. It is primarily used on mobile to hide the keyboard, for example when a menu is opened or a link card is opened. We need to deactivate the selection to hide the keyboard, but it would be odd to make the selection grey as the user's focus has not moved.

Currently contexts (e.g. the "link card" on mobile and the "node description" here) are always shown regardless of the activated/deactivated state. We definitely don't want to hide contexts in the activated (normal context usage) or not-shown-as-deactivated states (mobile link cards). We could potentially hide the cards in the show-as-deactivated state.