React Native Solana Magic RPC Error: [-32603] Internal error: Expected Buffer

✅ Prerequisites

• Did you perform a cursory search of open issues? Is this bug already reported elsewhere? https://github.com/magiclabs/magic-js/issues/87
• Are you running the latest SDK version?
• Are you reporting to the correct repository (magic-sdk)?

🐛 Description

When Signing Solana Transactions in a React Native app the RPC request will fail with the error:

 LOG  {"feePayer":"3QbZSyrxLsh3Jcuo5Xr5opoCeV5NfruBy8SVGHFVxGy2","instructions":[{"keys":[{"pubkey":"3QbZSyrxLsh3Jcuo5Xr5opoCeV5NfruBy8SVGHFVxGy2","isSigner":true,"isWritable":false},{"pubkey":"QfX7iD47JbWHvZAo4ByFm6BVq7dePr16Z9bEfzTCska","isSigner":false,"isWritable":true}],"programId":"76vzBwHg7GYZc6uKyzKvQb9NoZeALMvBVGdS5VJrcLs7","data":{"type":"Buffer","data":[3,218,52,49,1,41,52,49,1,5,54,49,1,177,50,49,1,52,47,49,1,55,52,49,1,175,50,49,1,82,54,49,1,0,0,0,0,0,0]}}],"recentBlockhash":"2hUMXihEUHrUsJb81ogtDdtd1FGWTdW7vhijNh1nWF6g","serializeConfig":{"requireAllSignatures":false,"verifySignatures":true}}
 
ERROR  [Error: Magic RPC Error: [-32603] Internal error: Expected Buffer]

🧩 Steps to Reproduce

1. Create a React Native App
2. Attempt to sign any solana transaction (transfer from the docs works well): https://magic.link/docs/advanced/blockchains/solana#sign-transaction
3. Attempt to actually run that code and it will fail.

🤔 Expected behavior

The transaction should be signed successfully.

😮 Actual behavior

The transaction fails with the error ERROR [Error: Magic RPC Error: [-32603] Internal error: Expected Buffer]

💻 Code Sample

It is really good to note that this EXACT same code works in a web browser with no problems. So this is an issue that is specific to React Native. I know to get Buffer there needs to be a use of polyfills, so my guess is the polyfills do not line up even thought they both serialize to the same JSON string/structure. Would love to get a workaround for this issue ASAP.

signTransaction: async (transaction) => {
      const serializeConfig = {
        requireAllSignatures: false,
        verifySignatures: true,
      };

      return (
        await magic.solana.signTransaction(
          transaction,
          serializeConfig
        )
      ).rawTransaction;
    },
  };

🌎 Environment

Software	Version(s)
@magic-sdk/react-native	7.0.0
@magic-ext/solana	3.0.1
Browser	react native
yarn	1.22.17
Operating System	ios 15

[Ethella]

If it does not involve extra complexity, I think I can wrap it up this week.

[bmeeder22]

Hey @Ethella @smithki

I am testing this fix using the demo application that I created and shared in the ticket. Even after pulling in "@magic-sdk/react-native": "8.1.0" and "@magic-ext/solana": "4.0.1" I am still getting the exact name issue.