[Daniel Ayala (danielayala94)]

Description

Type of Change

New feature.

Why

Implement selectTextOnFocus prop in TextInput. It is implemented in Paper; this PR brings the Fabric implementation.

Resolves #13133

What

Created a function that:

• Selects the whole text when the TextInput is focused
• Drops the selection when TextInput loses focus

The function is called in two places:

• OnPointerReleased(), if the mouse left button was pressed, to select the text.
• OnLostFocus(), to clear the selection.

Text selection will not occur if clearTextOnFocus prop is set to true. This is purely by design, as the RN documentation doesn't specify what the behavior should be. For reference, if both props are set to true, Android doesn't clear the text on focus and performs the selection, but iOS clears the text input.

Screenshots

selectTextOnFocus.mp4

Testing

Added e2e tests to TextInputComponentTest and two TextInput fields in playground, in both cases demonstrating the capabilities explained above.

Changelog

Yes

Implement selectTextOnFocus for TextInput in Fabric

Microsoft Reviewers: Open in CodeFlow

[acoates-ms]

Can we maybe just map selectTextOnFocus to ES_SAVESEL?
Turn on:
m_textServices->TxSendMessage(EM_SETOPTIONS, ECOOP_OR, ES_SAVESEL);
Turn off:
m_textServices->TxSendMessage(EM_SETOPTIONS, ECOOP_AND, ~ES_SAVESEL);

Not using onFocus means that we miss various other method of the textinput gaining focus. (Keyboarding, accessibility, programatic)

[Daniel Ayala (danielayala94)]

Can we maybe just map selectTextOnFocus to ES_SAVESEL? Turn on: m_textServices->TxSendMessage(EM_SETOPTIONS, ECOOP_OR, ES_SAVESEL); Turn off: m_textServices->TxSendMessage(EM_SETOPTIONS, ECOOP_AND, ~ES_SAVESEL);

Not using onFocus means that we miss various other method of the textinput gaining focus. (Keyboarding, accessibility, programatic)

acoates-ms I agree we should take care of the other ways to focus, not just the left mouse button. However, I tried both ES_SAVESEL/ECO_SAVESEL and neither seem to do anything.