chore: add stacks testnet support to WC connector

.changeset/afraid-animals-juggle.md

@@ -0,0 +1,5 @@
+---
+'@stacks/connect': patch
+---
+
+Add support for testnet with WalletConnect wallets

packages/connect/src/walletconnect/config.ts

@@ -28,6 +28,15 @@ export const stacksMainnet: CustomCaipNetwork<'stacks'> = {
   rpcUrls: { default: { http: ['https://api.mainnet.hiro.so'] } },
 };
 
+export const stacksTestnet: CustomCaipNetwork<'stacks'> = {
+  id: 2,
+  chainNamespace: 'stacks' as const,
+  caipNetworkId: 'stacks:2147483648',
+  name: 'Stacks Testnet',
+  nativeCurrency: { name: 'STX', symbol: 'STX', decimals: 6 },
+  rpcUrls: { default: { http: ['https://api.testnet.hiro.so'] } },
+};
+
 export const DEFAULT_WALLETCONNECT_CONFIG: Omit<UniversalConnectorConfig, 'projectId'> = {
   metadata: {
     name: 'Universal Connector',
@@ -38,7 +47,7 @@ export const DEFAULT_WALLETCONNECT_CONFIG: Omit<UniversalConnectorConfig, 'proje
   networks: [
     {
       namespace: 'stacks',
-      chains: [stacksMainnet as CustomCaipNetwork],
+      chains: [stacksMainnet, stacksTestnet],
       methods: stacksMethods,
       events: ['stx_chainChanged', 'stx_accountsChanged'],
     },

packages/connect/src/walletconnect/index.ts

@@ -5,10 +5,11 @@ import {
   JsonRpcResponse,
   MethodParamsRaw,
   MethodsRaw,
+  NetworkString,
   SignMessageResult,
 } from '../methods';
 import { StacksProvider } from '../types/provider';
-import { DEFAULT_WALLETCONNECT_CONFIG, stacksMainnet } from './config';
+import { DEFAULT_WALLETCONNECT_CONFIG, stacksMainnet, stacksTestnet } from './config';
 import { bitcoin } from '@reown/appkit/networks';
 
 function jsonRpcResponse<M extends keyof MethodsRaw>(result: unknown): JsonRpcResponse<M> {
@@ -108,8 +109,20 @@ class WalletConnectProvider implements StacksProvider {
     }
   }
 
-  private getTargetCaipNetworkId(method: keyof MethodsRaw) {
+  private getTargetCaipNetworkId<M extends keyof MethodsRaw>(
+    method: M,
+    params?: MethodParamsRaw<M>
+  ) {
     const accountMethods = ['getAddresses', 'stx_getAccounts', 'stx_getAddresses'];
+    const network = 'network' in params ? (params.network as NetworkString) : undefined;
+
+    if (network) {
+      return {
+        mainnet: stacksMainnet.caipNetworkId,
+        testnet: stacksTestnet.caipNetworkId,
+      }[network];
+    }
+
     if (accountMethods.includes(method)) {
       return stacksMainnet.caipNetworkId;
     }
@@ -133,7 +146,7 @@ class WalletConnectProvider implements StacksProvider {
   ): Promise<JsonRpcResponse<M>> {
     try {
       this.validateRpcMethod(method);
-      const caipNetworkId = this.getTargetCaipNetworkId(method);
+      const caipNetworkId = this.getTargetCaipNetworkId(method, params);
 
       switch (method) {
         case 'getAddresses':