Android - Room - Unexpected quantity of letters when inputting room name in capital letters

[kbecciv]

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

---

Action Performed:

1. Open Android app and login
2. Create a room
3. Got to room setting to change it's name
4. Select "Capital letter only" mode and input a new name

Expected Result:

Name should be correctly input

Actual Result:

Unexpected quantity of letters when inputting room name in capital letters

Workaround:

Unknown

Platform:

Where is this issue occurring?

• Android

Version Number: 1.2.37.0

Reproducible in staging?: Yes

Reproducible in production?: Yes

Email or phone of affected tester (no customers):

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

Bug5855634_Screenrecorder-2022-12-08-20-53-30-25_1___1_.mp4

Expensify/Expensify Issue URL:

Issue reported by: Applause - Internal Team

Slack conversation:

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @johncschuster (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[s77rt]

The issue is on RN.
react/react-native#27449

There is a posted workaround and a possible PR that may fix it but it's still a draft.

Given that room feature is still in beta, perhaps we should do nothing for now.

[sketchydroide]

I think s77rt might be right, also this is an old bug on RN (2019), not sure why they have not tried to fix it yet

[sketchydroide]

I wonder if someone with an android test what happens in Android Whatsapp?

[sketchydroide]

Asked @Julesssss for some help to test here, and in Whatsapp this does not happen, therefor I think we should keep this open, and try to see if there is a fix for it.

[syedsaroshfarrukhdot]

Proposal

As it is known bug in React Native for android and there is no actual fix for it at the moment. We can use a workaround to fix the problem by keyboardType={"visible-password"} and by turning autoCorrect={none} in index.android.js.

           <TextInput
            ref={this.props.forwardedRef}
            disabled={this.props.disabled}
            label={this.props.translate('newRoomPage.roomName')}
            prefixCharacter={CONST.POLICY.ROOM_PREFIX}
            placeholder={this.props.translate('newRoomPage.social')}
            onChange={this.setModifiedRoomName}
            value={this.props.value.substring(1)} // Since the room name always starts with a prefix, we omit the first character to avoid displaying it twice.
            errorText={this.props.errorText}
            autoCapitalize="none"
            maxLength={CONST.REPORT.MAX_ROOM_NAME_LENGTH}
            autoCorrect={none}
            keyboardType={"visible-password"}
        />

After Fix

WhatsApp.Video.2022-12-14.at.8.13.07.AM.mp4

@sketchydroide Is there any reason we are restricting user from using capital letters in Room Name ? As on WhatsApp for instance for Group Name they don't restrict user from entering capital letters that's why this doesn't happen there we are forcing room name to be lowercase.

Whatsapp for reference :-

WhatsApp.Video.2022-12-14.at.8.24.09.AM.mp4

[s77rt]

@syedsaroshfarrukhdot I don't think we want a workaround for this, besides you posted the workaround I linked.

[sketchydroide]

I think the idea was to do something like slack does, and to not allow capital letter in the room/channel name.

[sketchydroide]

I think I understand the underlying issue here, because there is a feedback loop using the onChange to reset the text as lowercase. I think this creates an issue where it's trying to set the new text on top of the old one and creates copies.
No idea if we can fix this localy like it was mentioned here before.
But I think we should at least remove the autoCapitalize="none", as it's not doing anything we are doing the calitalization with code anyway.