fix(ui): json and richText fields expose unsupported operators in WhereBuilder (#16353)

# Overview

Fixes broken operators exposed in the WhereBuilder for `json` and
`richText` fields. Both field types are stored as JSONB in Postgres, so
string operators like `contains`, `like`, and `not_like` throw `operator
does not exist: jsonb ~~* text`. In MongoDB, `$regex` on a BSON document
field silently returns 0 results. The `within`/`intersects` operators on
`json` were also wrong since those are geo operators.

## Key Changes

Reduced the WhereBuilder operator list for both `json` and `richText` to
`[exists]` only, and added e2e tests asserting only `exists` is
available in the dropdown for both field types.

## Design Decisions

`exists` is the only operator that works and makes sense for these
fields in the UI. Programmatic queries via the API with `equals`/`in`
still work if you pass the exact JSON document, this only affects what
the WhereBuilder exposes.

Author: PatrikKozak

packages/ui/src/elements/WhereBuilder/field-types.tsx

@@ -108,7 +108,7 @@ export const fieldTypeConditions: {
   },
   json: {
     component: 'Text',
-    operators: [...base, like, contains, notLike, within, intersects],
+    operators: [exists],
   },
   number: {
     component: 'Number',
@@ -128,7 +128,7 @@ export const fieldTypeConditions: {
   },
   richText: {
     component: 'Text',
-    operators: [...base, like, notLike, contains],
+    operators: [exists],
   },
   select: {
     component: 'Select',

test/fields/collections/JSON/e2e.spec.ts

@@ -8,14 +8,15 @@ import { fileURLToPath } from 'url'
 import type { PayloadTestSDK } from '../../../__helpers/shared/sdk/index.js'
 import type { Config } from '../../payload-types.js'
 
+import { openListFilters } from '../../../__helpers/e2e/filters/openListFilters.js'
 import {
   ensureCompilationIsDone,
   initPageConsoleErrorCatch,
   saveDocAndAssert,
 } from '../../../__helpers/e2e/helpers.js'
 import { AdminUrlUtil } from '../../../__helpers/shared/adminUrlUtil.js'
-import { initPayloadE2ENoConfig } from '../../../__helpers/shared/initPayloadE2ENoConfig.js'
 import { reInitializeDB } from '../../../__helpers/shared/clearAndSeed/reInitializeDB.js'
+import { initPayloadE2ENoConfig } from '../../../__helpers/shared/initPayloadE2ENoConfig.js'
 import { RESTClient } from '../../../__helpers/shared/rest.js'
 import { TEST_TIMEOUT_LONG } from '../../../playwright.config.js'
 import { jsonFieldsSlug } from '../../slugs.js'
@@ -220,6 +221,32 @@ describe('JSON', () => {
     }).toPass()
   })
 
+  describe('WhereBuilder', () => {
+    test('should only expose exists operator for json field', async () => {
+      await page.goto(url.list)
+
+      await openListFilters(page, {})
+
+      const whereBuilder = page.locator('.where-builder')
+      await whereBuilder.locator('.where-builder__add-first-filter').click()
+
+      const condition = whereBuilder.locator('.where-builder__or-filters > li').first()
+
+      // Select the 'json' field
+      await condition.locator('.condition__field .rs__control').click()
+      await page
+        .locator('.rs__option', { hasText: /^json$/i })
+        .first()
+        .click()
+
+      // Open the operator dropdown and collect all available options
+      await condition.locator('.condition__operator .rs__control').click()
+      const operatorOptions = page.locator('.rs__option')
+      await expect(operatorOptions).toHaveCount(1)
+      await expect(operatorOptions.first()).toHaveText('exists')
+    })
+  })
+
   describe('A11y', () => {
     test('Edit view should have no accessibility violations', async ({}, testInfo) => {
       await page.goto(url.create)

test/lexical/collections/RichText/e2e.spec.ts

@@ -5,6 +5,7 @@ import path from 'path'
 import { wait } from 'payload/shared'
 import { fileURLToPath } from 'url'
 
+import { openListFilters } from '../../../__helpers/e2e/filters/openListFilters.js'
 import {
   ensureCompilationIsDone,
   initPageConsoleErrorCatch,
@@ -16,6 +17,7 @@ import { AdminUrlUtil } from '../../../__helpers/shared/adminUrlUtil.js'
 import { reInitializeDB } from '../../../__helpers/shared/clearAndSeed/reInitializeDB.js'
 import { initPayloadE2ENoConfig } from '../../../__helpers/shared/initPayloadE2ENoConfig.js'
 import { POLL_TOPASS_TIMEOUT, TEST_TIMEOUT_LONG } from '../../../playwright.config.js'
+import { richTextFieldsSlug } from '../../slugs.js'
 
 const filename = fileURLToPath(import.meta.url)
 const currentFolder = path.dirname(filename)
@@ -429,4 +431,31 @@ describe('Rich Text', () => {
       expect(richTextValue).toContain('Rich text')
     })
   })
+
+  describe('WhereBuilder', () => {
+    test('should only expose exists operator for richText field', async () => {
+      const url = new AdminUrlUtil(serverURL, richTextFieldsSlug)
+      await page.goto(url.list)
+
+      await openListFilters(page, {})
+
+      const whereBuilder = page.locator('.where-builder')
+      await whereBuilder.locator('.where-builder__add-first-filter').click()
+
+      const condition = whereBuilder.locator('.where-builder__or-filters > li').first()
+
+      // Select the 'richText' field
+      await condition.locator('.condition__field .rs__control').click()
+      await page
+        .locator('.rs__option', { hasText: /^Rich Text$/ })
+        .first()
+        .click()
+
+      // Open the operator dropdown and collect all available options
+      await condition.locator('.condition__operator .rs__control').click()
+      const operatorOptions = page.locator('.rs__option')
+      await expect(operatorOptions).toHaveCount(1)
+      await expect(operatorOptions.first()).toHaveText('exists')
+    })
+  })
 })