chore(🧪): improve type parsing/serialization in e2e testing (#2844)

Shopify · Dec 29, 2024 · 1aeb7e2 · 1aeb7e2
1 parent d646276
commit 1aeb7e2
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 52 deletions.
diff --git a/apps/paper/src/Tests/deserialize.ts b/apps/paper/src/Tests/deserialize.ts
@@ -38,7 +38,9 @@ export const parseProps = (props: SerializedProps, assets: Assets) => {
 
 const parseProp = (value: any, assets: Assets): any => {
   if (value && typeof value === "object" && "__typename__" in value) {
-    if (value.__typename__ === "Paint") {
+    if (value.__typename__ === "Float32Array") {
+      return new Float32Array(value.value);
+    } else if (value.__typename__ === "Paint") {
       const paint = Skia.Paint();
       paint.setColor(Float32Array.of(...value.color));
       return paint;
@@ -96,6 +98,13 @@ const parseProp = (value: any, assets: Assets): any => {
     }
   } else if (Array.isArray(value)) {
     return value.map((v) => parseProp(v, assets));
+  } else if (value && typeof value === "object") {
+    const parsed: Record<string, any> = {};
+    Object.keys(value).forEach((key) => {
+      parsed[key] = parseProp(value[key], assets);
+    });
+    console.log({ parsed });
+    return parsed;
   }
   return value;
 };
diff --git a/packages/skia/src/renderer/__tests__/setup.tsx b/packages/skia/src/renderer/__tests__/setup.tsx
@@ -302,6 +302,14 @@ const serializeSkOjects = (obj: any): any => {
         ty: obj.ty,
       };
     }
+  } else if (obj && typeof obj === "object") {
+    const result = Object.keys(obj).reduce((acc, key) => {
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      acc[key] = serializeSkOjects(obj[key]);
+      return acc;
+    }, {});
+    return result;
   }
   return obj;
 };

diff --git a/packages/skia/src/skia/__tests__/setup.ts b/packages/skia/src/skia/__tests__/setup.ts
@@ -1,7 +1,5 @@
-import type { Node } from "../../dom/types";
-import { mapKeys } from "../../renderer/typeddash";
 import { LoadSkiaWeb } from "../../web/LoadSkiaWeb";
-import { isMatrix, Skia } from "../types";
+import { Skia } from "../types";
 import { JsiSkApi } from "../web";
 
 let Skia: ReturnType<typeof JsiSkApi>;
@@ -27,51 +25,3 @@ export const setupSkia = (width = 256, height = 256) => {
     CanvasKit: global.CanvasKit,
   };
 };
-
-const asValue = (value: unknown) => {
-  if (value instanceof Float32Array) {
-    return Array.from(value)
-      .map((v) => Math.round(v * 100) / 100)
-      .join(", ");
-  } else if (isMatrix(value)) {
-    // TODO: https://github.com/Shopify/react-native-skia/issues/715
-    return "m3x3";
-  } else if (
-    typeof value === "object" &&
-    value !== null &&
-    "x" in value &&
-    "y" in value
-  ) {
-    const v = value as { x: number; y: number };
-    return `{x:${v.x}, y:${v.y}}`;
-  }
-  return value;
-};
-
-export const printAsXML = (node: Node<unknown>) => {
-  console.log(asXML(node));
-};
-
-// Print nodes as XML tree
-export const asXML = (node: Node<unknown>, indent = 0): string => {
-  // TODO: remove cast
-  const hasChildren = node.children().length > 0;
-  const props = node.getProps() as object;
-  const space = new Array(indent).fill(" ").join("");
-  const keys = mapKeys(props).filter((key) => props[key] !== undefined);
-  if (hasChildren) {
-    return `${space}<${node.type}${keys.length > 0 ? " " : ""}${keys
-      .map((name) => `${name}="${asValue(props[name])}"`)
-      .join(" ")}>
-${node
-  .children()
-
-  .map((child) => asXML(child, indent + 2)).join(`
-`)}
-${space}</${node.type}>`;
-  } else {
-    return `${space}<${node.type} ${keys
-      .map((name) => `${name}="${asValue(props[name])}"`)
-      .join(" ")} />`;
-  }
-};