From abaa22950cd71404806b26cbab809e309ed940f3 Mon Sep 17 00:00:00 2001
From: Dan Ribbens <dan.ribbens@gmail.com>
Date: Fri, 23 Dec 2022 17:45:22 -0500
Subject: [PATCH] test: json field e2e and int

---
 src/fields/hooks/beforeChange/promise.ts |  8 ++++++++
 test/fields/e2e.spec.ts                  | 26 ++++++++++++++++++++++++
 test/fields/int.spec.ts                  | 23 +++++++++++++++++++++
 3 files changed, 57 insertions(+)

diff --git a/src/fields/hooks/beforeChange/promise.ts b/src/fields/hooks/beforeChange/promise.ts
index ea97983c9..53f431ff2 100644
--- a/src/fields/hooks/beforeChange/promise.ts
+++ b/src/fields/hooks/beforeChange/promise.ts
@@ -104,6 +104,14 @@ export const promise = async ({
         valueToValidate = siblingData[field.name];
       }
 
+      if (field.type === 'json' && typeof siblingData[field.name] === 'string') {
+        try {
+          JSON.parse(siblingData[field.name] as string);
+        } catch (e) {
+          field.jsonError = e;
+        }
+      }
+
       const validationResult = await field.validate(valueToValidate, {
         ...field,
         data: merge(doc, data, { arrayMerge: (_, source) => source }),
diff --git a/test/fields/e2e.spec.ts b/test/fields/e2e.spec.ts
index a445870b7..3f2bc2d5d 100644
--- a/test/fields/e2e.spec.ts
+++ b/test/fields/e2e.spec.ts
@@ -9,6 +9,7 @@ import { pointFieldsSlug } from './collections/Point';
 import { tabsSlug } from './collections/Tabs';
 import { collapsibleFieldsSlug } from './collections/Collapsible';
 import wait from '../../src/utilities/wait';
+import { jsonDoc } from './collections/JSON';
 
 const { beforeAll, describe } = test;
 
@@ -64,6 +65,31 @@ describe('fields', () => {
     });
   });
 
+  describe('json', () => {
+    let url: AdminUrlUtil;
+    beforeAll(() => {
+      url = new AdminUrlUtil(serverURL, 'json-fields');
+    });
+
+    test('should display field in list view', async () => {
+      await page.goto(url.list);
+      const jsonCell = page.locator('.row-1 .cell-json');
+      await expect(jsonCell)
+        .toHaveText(JSON.stringify(jsonDoc.json));
+    });
+
+    test('should create', async () => {
+      const input = '{"foo": "bar"}';
+
+      await page.goto(url.create);
+      const json = page.locator('.json-field .inputarea');
+      await json.fill(input);
+
+      await saveDocAndAssert(page);
+      await expect(page.locator('.json-field')).toContainText('"foo": "bar"');
+    });
+  });
+
   describe('radio', () => {
     let url: AdminUrlUtil;
     beforeAll(() => {
diff --git a/test/fields/int.spec.ts b/test/fields/int.spec.ts
index 09d4a9021..5eb488038 100644
--- a/test/fields/int.spec.ts
+++ b/test/fields/int.spec.ts
@@ -505,6 +505,29 @@ describe('Fields', () => {
     });
   });
 
+  describe('json', () => {
+    it('should save json data', async () => {
+      const json = { foo: 'bar' };
+      const doc = await payload.create({
+        collection: 'json-fields',
+        data: {
+          json,
+        },
+      });
+
+      expect(doc.json).toStrictEqual({ foo: 'bar' });
+    });
+
+    it('should validate json', async () => {
+      await expect(async () => payload.create({
+        collection: 'json-fields',
+        data: {
+          json: '{ bad input: true }',
+        },
+      })).rejects.toThrow('The following field is invalid: json');
+    });
+  });
+
   describe('richText', () => {
     it('should allow querying on rich text content', async () => {
       const emptyRichTextQuery = await payload.find({