Buggy behavior for views inside Animated views with absolute style.

[pvinis]

• Review the documentation: https://facebook.github.io/react-native
• Search for existing issues: https://github.com/facebook/react-native/issues
• Use the latest React Native release: https://github.com/facebook/react-native/releases

Environment

Environment:
  OS: macOS High Sierra 10.13.4
  Node: 9.11.1
  Yarn: 1.7.0
  npm: 5.6.0
  Watchman: 4.9.0
  Xcode: Xcode 9.4 Build version 9F1027a
  Android Studio: 3.1 AI-173.4819257

Packages: (wanted => installed)
  react: 16.3.1 => 16.3.1
  react-native: ~0.55.2 => 0.55.4

Description

ill show the problem first, and then describe it.
correct:

buggy:

i have a sidebar that is absolutely positioned. inside that sidebar i have one view, that has flex: 1, and its yellow. it covers the whole space.
inside that yellow view, i have one text view, that also has flex: 1, has some text, and pink background.
using the toggle button, i can hide and show the sidebar.

here is the problem. in the buggy case, i use the left style, so it moves between -40 and 0, so with -40 its hidden, and with 0 its shown. every time i show/hide the sidebar, the pink text view is getting weirdly resized, without me doing anything in code. the same bug happens with a simple view instead of the text.

the correct case is exactly the same, but has left: 0, and translate:[{transformX: <val>}] is the one having val go from -40 to 0.

from tests i did, if the left goes from 10 to 50, it works fine. so the problem lies in the left going negative.

somehow when there is an absolutely positioned view, with inside it a flex: 1 view, with inside that a view with flex: 1, and the outside-most view goes to negative left, the inside-most view gets resized.

Reproducible Demo

i put the project in that repo. its a basic crna app, with all the code in the App.js file. here is the repo:
https://github.com/pvinis/bug-react-native

[asciiman]

This works correctly in RN 0.53.3. It seems to have been introduced after that and up to 0.55.4.

[lunarraid]

This could be related to this: facebook/yoga#683

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[stale]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.