argentlabs / argent-x

ArgentX browser extension for StarkNet - made with ❤️ by Argent

---

⬇️ Get Argent X for Starknet today:

---

🌈 Table of contents

• 🧒 Example dapp
• 🌐 Usage with your dapp
• 🚀 Install from sources
  • Chrome
  • Firefox
• 👩🏾‍💻 Development
• 🧪 Testing
  • Setup
  • Run devnet locally
  • Run tests
  • Tools to help with testing
• ✏️ Contributing
• ❤️ Family and friends
• 👨🏼‍🎨 Authors and license

🧒 Example dapp

You can try the extension using our example dapp hosted at:

https://argentlabs.github.io/argent-x/

The example dapp is also contained in this repository.

🌐 Usage with your dapp

If you want to use this Starknet Wallet extension with your dapp, the easiest way is to checkout the starknetkit package

# starknet.js is a peer dependency
pnpm add starknetkit starknet

import { connect } from "starknetkit"

// Let the user pick a wallet (on button click)
const starknet = connect()

if (!starknet) {
  throw Error("User rejected wallet selection or silent connect found nothing")
}

// (optional) connect the wallet
await starknet.enable()

// Check if connection was successful
if(starknet.isConnected) {
    // If the extension was installed and successfully connected, you have access to a starknet.js Signer object to do all kinds of requests through the user's wallet contract.
    starknet.account.execute({ ... })
} else {
    // In case the extension wasn't successfully connected you still have access to a starknet.js Provider to read starknet states and sent anonymous transactions
    starknet.provider.callContract( ... )
}

Checkout starknet.js to learn more about how to use Provider and Signer.

🚀 Install from sources

First clone this repository on your machine then run:

pnpm run setup  # setup dependencies
pnpm build  # run build process for all packages

Now you need to load the locally built chrome extension into your browser, by loading an unpacked extension from path packages/extension/dist:

Chrome

1. Open the Extension Management page by navigating to chrome://extensions.
2. Enable Developer Mode by clicking the toggle switch next to Developer mode.
3. Click the Load unpacked button and select the extension directory.

Source

Firefox

1. Open the Extension Management page by navigating to about:debugging#/runtime/this-firefox
2. Select the manifest.json from the dist folder

Source

👩🏾‍💻 Development

To contribute to this repository please read the contributing guidelines first.

To setup the repo on your machine just run:

pnpm run setup # setup dependencies
pnpm dev   # run build process for all packages in watch mode

This project contains 3 packages:

package	description
extension	Argent X extension
get-starknet	npm module to get started with starknet.js and Argent X quickly
dapp	example dapp for testing purposes and example for dapps how to use get-starknet

To test changes made to the extension package you need to load the local unpacked extension into Chrome as described above. Changes are shown after reopening the extension. Changes to background.js are just shown after a complete restart of the Chrome process.

🧪 Testing

Setup

Some tests require starknet-devnet to be available at http://127.0.0.1:5050/. If tests are run without then you may see errors including connect ECONNREFUSED 127.0.0.1:5050.

Run devnet locally

For convenience this service can be started with Docker desktop running;

• For ARM computers (e.g. Mac computers with Apple silicon)

  docker run -it -p 5050:5050 shardlabs/starknet-devnet:latest-arm-seed0

• Otherwise

  docker run -it -p 5050:5050 shardlabs/starknet-devnet:latest-seed0

Run tests

pnpm test      # run unit tests for all packages
pnpm test:e2e  # run end-to-end tests for all packages

Tools to help with testing

See also /docs/tools-for-local-testing.md

✏️ Contributing

Everyone is welcome to contribute. Please take a moment to review the contributing guidelines.

❤️ Family and friends

Since this project would not have been possible without starknet.js, we would like to say a big thank you to all starknet.js contributors and @0xs34n for starting it.

One more thank you to the StarkWare Team.

👨🏼‍🎨 Authors and license

Argent and contributors.

See the included License.md file.