Skip to main content

Quickstart

This guide will explore the basics of creating a simple WasmKit project.

WasmKit allows you to compile your Rust code, generate schema for it, run your scripts, tests and deploy to network, interact with contract instance on the network.

To create your WasmKit project, run:


wasmkit init <project-name>
# or
wasmkit init yellow #example

The generated directory will have the following initial structure:


.
├── Cargo.toml
├── README.md
├── contracts
│   └── counter
│   ├── Cargo.toml
│   ├── LICENSE
│   ├── README.md
│   ├── examples
│   │   └── schema.rs
│   └── src
│   ├── contract.rs
│   ├── error.rs
│   ├── lib.rs
│   ├── msg.rs
│   └── state.rs
├── package.json
├── scripts
│   └── sample-script.ts
├── test
│   ├── sample-test.ts
│   └── tsconfig.json
├── tsconfig.json
└── wasmkit.config.js
7 directories, 17 files

The contracts/ directory has all the rust files for the contract logic. scripts/ directory can contain .ts scripts that user can write according to the use case, a sample script has been added to give some understanding of how a user script should look like. test/ directory contains .ts scripts to run tests for the deployed contracts.

Listing tasks​

To see the possible tasks (commands) that are available, run wasmkit in your project's folder:


wasmkit help

This is the list of built-in tasks. This is your starting point to find out what tasks are available to run.

Compiling contracts​

To compile all the contracts in the project, use:


wasmkit compile

To compile only one contracts or a subset of all contracts in the project, use:


wasmkit compile <contract-source-dir>

To skip schema generation while compiling use:


wasmkit compile --skip-schema

This command will generate following:

  1. Contract binary files --> artifacts/contracts/*.wasm
  2. Schema files --> artifacts/schema/<contract-name>/*.json
  3. Typescript contract client files --> artifacts/typescript_schema/*.ts

Get network information​

Getting network information can be useful to verify if the wasmkit.config.js file has the right network configutaion or to check if the network is currently operational. Node information (chainId, blockHeight) can be fetched as follows:


wasmkit node-info

To get info of a non-default network:


wasmkit node-info --network testnet # if testnet config present in wasmkit.config.js

Running user scripts​

User scripts are a way to define the flow of interacting with contracts on some network in form of a script. These scripts can be used to deploy a contract, query/transact with the contract.

A sample script scripts/sample-script.ts is available in the boilerplate. Contents of the script is as follows:


_39
import { getAccountByName } from "@kubiklabs/wasmkit";
_39
_39
import { CounterContract } from "../artifacts/typescript_schema/CounterContract";
_39
_39
export default async function run () {
_39
const runTs = String(new Date());
_39
const contract_owner = await getAccountByName("account_0");
_39
const counter_contract = new CounterContract();
_39
await counter_contract.setupClient();
_39
_39
const deploy_response = await counter_contract.deploy(
_39
contract_owner,
_39
);
_39
console.log(deploy_response);
_39
_39
const contract_info = await counter_contract.instantiate(
_39
{
_39
"count": 102,
_39
},
_39
`deploy test ${runTs}`,
_39
contract_owner,
_39
undefined, // transferAmount
_39
// customFees, // custom fees here
_39
);
_39
console.log(contract_info);
_39
_39
const inc_response = await counter_contract.increment({account: contract_owner});
_39
console.log(inc_response);
_39
_39
const response = await counter_contract.getCount();
_39
console.log(response);
_39
_39
const ex_response = await counter_contract.increment(
_39
{
_39
account: contract_owner,
_39
}
_39
);
_39
console.log(ex_response);
_39
}

Detailed overview of writing scripts is given in the Writing scripts section.

The script above deploys, inits contract counter using account account_0 (account details in wasmkit.config.js file). It then executes a transaction increment() on the contract again using account_0 as signer account. Afterwards, it queries and logs the getCount() query to query the count stored in the contract and finally executes increment() one more time.

For the above script to be able to run, an account with name account_0 must be present in wasmkit.config.js and contract artifacts (compiled .wasm, schema .json files and typescript client .ts files) in artifacts/ directory must be present for contract counter.

Running test scripts​

Test scripts are used to test the contract after deploying it to the network and asserting on the interactions with the contract instance.

A sample test script test/sample-test.ts is available in the boilerplate. Contents of the script is as follows:


_40
import { use } from "chai";
_40
import { getAccountByName, wasmKitChai } from "@kubiklabs/wasmkit";
_40
_40
import { CounterContract } from "../artifacts/typescript_schema/CounterContract";
_40
_40
use(wasmKitChai);
_40
_40
describe("counter", () => {
_40
async function setup() {
_40
const contract_owner = await getAccountByName("account_0");
_40
const contract = new CounterContract();
_40
await contract.setupClient();
_40
_40
return { contract_owner, contract };
_40
}
_40
_40
it("deploy and init", async () => {
_40
const runTs = String(new Date());
_40
const { contract_owner, contract } = await setup();
_40
const deploy_response = await contract.deploy(
_40
contract_owner,
_40
{ // custom fees
_40
amount: [{ amount: "90000", denom: "untrn" }],
_40
gas: "35000000",
_40
}
_40
);
_40
console.log(deploy_response);
_40
_40
const contract_info = await contract.instantiate(
_40
{
_40
"count": 102,
_40
},
_40
`deploy test ${runTs}`,
_40
contract_owner,
_40
undefined, // tokens to tranfer
_40
// customFees, // custom fess here
_40
);
_40
console.log(contract_info);
_40
});
_40
});

Detailed overview of testing is given in the Guides section.

WebUI for contracts​

Wasmkit can help automatically generate a Web based playground interface which is instrumental when quickly testing certain contract interactions. This is beneficial when doing one-time quick interactions for which writing a script does not make much sense.

This can be leveraged by either QA to do interactions with random values quickly or for the end user to directly communicate with a contract through a web interface without requiring any development environment setup.

Generate plaground interface, once the contracts are deployed:


wasmkit playground

Run the playground locally:


cd plaground
yarn start

**Note: ** This playground is minimal React application that can run locally or hosted online with a domain for others to use just like any other React application.

Interactive scripting with REPL​

REPL (read–eval–print loop) gives the a console to do real time interactions with the network. Open the REPL using wasmkit repl --network <network-name>. Sample REPL interaction shown below as follows:


wasmkit repl
★★★ Welcome to wasmkit REPL ★★★
Try typing: config
wasmkit> config
{
name: 'default',
config: {
endpoint: 'https://rpc-palvus.pion-1.ntrn.tech/',
chainId: 'pion-1',
accounts: [ [Object] ],
fees: { upload: [Object], init: [Object], exec: [Object] }
}
}

When REPL is opened, wasmkit library is already imported, use wasmkit. to access classes and functions from the library. wasmkit Runtime Environment can be access using env variable and wasmkit.config.js data can be accessed using config variable.

Cleanup artifacts​

To clear artifacts data, use wasmkit clean and to clean artifacts for only one contract, use:


wasmkit clean <contract-name>