[IOS] Not able to press on components after closing a modal

LauraBeatris commented 4 years ago

Description

I'm not able to press on other components after closing a modal

React Native version:

0.63.0

Steps To Reproduce

After loading the screen, try to interact with the components
Open the popup by clicking in the bottom button
Try to interact with the components again

The video reproducing the issue: https://streamable.com/1bb89k

Expected Results

The components should stay interactable after closing the modal

Link to the repository:

https://github.com/LauraBeatris/bill-splitting

Gustash commented 4 years ago

It seems like your example is using react-native-modal. Have your tried using the bundled in Modal from react-native to check if this still happens there?

LauraBeatris commented 4 years ago

@Gustash Yup! And nothing changes since react-native-modal uses the built-in Modal from react-native too.

manatee420 commented 4 years ago

Does this only happen in debug mode or also in a release version? Did you try disabling flipper (e.g. comment out InitializeFlipper(application); in AppDelegate.m)?

Gustash commented 4 years ago

@LauraBeatris I've cloned and run the project, tried to replicate this but couldn't. Is there anything specific about your setup that could be causing this?

LauraBeatris commented 4 years ago

@manatee420 @Gustash That's really strange...

I tested in physical devices and it's working for both Android and IOS. Turns out that I disabled Flipper and the app is working fine now in the simulators.

Gustash commented 4 years ago

I tested with Flipper though, and it worked. So it's definitely strange

Gustash commented 4 years ago

Classic "works on my machine" scenario lol

dpnolte commented 4 years ago

To add to the confusion, I have the same or a similar issue for a private project where I upgraded from 62.2 to 63.2. After the update, the issue appeared. It occurs for both alerts and modals after presentViewController is executed to present the view controller modally. When dismissed, the alertController is no longer coupled to the presentingViewController there but the UITransitionView with the transparent background is still there:

This is strange, because when I look at the backtrace the transition did finish:

* thread #1, queue = 'com.apple.main-thread', stop reason = breakpoint 10.1
  * frame #0: 0x000000010617829b OudersVanNuApp`__42-[RCTAlertManager alertWithArgs:callback:]_block_invoke_4(.block_descriptor=0x00007f8688333410, action=0x00007f8688335a60) at RCTAlertManager.mm:193:37
    frame #1: 0x00007fff481fd994 UIKitCore`-[UIAlertController _invokeHandlersForAction:] + 105
    frame #2: 0x00007fff481fe314 UIKitCore`__103-[UIAlertController _dismissAnimated:triggeringAction:triggeredByPopoverDimmingView:dismissCompletion:]_block_invoke.458 + 16
    frame #3: 0x00007fff484ed5f2 UIKitCore`-[UIPresentationController transitionDidFinish:] + 947
    frame #4: 0x00007fff484f20ec UIKitCore`__56-[UIPresentationController runTransitionForCurrentState]_block_invoke.503 + 199
    frame #5: 0x00007fff4860a7f3 UIKitCore`-[_UIViewControllerTransitionContext completeTransition:] + 90
    frame #6: 0x00007fff491869c0 UIKitCore`-[UIViewAnimationBlockDelegate _didEndBlockAnimation:finished:context:] + 671
    frame #7: 0x00007fff4915764d UIKitCore`-[UIViewAnimationState sendDelegateAnimationDidStop:finished:] + 220
    frame #8: 0x00007fff49157c44 UIKitCore`-[UIViewAnimationState animationDidStop:finished:] + 276
    frame #9: 0x000000010c024888 UIKit`-[UIViewAnimationStateAccessibility animationDidStop:finished:] + 118
    frame #10: 0x00007fff49157dca UIKitCore`-[UIViewAnimationState animationDidStop:finished:] + 666
    frame #11: 0x000000010c024888 UIKit`-[UIViewAnimationStateAccessibility animationDidStop:finished:] + 118
    frame #12: 0x00007fff2b4d8c0c QuartzCore`CA::Layer::run_animation_callbacks(void*) + 306
    frame #13: 0x0000000109f4fe8e libdispatch.dylib`_dispatch_client_callout + 8
    frame #14: 0x0000000109f5dd97 libdispatch.dylib`_dispatch_main_queue_callback_4CF + 1149
    frame #15: 0x00007fff23da0909 CoreFoundation`__CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ + 9
    frame #16: 0x00007fff23d9b459 CoreFoundation`__CFRunLoopRun + 2041
    frame #17: 0x00007fff23d9a944 CoreFoundation`CFRunLoopRunSpecific + 404
    frame #18: 0x00007fff38ba6c1a GraphicsServices`GSEventRunModal + 139
    frame #19: 0x00007fff48c8b9ec UIKitCore`UIApplicationMain + 1605
    frame #20: 0x0000000105ab0a20 OudersVanNuApp`main(argc=1, argv=0x00007ffeea150cc8) at main.m:7:12
    frame #21: 0x00007fff51a231fd libdyld.dylib`start + 1
    frame #22: 0x00007fff51a231fd libdyld.dylib`start + 1

With the remaining UITransitionView, any gestures are blocked by it.

I've tried to recreate a minimal repo to share it here. But I was not able to reproduce it in a new project, even with all dependencies included, same JS code, same project settings. This makes me really puzzled of what is going on here and how to debug this further. If anyone has a clue, that would be greatly appreciated. In the mean time, I try to investigate this further.

LauraBeatris commented 4 years ago

@dpnolte Thanks for bringing more details to the discussion!

I don't understand a lot about the native code so what I tried to do was to inspect the IOS layout in Flipper, and indeed, there was a remaining view there which makes it impossible to perform any gesture.

Gustash commented 4 years ago

This seems to me like a race condition. @dpnolte when you had that issue, was it consistently giving you this problem? Or was it occasional?

dpnolte commented 4 years ago

Thanks for the responses! The problem seems to be cleared by simply clearing the build folder. I thought that I had done that a thousand times, but apparently I didn't. 🤦 It seems that an earlier build cache with minimal platform 9.0 caused this peculiar issue.

Gustash commented 4 years ago

So it seems like a build caching issue on both sides, instead of a platform issue.

dmitryusikriseapps commented 4 years ago

I faced the same issue. Disabling Flipper helped me too. Is there a solution here?

jcbdev commented 4 years ago

I have this issue on a project I update from 0.62.2 to 0.63.2. I have used npx react-native-clean-project a million times but all popups freeze the screen. I can see that the app hasn't actually crashed though as subscription events are still re-rerendering underneath, its just all touch input no longer works.

I can get it to work if I disable flipper.

Is there something that isn't getting cleaned by the tool npx react-native-clean-project that I need to do?

jcbdev commented 4 years ago

Fixed this. For anyone interested these are the steps I had to follow:

Close everything (of course)
Open .xcworkspace in xcode. Cmd-Shift-K to clean build (I also tried Cmd-Shift-Option-K)
Close xcode
delete the contents of folder ~/Library/Developer/Xcode/DerivedData (I think this is the key tbh)
open simulator -> Device -> Erase all contents and settings
Close simulator
Edit AppDelegate.m and comment out flipper (not sure if this is needed but just doing exactly what I did)
npx react-native-clean-project (Yes for all ios options except update brew and clean android)
yarn ios (or react-native run-ios)
should work now!
enable flipper in AppDelegate.m
yarn ios
Still works now!!!

EDIT: It doesn't work 😢 . After having flipper open for a bit it comes back. If I leave flipper closed it works fine so it's something to do with flipper

Gustash commented 4 years ago

Okay, so it seems like this issue should be moved to the flipper repo instead, everything seems to be pointing to it being the issue

anfriis commented 4 years ago

Related issue in Flipper repo: https://github.com/facebook/flipper/issues/1399#issue-664783884

anfriis commented 4 years ago

I think this issue could be closed, as it seems that the bug is caused by Flipper: https://github.com/facebook/flipper/issues/1399#issuecomment-680798589

LauraBeatris commented 4 years ago

Sure!! Let's continue the discussion there

mweststrate commented 4 years ago

Just as update for those following this issue: It seems that an outdated version of Flipper was shipped with RN. We'll make sure to fix that, as a temporarily workaround see https://github.com/facebook/flipper/issues/1399#issuecomment-680971940. Also see that thread for further follow-ups.

mweststrate commented 4 years ago

Simpler solution, in ios/Podfile change use_flipper! to use_flipper!('Flipper' => '0.54.0') and run pod install afterwards in ios dir

anfriis commented 4 years ago

@mweststrate Awesome, this fix also works for me 👍🏼 I got an error when running pod install, so remember to run pod repo update

facebook / react-native