Chat - The cursor is displayed at the beginning when you edit a message.

[IuliiaHerets]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: v9.0.73-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
Issue reported by: Applause Internal Team

Action Performed:

1. Go to https://staging.new.expensify.com/
2. Login with the new account.
3. Create a workspace and go to the #Admin room of the WS.
4. Write a message and perform the function to edit the message.

Expected Result:

The cursor should always be displayed at the end of the message.

Actual Result:

This only happens after interacting with the #Admin room. When editing a message sent, the cursor is displayed at the beginning. After you type a letter, the cursor returns to the normal position. This is reflected in the group's chats and threads as well.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6689298_1733778439575.The_cursor.mp4

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @stephanieelliott (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[bernhardoj]

Proposal

Please re-state the problem that we are trying to solve in this issue.

The cursor is at the beginning of the message if we open the admins room from the workspace profile page.

What is the root cause of that problem?

The root cause of the issue is similar to #46095. This is caused by the active focus traps that prevents the focus event to be received by the composer. You can read more detail on that root cause here.

The different thing in this issue is, we already pause the focus trap if the screen isn't focused.

App/src/components/FocusTrap/FocusTrapForScreen/index.web.tsx

Line 41 in 8981081

paused={!isFocused}

In this case, the screen that has the active focus trap is the workspace full screen navigator. When we open the workspace profile share page, the workspace full screen navigator focus trap is paused. When we click the #admins room link, the RHP is closed and focus trap automatically unpause the previous focus trap, which is the workspace full screen navigator focus trap.
https://github.com/focus-trap/focus-trap/blob/f85c73ac36553d952a8e03d1033b35544247caa0/index.js#L28-L36
https://github.com/focus-trap/focus-trap/blob/master/CHANGELOG.md#400

What changes do you think we should make in order to solve the problem?

We don't want the workspace full screen navigator focus trap to be unpaused when the RHP is closed because the screen is still blurred. We have 2 options.

First, instead of pausing the focus trap when the screen is blurred, we can deactivate it. We can return isFocused here (or we can do it only for FullScreenNavigator to be very safe).

App/src/components/FocusTrap/FocusTrapForScreen/index.web.tsx

Lines 35 to 36 in 8981081

	return true;
	}, [isFocused, shouldUseNarrowLayout, route.name, focusTrapSettings?.active]);

If the focus trap is deactivated, unpause doesn't do anything.
https://github.com/focus-trap/focus-trap/blob/f85c73ac36553d952a8e03d1033b35544247caa0/index.js#L1037-L1040

Second, we can add a new option to the focus-trap repo to not automatically pause/unpause the focus-trap when a focus-trap is activated/deactivated.

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

N/A

[stephanieelliott]

Hm, I'm not able to repro this -- it's working on Safari and Chrome for me.

Either way, I think this is not really impacting users in a negative way and not worth prioritizing a fix. Gonna close but add the label in case we want to address cursor consistency as a whole in the future

[bernhardoj]

@stephanieelliott you need to open the #admins room from the workspace share page.

The issue is not only about the cursor being shown at the end of the text but also:

1. The cursor moves to the end on every character we type even though we put the cursor on other positions
2. The composer's green border is missing
3. This happens to the main composer too
4. TAB-ing doesn't work at all

a.mp4

[bernhardoj]

@stephanieelliott can you recheck this one, please?