fix(Log): restore inherited event properties

CHANGELOG.md

@@ -9,6 +9,7 @@ English | [简体中文](./CHANGELOG_CN.md)
 - `Fix(Core)` Fix `getStringWithinLength` truncating by character index instead of byte count, causing multi-byte characters (e.g. Chinese, emojis) to exceed the intended byte limit or be truncated incorrectly. (PR #730)
 - `Fix(Core)` Fix copy button not working on iOS 17.2 Safari by using Clipboard API with fallback. (PR #672)
 - `Fix(Log)` Fix log formatting (`%c`, `%s`, `%d`, `%o`) not being recognized when format specifiers are adjacent without spaces (e.g. `%c%s`). (issue #732)
+- `Fix(Log)` Restore inherited enumerable properties when expanding DOM events such as `TouchEvent` without triggering native accessor errors. (issue #609)
 - `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)

CHANGELOG_CN.md

@@ -9,6 +9,7 @@
 - `Fix(Core)` 修复 `getStringWithinLength` 按字符索引而非字节数截断字符串的问题，导致含多字节字符（如中文、emoji）的字符串超出预期字节限制或被错误截断。(PR #730)
 - `Fix(Core)` 修复 iOS 17.2 Safari 中复制按钮无效的问题，改用 Clipboard API 并保留降级处理。(PR #672)
 - `Fix(Log)` 修复格式符（`%c`、`%s`、`%d`、`%o`）之间没有空格时（如 `%c%s`）无法被识别、导致颜色/替换失效的问题。(issue #732)
+- `Fix(Log)` 恢复在展开 `TouchEvent` 等 DOM 事件时显示继承的可枚举属性，并避免触发原生访问器错误。(issue #609)
 - `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)

dev/log.html

@@ -28,6 +28,7 @@
       <a onclick="largeObject()" href="javascript:;" class="weui_btn weui_btn_default">Large Object</a>
       <a onclick="circularObject()" href="javascript:;" class="weui_btn weui_btn_default">Circular Object & Array</a>
       <a onclick="proxyObject()" href="javascript:;" class="weui_btn weui_btn_default">Proxy Object</a>
+      <a ontouchstart="domEvent(event)" href="javascript:;" class="weui_btn weui_btn_default">Touch Event</a>
     </div>
 
     <div class="section">
@@ -274,6 +275,10 @@
   console.log('A proxy object:', p); 
 }
 
+function domEvent(event) {
+  console.log('A DOM event with inherited enumerable properties:', event);
+}
+
 function allDataTypes(aa, bb, cc) {
   console.log('String:', 'The first line;\nThe second line.', '<b>A HTML tag line.</b>');
   console.log('Number:', 65535);

src/lib/tool.ts

@@ -423,6 +423,20 @@ export function getEnumerableKeys(obj) {
   return Object.keys(obj);
 }
 
+/**
+ * Get own and inherited enumerable keys of an object or array.
+ */
+export function getEnumerableKeysInPrototypeChain(obj) {
+  if (!isObject(obj) && !isArray(obj)) {
+    return [];
+  }
+  const keys: string[] = [];
+  for (const key in obj) {
+    keys.push(key);
+  }
+  return keys;
+}
+
 
 /**
  * Get enumerable and non-enumerable keys of an object or array.

src/log/logTree.svelte

@@ -1,6 +1,6 @@
 <svelte:options immutable/>
 <script lang="ts">
-  import { onMount, onDestroy } from 'svelte';
+  import { onMount, onDestroy, beforeUpdate } from 'svelte';
   import * as tool from '../lib/tool';
   import LogValue from './logValue.svelte';
   import { VConsoleUninvocatableObject } from './logTool';
@@ -22,20 +22,21 @@
   let childEnumKeyOffset = KEY_PAGE_SIZE;
   let childNonEnumKeyOffset = KEY_PAGE_SIZE;
 
-  $: {
+  // Avoid Svelte's reactive deep-read of host objects with native accessors.
+  beforeUpdate(() => {
     isToggle = toggle[keyPath] || false
 
     isTree = !(origData instanceof VConsoleUninvocatableObject) && (tool.isArray(origData) || tool.isObject(origData));
 
     if (isTree && isToggle) {
       // keys only need to be initialized once
-      childEnumKeys = childEnumKeys || tool.sortArray(tool.getEnumerableKeys(origData));
+      childEnumKeys = childEnumKeys || tool.sortArray(tool.getEnumerableKeysInPrototypeChain(origData));
       childNonEnumKeys = childNonEnumKeys || tool.sortArray(tool.getNonEnumerableKeys(origData));
       childSymbolKeys = childSymbolKeys || tool.getSymbolKeys(origData);
       isShowProto = tool.isObject(origData) && childNonEnumKeys.indexOf('__proto__') === -1;
     }
     // (window as any)._vcOrigConsole.log('logTree update');
-  }
+  });
 
   onMount(() => {
     Style.use();

src/log/logValue.svelte

@@ -1,6 +1,6 @@
 <svelte:options immutable/>
 <script lang="ts">
-  import { onMount, onDestroy } from 'svelte';
+  import { onMount, onDestroy, beforeUpdate } from 'svelte';
   import * as tool from '../lib/tool';
   import { getValueTextAndType } from './logTool';
   import Style from './logValue.less';
@@ -14,7 +14,8 @@
   let valueType: string = '';
   let isInTree: boolean = false;
 
-  $: {
+  // Avoid Svelte's reactive deep-read of host objects with native accessors.
+  beforeUpdate(() => {
     // the value is NOT in a tree when key is undefined
     isInTree = dataKey !== undefined;
 
@@ -26,7 +27,7 @@
       // if it's a single string, then keep line breaks.
       dataValue = dataValue.replace(/\\n/g, '\n').replace(/\\t/g, '    ');
     }
-  }
+  });
 
   onMount(() => {
     Style.use();