fix: use internal parse/stringify function for timeline event

Author: webfansplz

Diff for: packages/applet/src/components/timeline/index.vue

@@ -4,6 +4,7 @@ import { DevToolsMessagingEvents, rpc } from '@vue/devtools-core'
 import { computed, onUnmounted, ref } from 'vue'
 
 import type { CustomInspectorState, TimelineEventOptions } from '@vue/devtools-kit'
+import { parse } from '@vue/devtools-kit'
 import EventList from './EventList.vue'
 import Navbar from '~/components/basic/Navbar.vue'
 import Empty from '~/components/basic/Empty.vue'
@@ -73,7 +74,8 @@ function normalizeGroupList(event: TimelineEventOptions['event']) {
   }
 }
 
-function onTimelineEventUpdated(payload) {
+function onTimelineEventUpdated(_payload) {
+  const payload = parse(_payload)
   if (!payload)
     return
 

Diff for: packages/core/src/rpc/global.ts

@@ -162,7 +162,7 @@ export const functions = {
       broadcast.emit(DevToolsMessagingEvents.ROUTER_INFO_UPDATED, state)
     })
     devtools.ctx.hooks.hook(DevToolsMessagingHookKeys.SEND_TIMELINE_EVENT_TO_CLIENT, (payload) => {
-      broadcast.emit(DevToolsMessagingEvents.TIMELINE_EVENT_UPDATED, payload)
+      broadcast.emit(DevToolsMessagingEvents.TIMELINE_EVENT_UPDATED, stringify(payload))
     })
     devtools.ctx.hooks.hook(DevToolsMessagingHookKeys.SEND_INSPECTOR_TO_CLIENT, (payload) => {
       broadcast.emit(DevToolsMessagingEvents.INSPECTOR_UPDATED, payload)