[SDK] Improve error messages for failed HTTP requests (#6734)

Author: joaquim-verges

.changeset/yummy-toys-hug.md

@@ -0,0 +1,5 @@
+---
+"thirdweb": patch
+---
+
+Better error messages for failed requests

apps/wallet-ui/src/lib/assets/erc721.ts

@@ -60,8 +60,10 @@ export async function getErc721Tokens({
   );
 
   if (!response.ok) {
-    response.body?.cancel();
-    console.error("Failed to fetch NFTs");
+    const error = await response.text().catch(() => null);
+    console.error(
+      `Failed to fetch NFTs: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+    );
     return {
       nextCursor: undefined,
       tokens: [],

apps/wallet-ui/src/lib/chains.ts

@@ -9,8 +9,10 @@ export async function getChains() {
   );
 
   if (!response.ok) {
-    response.body?.cancel();
-    throw new Error("Failed to fetch chains");
+    const error = await response.text().catch(() => null);
+    throw new Error(
+      `Failed to fetch chains: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+    );
   }
 
   return (await response.json()).data as ChainMetadata[];

packages/thirdweb/src/pay/buyWithCrypto/getHistory.ts

@@ -79,8 +79,10 @@ export async function getBuyWithCryptoHistory(
 
     // Assuming the response directly matches the SwapResponse interface
     if (!response.ok) {
-      response.body?.cancel();
-      throw new Error(`HTTP error! status: ${response.status}`);
+      const error = await response.text().catch(() => null);
+      throw new Error(
+        `HTTP error! status: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+      );
     }
 
     const data: BuyWithCryptoHistoryData = (await response.json()).result;

packages/thirdweb/src/pay/buyWithCrypto/getStatus.ts

@@ -142,8 +142,10 @@ export async function getBuyWithCryptoStatus(
 
     // Assuming the response directly matches the BuyWithCryptoStatus interface
     if (!response.ok) {
-      response.body?.cancel();
-      throw new Error(`HTTP error! status: ${response.status}`);
+      const error = await response.text().catch(() => null);
+      throw new Error(
+        `HTTP error! status: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+      );
     }
 
     const data: BuyWithCryptoStatus = (await response.json()).result;

packages/thirdweb/src/pay/buyWithFiat/getHistory.ts

@@ -78,8 +78,10 @@ export async function getBuyWithFiatHistory(
 
     // Assuming the response directly matches the BuyWithFiatStatus response interface
     if (!response.ok) {
-      response.body?.cancel();
-      throw new Error(`HTTP error! status: ${response.status}`);
+      const error = await response.text().catch(() => null);
+      throw new Error(
+        `HTTP error! status: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+      );
     }
 
     const data: BuyWithFiatHistoryData = (await response.json()).result;

packages/thirdweb/src/pay/buyWithFiat/getStatus.ts

@@ -188,8 +188,10 @@ export async function getBuyWithFiatStatus(
     const response = await getClientFetch(params.client)(url);
 
     if (!response.ok) {
-      response.body?.cancel();
-      throw new Error(`HTTP error! status: ${response.status}`);
+      const error = await response.text().catch(() => null);
+      throw new Error(
+        `HTTP error! status: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+      );
     }
 
     return (await response.json()).result;

packages/thirdweb/src/pay/getBuyHistory.ts

@@ -93,8 +93,10 @@ export async function getBuyHistory(
 
     // Assuming the response directly matches the SwapResponse interface
     if (!response.ok) {
-      response.body?.cancel();
-      throw new Error(`HTTP error! status: ${response.status}`);
+      const error = await response.text().catch(() => null);
+      throw new Error(
+        `HTTP error! status: ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+      );
     }
 
     const data: BuyHistoryData = (await response.json()).result;

packages/thirdweb/src/rpc/fetch-rpc.ts

@@ -72,9 +72,9 @@ export async function fetchRpc(
   });
 
   if (!response.ok) {
-    response.body?.cancel();
+    const error = await response.text().catch(() => null);
     throw new Error(
-      `RPC request failed with status ${response.status} - ${response.statusText}`,
+      `RPC request failed with status ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
     );
   }
 
@@ -116,8 +116,10 @@ export async function fetchSingleRpc(
   });
 
   if (!response.ok) {
-    response.body?.cancel();
-    throw new Error(`RPC request failed with status ${response.status}`);
+    const error = await response.text().catch(() => null);
+    throw new Error(
+      `RPC request failed with status ${response.status} - ${response.statusText}: ${error || "unknown error"}`,
+    );
   }
   if (response.headers.get("Content-Type")?.startsWith("application/json")) {
     return await response.json();

packages/thirdweb/src/transaction/actions/gasless/providers/biconomy.ts

@@ -139,7 +139,6 @@ export async function relayBiconomyTransaction(
     },
   );
   if (!response.ok) {
-    response.body?.cancel();
     throw new Error(`Failed to send transaction: ${await response.text()}`);
   }
   const json = await response.json();

packages/thirdweb/src/transaction/actions/gasless/providers/openzeppelin.ts

@@ -157,7 +157,6 @@ export async function relayOpenZeppelinTransaction(
   });
 
   if (!response.ok) {
-    response.body?.cancel();
     throw new Error(`Failed to send transaction: ${await response.text()}`);
   }
   const json = await response.json();