Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expo SDK 44: AnimatePresence + MotiView crash #141

Closed
hirbod opened this issue Dec 22, 2021 · 6 comments
Closed

Expo SDK 44: AnimatePresence + MotiView crash #141

hirbod opened this issue Dec 22, 2021 · 6 comments

Comments

@hirbod
Copy link

hirbod commented Dec 22, 2021

Hi,

a simple

        <AnimatePresence exitBeforeEnter>
          {cameraPosition === 'back' && (
            <MotiView
              key="torch"
              from={{
                opacity: 0,
                scale: 0.9
              }}
              animate={{
                opacity: 1,
                scale: 1
              }}
              exit={{
                opacity: 0,
                scale: 0.9
              }}
            >
              <PressableOpacity
                style={styles.button}
                onPress={onFlashPressed}
                disabledOpacity={0.4}
              >
                <Ionicons
                  name={flash === 'on' ? 'flash' : 'flash-off'}
                  color="white"
                  size={24}
                />
              </PressableOpacity>
            </MotiView>
          )}
        </AnimatePresence>

crashed the app for me. Had to boot XCode in order to get the message:

2021-12-22 10:20:23.980439+0100 development[5573:1639062] [native] Tried to synchronously call anonymous function from a different thread.

Occurred in worklet location: /Users/hirbod/.../node_modules/react-native-reanimated/lib/reanimated2/hook/useAnimatedStyle.js (332:24)

Possible solutions are:
a) If you want to synchronously execute this method, mark it as a Worklet
b) If you want to execute this method on the JS thread, wrap it using runOnJS
@hirbod hirbod changed the title Expo SDK 44: AnimatePresence + MotiView Expo SDK 44: AnimatePresence + MotiView crash Dec 22, 2021
@hirbod
Copy link
Author

hirbod commented Dec 22, 2021

It doesn't even depend on AnimatePresence. I can't run a simple transition. It breaks always.

@hirbod
Copy link
Author

hirbod commented Dec 22, 2021

Found the issue:
EXPO_USE_EXOTIC=1 is the reason. @EvanBacon might know the root cause here.

@nandorojo
Copy link
Owner

Maybe you have multiple versions of framer? yarn why framer

Closing since it doesn’t seem Moti-specific

@EvanBacon
Copy link

Exotic will skip the moti package name in Metro the same way Webpack auto skips moti. Learn how to fix here.

const { createExoticTransformer } = require('@expo/metro-config/transformer');

module.exports = createExoticTransformer({
  transpileModules: ['moti'],
});

@hirbod
Copy link
Author

hirbod commented Jan 11, 2022

Nice @EvanBacon. Thank you!

@cybercris
Copy link

Nice @EvanBacon. Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants