feat: update version to 0.12.0 and refactor serialization handling

Author: dborysov

memory-bank

@@ -1,7 +1,7 @@
 {
   "name": "tanstack-query-chrome-devtools",
   "private": true,
-  "version": "0.11.0",
+  "version": "0.12.0",
   "type": "module",
   "description": "TanStack Query DevTools",
   "homepage": "https://github.com/DeeCode-inc/tanstack-query-chrome-devtools#readme",
@@ -17,7 +17,7 @@
   },
   "scripts": {
     "dev": "vite",
-    "build": "tsc -b && vite build --mode main && vite build --mode content",
+    "build": "tsc -b && vite build --mode main && vite build --mode content && vite build --mode injected",
     "lint": "eslint .",
     "preview": "vite preview",
     "prettier:format": "prettier --write .",
@@ -31,8 +31,7 @@
     "highlight.js": "^11.11.1",
     "lucide-react": "^0.544.0",
     "react": "^19.2.0",
-    "react-dom": "^19.1.1",
-    "superjson": "^2.2.2",
+    "react-dom": "^19.2.0",
     "tailwind-merge": "^3.3.1",
     "webextension-polyfill": "^0.12.0",
     "zod": "^4.1.11"

package-lock.json

@@ -8,7 +8,7 @@
       "strict_min_version": "112.0"
     }
   },
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "DevTools extension for debugging TanStack Query applications. Inspect queries, mutations, and cache state in real-time.",
   "homepage_url": "https://github.com/DeeCode-inc/tanstack-query-chrome-devtools",
 

package.json

@@ -7,7 +7,6 @@ import {
 } from "../lib/message-validation";
 import { EnhancedStorageManager, TabManager } from "../lib/enhanced-storage";
 import { ActionProcessorFactory } from "../lib/action-processor";
-import { SerializationManager } from "../lib/serialization-manager";
 import type {
   TanStackQueryEvent,
   UpdateMessage,
@@ -167,16 +166,12 @@ class ContentScript {
     if (!this.storageManager) return;
 
     try {
-      // Process the payload to handle serialized data
-      const processedPayload = SerializationManager.processPayload(
-        message.payload,
-      );
-
-      // Batch update all fields
+      // No processing needed - postMessage uses structured clone
+      // Data is already in correct format
       await this.storageManager.batchUpdate({
-        queries: processedPayload.queries,
-        mutations: processedPayload.mutations,
-        tanStackQueryDetected: processedPayload.tanStackQueryDetected,
+        queries: message.payload.queries,
+        mutations: message.payload.mutations,
+        tanStackQueryDetected: message.payload.tanStackQueryDetected,
       });
     } catch (error) {
       console.error("Error handling update message:", error);

public/manifest.json

@@ -1,18 +1,17 @@
 // Content script message communication utilities
-import { MessageSerializer } from "../../lib/serialization-manager";
-
 export class ContentScriptMessageCommunicator {
   // Request immediate data update from injected script
   requestImmediateUpdate(preserveArtificialStates?: boolean): void {
     try {
-      const message = MessageSerializer.prepareForPostMessage({
+      const message = {
         type: "REQUEST_IMMEDIATE_UPDATE",
         source: "tanstack-query-devtools-content",
         ...(preserveArtificialStates !== undefined && {
           preserveArtificialStates,
         }),
-      });
+      };
 
+      // postMessage uses structured clone algorithm - no serialization needed
       window.postMessage(message, window.location.origin);
     } catch (error) {
       console.error("Error requesting immediate update:", error);
@@ -22,11 +21,12 @@ export class ContentScriptMessageCommunicator {
   // Request clear artificial states from injected script
   requestClearArtificialStates(): void {
     try {
-      const message = MessageSerializer.prepareForPostMessage({
+      const message = {
         type: "CLEAR_ARTIFICIAL_STATES",
         source: "tanstack-query-devtools-content",
-      });
+      };
 
+      // postMessage uses structured clone algorithm - no serialization needed
       window.postMessage(message, window.location.origin);
     } catch (error) {
       console.error("Error requesting clear artificial states:", error);

src/content/content.ts

@@ -1,6 +1,5 @@
 // Content script storage manager implementation
 import type { EnhancedStorageManager } from "../../lib/enhanced-storage";
-import { SerializationManager } from "../../lib/serialization-manager";
 import type { QueryData, MutationData } from "../../types/query";
 import type { TanstackQueryStateType } from "../../storage/base/types";
 
@@ -58,14 +57,12 @@ export class ContentScriptStorageManager {
       throw new Error("Storage manager not initialized");
     }
 
-    // Process the payload to handle serialized data
-    const processedPayload = SerializationManager.processPayload(payload);
-
-    // Batch update all fields
+    // No deserialization needed - postMessage uses structured clone
+    // Data is already in correct format
     await this.storageManager.batchUpdate({
-      queries: processedPayload.queries,
-      mutations: processedPayload.mutations,
-      tanStackQueryDetected: processedPayload.tanStackQueryDetected,
+      queries: payload.queries,
+      mutations: payload.mutations,
+      tanStackQueryDetected: payload.tanStackQueryDetected,
     });
   }
 

src/content/modules/message-communicator.ts

@@ -1,5 +1,4 @@
 // Message communication with content script
-import { MessageSerializer } from "../../lib/serialization-manager";
 import type {
   TanStackQueryEvent,
   UpdateMessage,
@@ -10,11 +9,12 @@ import type {
 export class InjectedScriptMessageCommunicator {
   sendEvent(event: TanStackQueryEvent): void {
     try {
-      const message = MessageSerializer.prepareForPostMessage({
+      const message = {
         ...event,
         source: "tanstack-query-devtools-injected",
-      });
+      };
 
+      // postMessage uses structured clone algorithm - no serialization needed
       window.postMessage(message, window.location.origin);
     } catch (error) {
       console.error("Error sending event to content script:", error);
@@ -23,12 +23,13 @@ export class InjectedScriptMessageCommunicator {
 
   sendUpdate(payload: UpdateMessage["payload"]): void {
     try {
-      const message = MessageSerializer.prepareForPostMessage({
+      const message = {
         type: "UPDATE_QUERY_STATE",
         payload,
         source: "tanstack-query-devtools-injected",
-      });
+      };
 
+      // postMessage uses structured clone algorithm - no serialization needed
       window.postMessage(message, window.location.origin);
     } catch (error) {
       console.error("Error sending update to content script:", error);
@@ -37,11 +38,12 @@ export class InjectedScriptMessageCommunicator {
 
   sendActionResult(result: QueryActionResult | BulkQueryActionResult): void {
     try {
-      const message = MessageSerializer.prepareForPostMessage({
+      const message = {
         ...result,
         source: "tanstack-query-devtools-injected",
-      });
+      };
 
+      // postMessage uses structured clone algorithm - no serialization needed
       window.postMessage(message, window.location.origin);
     } catch (error) {
       console.error("Error sending action result to content script:", error);

src/content/modules/storage-manager.ts

@@ -7,7 +7,6 @@ import type {
   ClearArtificialStatesMessage,
 } from "../types/messages";
 import { EnhancedStorageManager } from "./enhanced-storage";
-import { MessageSerializer } from "./serialization-manager";
 
 // Extended storage action with retry information
 interface ExtendedStorageAction extends StorageAction {
@@ -148,14 +147,14 @@ export class ActionProcessor {
     action: ExtendedStorageAction,
   ): Promise<boolean> {
     try {
-      // Prepare message for transmission
-      const message = MessageSerializer.prepareForPostMessage({
+      // Prepare message for transmission - structured clone handles everything
+      const message = {
         ...action.payload,
         source: "tanstack-query-devtools-content",
         actionId: action.id,
-      });
+      };
 
-      // Send via postMessage
+      // Send via postMessage - uses structured clone algorithm
       window.postMessage(message, window.location.origin);
 
       return true;