chore(ct): throw error when props are not json serializable

packages/playwright-test/src/mount.ts

@@ -51,6 +51,9 @@ export const fixtures: Fixtures<
 
     mount: async ({ page }, use) => {
       await use(async (component: JsxComponent | string, options?: MountOptions) => {
+        if (options?.props && !isJson(options.props))
+          throw new Error('The mount function props are not JSON serializable.');
+
         const selector = await (page as any)._wrapApiCall(async () => {
           return await innerMount(page, component, options);
         }, true);
@@ -72,6 +75,24 @@ export const fixtures: Fixtures<
     },
   };
 
+const jsonValue: Record<string, Function> = {
+  string: (props: any) => typeof props === 'string',
+  number: (props: any) => typeof props === 'number',
+  boolean: (props: any) => typeof props === 'boolean',
+  null: (props: any) => props === null,
+  array: (props: any) => Array.isArray(props) && props.every(isJson),
+  object: (props: any) => typeof props === 'object' && props !== null && !Array.isArray(props)
+    && Object.values(props).every(prop => isJson(prop)),
+}
+
+function isJson(value: any): boolean {
+  const valueType = Array.isArray(value) ? 'array' : typeof value;
+  const validate = jsonValue[valueType];
+  if (validate) 
+    return validate(value);
+  return false;
+}
+
 function isJsxApi(options: Record<string, unknown>): options is JsxComponent {
   return options?.kind === 'jsx';
 }