cawfree / react-native-webassembly

⚛️ 🏎 WebAssembly for React Native powered by JSI.
https://twitter.com/cawfree
MIT License
321 stars 6 forks source link

Error: Unable to bind Webassembly to React Native JSI., js engine: hermes #28

Open greynewell opened 7 months ago

greynewell commented 7 months ago

Hello there, @cawfree! First of all, incredible work on this library - I'm hoping it'll help me solve a very relevant problem for a project I'm working on to enable Matrix.org JS SDK in React Native Expo: https://github.com/greynewell/example-expo-matrix-js-sdk/issues/2

I'm attempting to load some Rust crypto cyphers into the React Native runtime to support end-to-end encryption using your WASM binding, and getting the following error when I try:

ERROR  Error: Unable to bind Webassembly to React Native JSI., js engine: hermes 
    at ContextNavigator (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:148978:24)
    at ExpoRoot (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:148934:28)
    at App
    at ErrorToastContainer (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:378338:24)
    at ErrorOverlay
    at withDevTools(ErrorOverlay) (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:377872:27)
    at RCTView
    at View (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40346:43)
    at RCTView
    at View (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40346:43)
    at AppContainer (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:40157:36)
    at main(RootComponent) (http://<MY_IP:PORT>/node_modules/expo-router/entry.bundle//&platform=ios&dev=true&hot=false&lazy=true&transform.engine=hermes&transform.bytecode=true&transform.routerRoot=app:123933:28)

I'm not quite sure what the issue might be, but could you help me get pointed in the right direction? I've tried reinstalling, prebuilding, restarting the simulator, testing on a real device, and just about everything else I can think of.

greynewell commented 7 months ago

FWIW, it also looks like someone else had this same problem on the day of release: https://www.reddit.com/r/reactnative/comments/122a86d/comment/k0i9hzj/?utm_source=share&utm_medium=web3x&utm_name=web3xcss&utm_term=1&utm_content=share_button

greynewell commented 7 months ago

After binding WebAssembly from this lib to global.WebAssembly, output looks more like this while loading libolm (which is presumably using the global WebAssembly provided by this lib):

 DEBUG  Crypto: Starting up crypto store...
 DEBUG  Crypto: initialising roomlist...
 DEBUG  Crypto: initialising crypto object...
 DEBUG  Crypto: initialising Olm...
 WARN  Aborted(no native wasm support detected)
 ERROR  no native wasm support detected

I am unsure if I've simply bound your implementation wrong or what, but there are also type errors when comparing between this implementation and the global.WebAssembly object - not sure if that's related, though.

rayan1810tria commented 5 months ago

@greynewell were you able to fix this?

nitesh-habilelabs commented 4 months ago

@greynewell i am also trying to integrate matrix into my react native app. can you please let me know if you were able to fix this webassembly issue?

i am using legacy olm version to bypass the wasm part but i am unable to make my session verified and unable to decrypt the message or able to create encrypted room from my app.

although i am able to send message in an encrypted room but it shows that “encrypted message was sent from an unverified or deleted device”

any help is highly appreciated. Thank you.

nitesh-habilelabs commented 4 months ago

@greynewell were you able to fix this?

hi, did you find anything regarding e2ee encryption and decryption in react native app for matrix?

greynewell commented 4 months ago

FWIW, I am no longer working on the project where this mattered to me. I am leaving this open for the others who have experienced the same issue.

cawfree commented 4 months ago

It looks like a pretty generic error. Has anyone tried running the example?

ghost commented 2 months ago

It doesn't work for me either - I added WebAssembly according to instructions and try to load a rust crypto library for matrix, however, it fails with some generic error like: (NOBRIDGE) ERROR WebAssembly test failed: [Error: Expected string, encountered symbol.]

Here's the code I'm using for testing:

if (typeof global.WebAssembly === 'undefined') {
  global.WebAssembly = WebAssembly;
}

console.log(global.WebAssembly)

const testWebAssembly = async () => {
  try {
    const {
      data: bufferSource,
    } = await axios({
      url: 'https://github.com/torch2424/wasm-by-example/raw/master/examples/hello-world/demo/assemblyscript/hello-world.wasm',
      method: 'get',
      responseType: 'arraybuffer',
    });

    const module = await WebAssembly.instantiate(bufferSource);
    console.log('WebAssembly test passed:', module, module.instance.exports.add(1, 2));

  } catch (error) {
    console.error('WebAssembly test failed:', error);
  }
};

testWebAssembly();
myarete commented 1 month ago

Running pod install inside the ios folder manually fixed this for me (after expo prebuild --platform ios). I'm using a development client on the latest expo version.