React-native: Short lived TextView causing error "Trying to set local data for view with unknown tag: 4" on Android in RN 0.50.3

[meros]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS Sierra 10.12.6
Node: 8.3.0
Yarn: 1.1.0
npm: 5.4.2
Watchman: 4.9.0
Xcode: Xcode 9.1 Build version 9B55
Android Studio: 3.0 AI-171.4408382

Packages: (wanted => installed)
react: 16.0.0 => 16.0.0
react-native: 0.50.3 => 0.50.3

Steps to Reproduce

1.
Create a view with a TextInput, make sure this view is showing when app is loaded but hidden quickly after (due to asynchronous event).
2.
Let this app load in the android emulator
3.
Once in a while you get error "Trying to set local data for view with unknown tag: 4"

Expected Behavior

I expect removing the TextInput shortly after app loading to work every time on Android without any errors

Actual Behavior

There seems to be a race condition when starting up the app causing the error

Reproducible Demo

Run this demo in the simulator. I have not been able to reproduce this on a device

https://github.com/FranklyDev/react-native-0_50_3-android-bug-testcase

[meros]

Please note that I can reproduce the error only maybe once/10 reloads or so.

[matthamil]

I'm also experiencing this. I get it every time I render a TextInput and immediately hide or transition to another screen.

[wangghon]

There is a change in 0.51.0-rc.1, no exception anymore.
https://github.com/facebook/react-native/commit/f2c6877b91963878f36ec42f5f865427bc69488c#diff-e40bcf61507821200dcf1f573eb717e3

[matthamil]

That change isn't published to npm yet is it? Is the solution to compile RN from source? @wangghon

[wangghon]

0.51.0-rc.1 is not published to npm yet. I think it would be soon. need to build react-native from source to make the change take effects

[arashmilani]

Is there any other workaround other than compiling RN from source

[yaohongkok]

@wangghon I am wondering when will '0.51.0' be available officially on NPM?

[wangghon]

@yaohongkok I am waiting for the release as well. Hope it can be released soon.

[phu-tang-tiki]

I faced this problem when upgrade to react-native 0.50 :( but a little bit ( ... tag: 20) not sure it's relative but stacktrace is the same

[GitHubTracey]

working with RN 0.50.4 and experiencing the same issue.

[ociata]

Any workaround at least until it is merged?

[jerameel]

Having this issue on 50.4 using windows, error occured on both emulator and actual device

[arashmilani]

I'm developing a redux-react-native app and as a workaround I just delay the rendering by some milliseconds between two states changes using a simple setTimeout while dispatching the next action.

[jerameel]

how would you know where to add the delay? I'm on redux now

[arashmilani]

in my case it just happens in some particular action and specific scenario
so I just delay dispatching that specific action.

[Tennen]

I prevent updating the component after the action (in my case submit action) which may cause the component unmount

[jerameel]

setTimeout actually does the thing for me, so the issue is with the initial component immedietly invoking an action that triggers conditional rendering. Kudos to arasmilani for pointing that out

[ociata]

If not using redux, how we could fix it? I tried conditionally rendering TextInput with timeout, without success - once inserting the TextInput(after 3 sec) it again fails:

render() {

    let render = this.state.shouldRender ?
    <TextInput
      style={styles.search_text}
      placeholder="Type here to search!"
      onChangeText={(text) => this._onTextChanged(text)}
    /> :
    <View/>

    return <View style={styles.main_view}>
       <View style={styles.search_holder}>
         {render}
       </View>
       <View style={{flex:1}}>
         <ListView
           dataSource={this.state.dataSource}
           renderRow={this._renderListRow.bind(this)}/>
       </View>
     </View>
  }

  componentDidMount(){
    setTimeout(() => {

      this.setState({
        shouldRender: true
      })

    }, 3000)

  }

More importantly - I'm not hiding or manipulating the TextView in any manner. The exception is thrown 100% on Android 4.4 real device.

[GitHubTracey]

This change is in the latest release!
https://github.com/facebook/react-native/releases/tag/v0.51.0

[munkhorgil]

I just got this error in Android react-native 0.50.0, Still no solution?

[GitHubTracey]

@munkhorgil - I am at the latest release, 0.51.0, and no longer have this issue. The fix mentioned above has been included in the release. Happy Coding!

[munkhorgil]

@GitHubTracey Thanks for notify!

[munkhorgil]

I updated to latest release as 0.51, and no longer crash on device. But it re-renders current component and logs in Android Studio as ReactNative: Attempt to set local data for view with unknown tag my textinput as follows

<TextInput
  ref={name}
  blurOnSubmit={false}
  autoCorrect={false}
  style={styles.inputStyle}
  underlineColorAndroid="transparent"
  onSubmitEditing={() =>
  this.updateField({
     ref: ref, 
     key: key ? key : name, 
     name: name,
      label: label
  })
}
  onChangeText={value => this.setState({[name]: value})}
 value={this.state[name]}
/>

[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. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[challme28]

At react native 0.53 it no longer shows me the Trying to set local data for view with unknown tag: X message

[react-native-bot]

Thanks for posting this! It looks like you may not be using the latest version of React Native, v0.53.0, released on January 2018. Can you make sure this issue can still be reproduced in the latest version?

I am going to close this, but please feel free to open a new issue if you are able to confirm that this is still a problem in v0.53.0 or newer.

_{How to Contribute • What to Expect from Maintainers}

[kartiikeyabaleneni]

In RN 0.53 . The issue still exists. Happens one in case of 10 attempts.

[GregorHorvatH]

"react-native": "0.54.4" - fixed

[joshuapinter]

✅ Confirmed. Fixed in React Native 0.54.4.

[ashishalgo]

we are using react version 0.50.4 version and facing the same issue and we can not update the react version because we are using Salesforce sdk in which 0.50.4 react version is used.

Is there any resolution for same version to fix this issue?

[tal987]

@ashishalgo Did you find solution?