fix(Network): handle binary iterable request bodies

CHANGELOG.md

@@ -12,6 +12,7 @@ English | [简体中文](./CHANGELOG_CN.md)
 - `Fix(Log)` Fix unescaped quotation marks in Tree view and copied JSON output. (PR #678)
 - `Fix(Storage)` Fix storage key modification failure caused by reactive state being cleared during remove operation. (issue #690, PR #709)
 - `Fix(Network)` Fix `WebAssembly.instantiateStreaming` type error caused by fetch proxy wrapping wasm responses. (issue #590, PR #711)
+- `Fix(Network)` Fix `TypeError` when formatting binary iterable request bodies such as `Uint8Array` in the Network panel.
 - `Fix(Network)` Fix wasm files being fetched twice when the Network panel is open, caused by `resp.clone()` teeing the body stream before the wasm check. (issue #674)
 - `Fix(Network)` Fix `result.value` maybe `undefined` when stream reading is done. (PR #715)
 - `Fix(Network)` Fix error when fetching `text/event-stream` (SSE) responses, caused by attempting to read the full response body instead of treating it as a stream. (issue #686)
@@ -562,4 +563,4 @@ Plugins:
 
 ## v1.0.2 (2016-04-27)
 
-- Initial release.
+- Initial release.

CHANGELOG_CN.md

@@ -12,6 +12,7 @@
 - `Fix(Log)` 修复 Tree 视图及复制 JSON 时字符串值中引号未转义的问题。(PR #678)
 - `Fix(Storage)` 修复因 remove 操作触发响应式状态重置导致 Storage key 修改失败的问题。(issue #690, PR #709)
 - `Fix(Network)` 修复 fetch proxy 包装 wasm 响应导致 `WebAssembly.instantiateStreaming` 类型错误的问题。(issue #590, PR #711)
+- `Fix(Network)` 修复 Network 面板格式化 `Uint8Array` 等二进制 iterable 请求体时抛出 `TypeError` 的问题。
 - `Fix(Network)` 修复开启 Network 面板时 wasm 文件被加载两次的问题，根本原因是 `resp.clone()` 在 wasm 检查之前对 body stream 进行了 tee 操作。(issue #674)
 - `Fix(Network)` 修复 stream 读取完成时 `result.value` 可能为 `undefined` 的问题。(PR #715)
 - `Fix(Network)` 修复抓取 `text/event-stream`（SSE）响应时报错的问题，根本原因是代码尝试整体读取响应体，而非将其作为流处理。(issue #686)
@@ -560,4 +561,4 @@ Network 插件：
 
 ## v1.0.2 (2016-04-27)
 
-- 初始发布。
+- 初始发布。

src/network/helper.ts

@@ -67,6 +67,14 @@ export const genResonseByResponseType = (responseType: string, response: any) =>
   return ret;
 };
 
+const isKeyValueIterableBody = (body: BodyInit) => {
+  return (
+    (typeof FormData !== 'undefined' && body instanceof FormData)
+    || (typeof URLSearchParams !== 'undefined' && body instanceof URLSearchParams)
+    || tool.isArray(body)
+  );
+};
+
 /**
  * Generate formatted response body by XMLHttpRequestBodyInit.
  */
@@ -89,10 +97,17 @@ export const genFormattedBody = (body?: BodyInit) => {
         }
       }
     }
-  } else if (tool.isIterable(body)) {
-    // FormData or URLSearchParams or Array
+  } else if (isKeyValueIterableBody(body) && tool.isIterable(body)) {
+    // FormData or URLSearchParams or key-value Array
     ret = {};
-    for (const [key, value] of <FormData | URLSearchParams>body) {
+    for (const entry of <Iterable<any>>body) {
+      if (!tool.isArray(entry) || entry.length < 2) {
+        const type = tool.getPrototypeName(body);
+        ret = `[object ${type}]`;
+        break;
+      }
+      const key = entry[0];
+      const value = entry[1];
       ret[key] = typeof value === 'string' ? value : '[object Object]';
     }
   } else if (tool.isPlainObject(body)) {