How to encode an extrinsic for RPC from a web client?

Question

I need to programmatically pack an extrinsic for an RPC, I believe I'm looking for the following front-end functionality:

• extract relevant indices from the Metadata
• fill the extrinsic parameters
• properly Scale/hex encode it, be it signed or unsigned exactly as PolkadotJS app does. Something like this Rust code, but for the front-end: https://github.com/paritytech/polkadot-interaction-examples-rs/blob/main/src/bin/05_transfer_balance.rs

Please could anyone indicate me relevant packages in the PolkadotJS sources that do the job, maybe some code snippets that demonstrate the codification routine ?

Answer 1

I believe this is the library you want to use txwrapper-core, is a set of tools to quickly create, test, and maintain a library of helper functions for offline transaction generation with your chain.

An example you can use as a reference about how to use it is here: https://github.com/paritytech/txwrapper-core/blob/main/packages/txwrapper-examples/polkadot/src/polkadot.ts

First it gets the metadata with state_getMetadata, with this creates the Polkadot's type registry and then it construct the extrinsic with the help of the library @substrate/txwrapper-polkadot. The example also shows you how to generate the signed extrinsic and how to send it to the node within the RPC author_submitExtrinsic.

Another option to encode/decode SCALE with typescript is the library parity-scale-codec-ts. You can see an example of how to use it in this previous StackExchange answer: How to handle XCM encoding and building in JavaScript