show detail error to api test

src/background.js

@@ -60,7 +60,7 @@ browser.runtime.onMessage.addListener(
             sendResponse({ data });
           })
           .catch((error) => {
-            sendResponse({ error: error.message });
+            sendResponse({ error: error.message, cause: error.cause });
           });
         break;
       case MSG_FETCH_LIMIT:

src/libs/fetch.js

@@ -127,7 +127,13 @@ export const fetchData = async (
     }
 
     if (!res?.ok) {
-      throw new Error(`response: ${res.statusText}`);
+      const cause = {
+        status: res.status,
+      };
+      if (res.headers.get("Content-Type")?.includes("json")) {
+        cause.body = await res.json();
+      }
+      throw new Error(`response: [${res.status}] ${res.statusText}`, { cause });
     }
 
     // 插入缓存
@@ -163,7 +169,7 @@ export const fetchPolyfill = async (input, opts) => {
   if (isExt && !isBg()) {
     const res = await sendBgMsg(MSG_FETCH, { input, opts });
     if (res.error) {
-      throw new Error(res.error);
+      throw new Error(res.error, { cause: res.cause });
     }
     return res.data;
   }

src/views/Options/Apis.js

@@ -46,7 +46,20 @@ function TestButton({ translator, api }) {
       }
       alert.success(i18n("test_success"));
     } catch (err) {
-      alert.error(`${i18n("test_failed")}: ${err.message}`);
+      // alert.error(`${i18n("test_failed")}: ${err.message}`);
+      alert.error(
+        <>
+          <div>{`${i18n("test_failed")}: ${err.message}`}</div>
+          <pre
+            style={{
+              maxWidth: 400,
+              overflow: "auto",
+            }}
+          >
+            {JSON.stringify(err.cause || {}, null, 2)}
+          </pre>
+        </>
+      );
     } finally {
       setLoading(false);
     }