Wait for GiftedChat to initialize before calling focusTextInput()

Issue Description

I’m hiding GiftedChat and showing it on button press.

When the button is pressed and GiftedChat is shown, I’d like its text input to be focused at the same time, so I’m calling focusTextInput() on the ref to GiftedChat in the button press handler.

However, I’ve run into an issue as focusTextInput() apparently does not wait for its text input to be initialized before calling focus() on it, but only ignore if not initialized.

I’ve confirmed the issue by logging this.textInput in the source GiftedChat.js – I can see this.textInput is undefined at the time focusTextInput() is called thus it is being ignored.

The only way I could get around this is deferring the focusTextInput() call by wrapping it in a set timeout of a fixed amount of time, which does work but rather seems like hacky.

Steps to Reproduce / Code Snippets

  constructor(props) {
    super(props);
    this._focusOnUpdate = false;
  }

  componentDidUpdate(nextProps) {
    if (this._focusOnUpdate) {
      this.giftedChatRef.focusTextInput();
      this._focusOnUpdate = false;
    }
  }

  onPressButton = () => {
    store.openOverlay();
    this._focusOnUpdate = true;
  }

  render() {
    return (
      ...
            { store.overlayShow &&
              <View style={[styles.padding, {flex: 1, position: 'absolute', top: 0, left: 0, right: 0, bottom: 0}]}>
                <GiftedChat
                  messages={this.state.messages}
                  onSend={messages => this.onSend(messages)}
                  user={this.user}
                  locale={'ko'}
                  placeholder='채팅'
                  placeholderTextColor="#CCCCCC"
                  renderAvatar={this.renderAvatar}
                  renderUsernameOnMessage={true}
                  renderInputToolbar={this.renderInputToolbar}
                  renderSend={this.renderSend}
                  textInputStyle={styles.input}
                  ref={c => this.giftedChatRef = c}
                />
              </View>
            }
      ...
    );
  }

Expected Results

focusTextInput() should focus the text input.

Additional Information

• React version: 16.8.3
• React Native version: 0.59.8
• react-native-gifted-chat version: 0.13.0
• Platform(s) (iOS, Android, or both?): both

[noway]

my patches here: https://github.com/noway/react-native-gifted-chat/commits/master, specifically i overcame that with having isInitialized always being true

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.