Ensure caret is visible

[ntdiary]

Details

react-native-live-markdown/src/MarkdownTextInput.web.tsx

Line 441 in cd42c45

CursorUtils.setCursorPosition(divRef.current, contentSelection.current ? contentSelection.current.end : valueLength);

In Chrome and Safari (mobile & PC), for long text message, even though we set the cursor position when focused, maxHeight hasn't taken effect yet, so the element has no overflow, causing the caret to be invisible after rendering. This change ensures that the caret is visible.

test.mp4

Related Issues

Expensify/App#26239 (comment)

Manual Tests

Linked PRs

Expensify/App#40295

[github-actions]

CLA Assistant Lite bot All contributors have signed the CLA ✍️ ✅

[ntdiary]

I have read the CLA Document and I hereby sign the CLA

[Skalakid]

Hi @ntdiary, thanks for the PR. I'm not sure if we want to scroll to the cursor every time numberOfLines prop changes. It can introduce some other regressions in the future. Also, we believe it more of a bug on the Expensify App side.
However, recently I've been working on enhancing the Composer component, and my changes fix your problem. Here is the PR