fix: parse yaml to json on client always

Author: walker-tx

cmd/wasm/functions.go

@@ -181,14 +181,7 @@ type IncompleteOverlayErrorMessage struct {
 }
 
 func applyOverlayJSONPathIncomplete(result []*yaml.Node, node *yaml.Node) (string, error) {
-	var data interface{}
-	if len(result) == 1 {
-		data = result[0]
-	} else {
-		data = result
-	}
-
-	yamlResult, err := yaml.Marshal(data)
+	yamlResult, err := yaml.Marshal(&result)
 	if err != nil {
 		return "", err
 	}

web/package.json

@@ -29,7 +29,8 @@
     "react-resizable-panels": "^2.1.7",
     "tailwind-merge": "^2.6.0",
     "tailwindcss-animate": "^1.0.7",
-    "usehooks-ts": "^3.1.0"
+    "usehooks-ts": "^3.1.0",
+    "yaml": "^2.7.0"
   },
   "devDependencies": {
     "@types/node": "^22.10.5",

web/pnpm-lock.yaml

@@ -31,6 +31,7 @@ import {
 } from "./lib/utils";
 import ShareDialog, { ShareDialogHandle } from "./components/ShareDialog";
 import { Loader2Icon, ShareIcon } from "lucide-react";
+import { parse as yamlParse } from "yaml";
 
 const Link = ({ children, href }: { children: ReactNode; href: string }) => (
   <a
@@ -110,7 +111,16 @@ function Playground() {
           tryHandlePageTitle(JSON.parse(info));
         } else if (response.type == "incomplete") {
           setApplyOverlayMode("jsonpathexplorer");
-          changed.current = formatDocument(response.result);
+
+          if (originalLang.current == "json") {
+            // !TODO: this is a hack to get around the fact
+            //  that the json parser only returns yaml.
+            const obj = yamlParse(response.result);
+            changed.current = JSON.stringify(obj, null, 2);
+          } else {
+            changed.current = response.result;
+          }
+
           setError("");
           setOverlayMarkers([]);
         } else if (response.type == "error") {