Skip to content
New issue

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

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

Already on GitHub? # to your account

Cannot call another worklet from worklet #136

Open
mrousavy opened this issue Jan 11, 2024 · 6 comments
Open

Cannot call another worklet from worklet #136

mrousavy opened this issue Jan 11, 2024 · 6 comments

Comments

@mrousavy
Copy link
Member

Calling an inlined worklet from an existing worklet breaks, presumably because of some mistake in the babel plugin.

This code breaks:

const context1 = Worklets.createContext('context1')
const context2 = Worklets.createContext('context2')
const runAsync = Worklets.createRunInContextFn((func: () => void) => {
  'worklet'
  try {
    // Call long-running function
    func()
  } catch (e) {
    // Re-throw error on JS Thread
    throwJSError(e)
  }
}, context2)

const runNormalWorklet = Worklets.createRunInContextFn(() => {
  'worklet'
  
  console.log('running from context1!')
  runAsync(() => {
    'worklet'
    console.log('running from context2!')
  })
}, context1)

runNormalWorklet()

But when we lift out the nested worklet function outside from the existing worklet, it works:

+ const fn = () => {
+   'worklet'
+   console.log('running from context2')
+ }

 const runNormalWorklet = Worklets.createRunInContextFn(() => {
   'worklet'
  
   console.log('running from context1!')
-  runAsync(() => {
-    'worklet'
-   console.log('running from context2!')
-  })
+  runAsync(fn)
 }, context1)

I'm guessing this is an incompatibility with the Reanimated plugin again.

    "react-native-worklets-core": "0.2.4",
    "react-native-reanimated": "^3.5.4",
@MSchmidt
Copy link

Hey, just here to confirm that it's an incompatibility with Reanimated. I create a few test projects with and without expo, with and without Reanimated. It starts to fail as soon as the reanimated plugin is loaded in babel.config.js.

@mrousavy
Copy link
Member Author

You're right - you can fix this if you enabled processNestedWorklets in the Reanimated plugin! See software-mansion/react-native-reanimated#5576 (comment) for more info

@iamfat
Copy link

iamfat commented Apr 12, 2024

@mrousavy, i am still facing this issure currently. I'm not using reanimated, but i'm using tamagui which has reanimated as a dep. I tried add processNestedWorklets to babel.config.js but it did not work.

runAsync won't work in useFrameProcessor with react-native-vision-camera@3.9.2, react-native-worklets-core@0.4.0,react-native-reanimated@3.8.1 (deps of @tamagui/config)...

@mrousavy
Copy link
Member Author

Did you enable processNestedWorklets in reanimated babel plugin?

@iamfat
Copy link

iamfat commented Apr 12, 2024

I did it in babel.config.js of my project. Is that correct?

module.exports = {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: [
        ['react-native-worklets-core/plugin'],
        ['react-native-reanimated/plugin', { processNestedWorklets: true }],
    ],
};

@ChristopherGabba
Copy link

@mrousavy I'm experience occasional crashes in my app with this. How much would this bug fix cost us ($$) to get some priority behind?

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

No branches or pull requests

4 participants