fix(penpal): render pending highlights via rehype instead of DOM mutation#355
Merged
fix(penpal): render pending highlights via rehype instead of DOM mutation#355
Conversation
35847af to
8837a3c
Compare
fbbb9f7 to
9632795
Compare
Collaborator
Author
|
@codex review Comment posted automatically by outer-loop |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 9632795358
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
4d02546 to
1b6e0b1
Compare
…ead of DOM mutation The pending highlight (shown while composing a new comment) was applied by directly mutating React-managed DOM — wrapping text nodes in <mark> elements. When an SSE event raced with comment submission, React would re-render the MarkdownViewer and encounter unexpected nodes during reconciliation, crashing with "The object can not be found here." Move the pending highlight into the existing rehypeCommentHighlights plugin so React owns the full lifecycle. When pendingAnchor is set, it's added to the threadHighlights array with a `pending` flag that adds the `pending-highlight` CSS class alongside `comment-highlight`. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1b6e0b1 to
4d29e2e
Compare
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
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.
Summary
Fixes an intermittent crash ("The object can not be found here" /
removeChild) when leaving a comment or reply in Penpal.Root cause:
applyPendingHighlightdirectly mutated React-managed DOM by wrapping text nodes in<mark>elements. When an SSE event raced with comment submission, React's reconciliation encountered unknown nodes and threw.Fix: Pending highlights now flow through the existing
rehypeCommentHighlightsrehype plugin. React owns the full DOM lifecycle — no more race conditions. The DOM-mutatingapplyPendingHighlight/removePendingHighlightfunctions are removed;threadHighlightsmemo inFilePage.tsxincludespendingAnchoras a highlight entry (withpending: true) when present.Also fixed:
occurrenceIndexis now stored onAnchorand passed to the rehype plugin so it can find the Nth occurrence of selected text within a block — preventing mis-highlights when the same text appears multiple times.Tests
146 tests pass (20 files), including 13 new tests covering:
pending-highlightclassMarkdownViewerrenders both regular and pending highlights via pluginFilePageshows/hides pending highlight on toolbar open/cancelGenerated with Claude Code