Skip to content

Recursive warning warnings when using Touchables Inspector #20200

Closed
@TheWildUnicorn

Description

Environment

React Native Environment Info:
System:
OS: macOS High Sierra 10.13.6
CPU: x64 Intel(R) Core(TM) i7-3615QM CPU @ 2.30GHz
Memory: 27.59 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 8.11.3 - /usr/local/bin/node
npm: 5.6.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 23.0.1, 26.0.1, 26.0.3, 28.0.1
API Levels: 23, 26, 27, 28
IDEs:
Android Studio: 3.1 AI-173.4819257
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Description

The issue is that yellow box warnings can be triggered recursively by other yellow box warnings not having a unique key prop. I discovered this issue in a app that has had significant development, and I decided to test the issue in a brand new React Native app. I started up a brand new React Native 0.56 project using react-native init. When the app gets built onto an iOS (11.4) or Android (API 27) simulator, I can trigger the issue by toggling the inspector, tapping on any element, and then toggling on the "Touchables" feature of the inspector. The result I encounter is several yellow box warnings behind the inspector. Tapping on one of the warnings gives the following information:

screen shot 2018-07-13 at 8 59 52 pm

From what I can tell, the warnings recursively generate themselves. The simulator gradually uses more and more memory, and I haven't been able to dismiss all of the warnings by tapping dismiss on each one individually. If I tap "Dismiss All", all of the warnings are dismissed, and memory usage goes back down. If I disable the "Touchables" feature of the inspector and attempt to replicate the issue in the same instance of the application, it simply doesn't occur. However, if I reload the app on the simulator, I'm able to repeatably reproduce the bug once each time I reload it. I've attached a gif reproducing the issue below.

yellowboxissue_5

Reproducible Demo

I ran react-native init to create this project, and I made zero changes to it before demonstrating the bug. You can find the repo I used to produce this issue here: https://github.com/TheWildUnicorn/RNYellowBoxDemo

Thank you for your time and help!

Metadata

Assignees

No one assigned

    Labels

    StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions