RTC: Add collaborator selection highlighting in rich text#76107
Open
alecgeatches wants to merge 9 commits intotrunkfrom
Open
RTC: Add collaborator selection highlighting in rich text#76107alecgeatches wants to merge 9 commits intotrunkfrom
alecgeatches wants to merge 9 commits intotrunkfrom
Conversation
github-actions
bot
added
[Package] Core data
|
Size Change: +1.09 kB (+0.02%) Total Size: 6.87 MB
ℹ️ View Unchanged
|
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
alecgeatches
added
[Feature] Real-time Collaboration
alecgeatches
changed the title
alecgeatches
changed the title
Contributor
Author
|
Tagging @dabowman on this PR because I can't mark as an assignee or reviewer. |
alecgeatches
assigned
maxschmeling and
chriszarate and unassigned
maxschmeling and
chriszarate
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What?
Closes #74710
Screen.Recording.2026-03-03.at.1.23.32.PM.mov
This PR adds selection highlighting to real-time collaboration awareness. Previously, collaborators could only see each other's cursor positions (
selectionStart). Now, when a user selects text, other users see highlights showing the full selection range.Why?
If a user has text selected, it's in active use by them and important for other users to be aware about. This is expected behavior in other collaborative tools.
How?
There are two major updates to how we share selection state:
On the sending side in
post-editor-awareness.tswe now detect selection direction (forward vs. backward) by comparing selection state before and after changes to selection are made. This direction info is included in the selection state broadcast over awareness.On the rendering side, the previously huge
use-render-cursors.tshas been expanded and refactored into three files.compute-selection.tshandles converting raw selection ranges into visual coordinates.cursor-dom-utils.tsprovides low-level DOM measurement utilities to calculate pixel positions for highlight rectangles, which mostly relies on browser range APIs.What's missing?
Selection states are still handled differently when multiple blocks, including non-text whole blocks are selected:
Screen.Recording.2026-03-03.at.1.27.03.PM.mov
This is a bit trickier to handle, since blocks positions are encoded differently than text positions (
Y.RelativePositionin aY.Textversus parent inner blocksY.Array). Also, Gutenberg can report multiple-block selections in different ways. This will require some more code changes to address, but I think this PR is big enough already and handles everyday use-cases for selections.Note that this PR does not add text highlighting or awareness within the code editor at all. This was originally part of the issue referenced above:
We still don't have full code-editor support or awareness state at all within that text. We may add this later, but for now this only applies to the regular block editor, not code editor.
Testing Instructions
Also see end-to-end tests via: