uiwjs / uiwjs/react-codemirror

Unable to use browser's selection API when text in the editor is long enough

Open
#637 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
2.3k
Forks
161
PR merge metrics
No merged PRs in 30d

Description

When passing long enough text to the CodeMirror component, it will only create certain DOM elements based on the height of the CodeMirror component, therefore, when the text is too long, using the browser’s Selection API will be impossible since the actual selection will be the virtualized version of the text, and therefore the selection will be truncated.
My text is 355 lines long, and contains 18,238 characters. The CodeMirror component wraps the a text area element, the element does contain the full text , I am using "@uiw/react-codemirror": “^4.21.21”.
I could did not find anything in the documentation regarding the pattern. when the text is not long everything works fine.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue with @uiw/react-codemirror ^4.21.21 using about 355 lines and 18,238 characters, then compare the browser Selection API result for short and long text. Investigate how the component's virtualized DOM affects selection. Done means the browser can select the full long text rather than a truncated virtualized version.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.