|
| 1 | +// Copyright (c) 2026 ObjectStack. Licensed under the Apache-2.0 license. |
| 2 | + |
| 3 | +/** |
| 4 | + * The field inspector authors `referenceNameVisible` (objectstack#29629), the |
| 5 | + * declared name exposure of objectstack#29171 (ruling 6574398310, letter B): |
| 6 | + * a reader of the record may see the referenced record's name, as text with |
| 7 | + * no link, when they cannot open that record. |
| 8 | + * |
| 9 | + * - The toggle is offered on `lookup` and `user` only, the two types |
| 10 | + * `FieldSchema` accepts the key on. Checking it writes `true`; clearing it |
| 11 | + * removes the key, so the field carries no `referenceNameVisible` at all. |
| 12 | + * - A `user` field's target is always `sys_user`: the section opens for the |
| 13 | + * toggle and offers none of the lookup picker controls. |
| 14 | + * - The spec refuses the key, `false` included, on every other type, so a |
| 15 | + * retype away from `lookup` / `user` removes it; `lookup` → `user` keeps it. |
| 16 | + * |
| 17 | + * Every write case ends at the written field's own keys and at `FieldSchema`, |
| 18 | + * never at "it rendered". |
| 19 | + */ |
| 20 | + |
| 21 | +import * as React from 'react'; |
| 22 | +import { describe, it, expect, vi, afterEach } from 'vitest'; |
| 23 | +import { render, screen, cleanup, within } from '@testing-library/react'; |
| 24 | +import userEvent from '@testing-library/user-event'; |
| 25 | +import { FieldSchema } from '@objectstack/spec/data'; |
| 26 | +import { loadStudioCatalogue } from '@object-ui/i18n/namespaces/studio'; |
| 27 | + |
| 28 | +const h = vi.hoisted(() => { |
| 29 | + const CATALOG: Array<Record<string, unknown>> = [{ name: 'vendor', label: 'Vendor' }]; |
| 30 | + const get = async (_type: string, name: string) => |
| 31 | + name === 'vendor' ? { name, fields: { name: { type: 'text', label: 'Name' } } } : null; |
| 32 | + const client = { |
| 33 | + get, |
| 34 | + withPreviewDrafts: (_on: boolean) => ({ list: async (_type: string) => CATALOG, get }), |
| 35 | + list: async (_type: string) => CATALOG, |
| 36 | + listDrafts: async () => [] as unknown[], |
| 37 | + }; |
| 38 | + return { client }; |
| 39 | +}); |
| 40 | +vi.mock('../useMetadata', () => ({ useMetadataClient: () => h.client })); |
| 41 | +vi.mock('../previews/useObjectFields', () => ({ |
| 42 | + useObjectFields: () => ({ fields: [], loading: false, error: null }), |
| 43 | +})); |
| 44 | + |
| 45 | +import { ObjectFieldInspector } from './ObjectFieldInspector'; |
| 46 | +import { t, type SupportedLocale } from '../i18n'; |
| 47 | + |
| 48 | +// The zh case reads the lazy `studio` catalogue; load it at import so no |
| 49 | +// assertion races the loader. |
| 50 | +await loadStudioCatalogue('zh'); |
| 51 | + |
| 52 | +afterEach(cleanup); |
| 53 | + |
| 54 | +type Def = Record<string, unknown>; |
| 55 | + |
| 56 | +const LABEL = t('designer.field.lookup.referenceNameVisible', 'en-US'); |
| 57 | +const HELP = t('designer.field.lookup.referenceNameVisible.help', 'en-US'); |
| 58 | + |
| 59 | +/** A host that feeds each patch back, as Studio's draft does. */ |
| 60 | +function renderField(def: Def, opts: { locale?: SupportedLocale } = {}) { |
| 61 | + const onPatch = vi.fn(); |
| 62 | + const initial: Record<string, unknown> = { |
| 63 | + name: 'po', |
| 64 | + label: 'Purchase order', |
| 65 | + fields: { title: { type: 'text', label: 'Title' }, party: def }, |
| 66 | + }; |
| 67 | + function Host() { |
| 68 | + const [draft, setDraft] = React.useState(initial); |
| 69 | + return ( |
| 70 | + <ObjectFieldInspector |
| 71 | + type="object" |
| 72 | + name="po" |
| 73 | + draft={draft} |
| 74 | + selection={{ kind: 'field', id: 'party' }} |
| 75 | + onPatch={(patch: Record<string, unknown>) => { |
| 76 | + onPatch(patch); |
| 77 | + setDraft((d) => ({ ...d, ...patch })); |
| 78 | + }} |
| 79 | + onClearSelection={vi.fn()} |
| 80 | + onSelectionChange={vi.fn()} |
| 81 | + readOnly={false} |
| 82 | + locale={opts.locale ?? 'en-US'} |
| 83 | + /> |
| 84 | + ); |
| 85 | + } |
| 86 | + render(<Host />); |
| 87 | + /** The `party` definition the host's Save would persist after the last edit. */ |
| 88 | + const saved = () => (onPatch.mock.calls.at(-1)![0].fields as Record<string, Def>).party; |
| 89 | + return { onPatch, saved }; |
| 90 | +} |
| 91 | + |
| 92 | +const toggle = () => screen.queryByRole('checkbox', { name: LABEL }); |
| 93 | +const has = (o: object, key: string) => Object.prototype.hasOwnProperty.call(o, key); |
| 94 | + |
| 95 | +/** `FieldSchema`'s rejections of a saved definition, as `code@[path]`. */ |
| 96 | +const rejections = (def: Def): string[] => { |
| 97 | + const r = FieldSchema.safeParse({ name: 'party', ...def }); |
| 98 | + return r.success ? [] : r.error.issues.map((i) => `${i.code}@[${i.path.join('.')}]`); |
| 99 | +}; |
| 100 | + |
| 101 | +const LOOKUP: Def = { type: 'lookup', label: 'Vendor', reference: 'vendor' }; |
| 102 | +const USER: Def = { type: 'user', label: 'Buyer' }; |
| 103 | + |
| 104 | +async function retypeTo(typeLabel: string) { |
| 105 | + await userEvent.click(screen.getByRole('combobox', { name: t('designer.field.type', 'en-US') })); |
| 106 | + const list = await screen.findByRole('listbox', { name: t('designer.field.type', 'en-US') }); |
| 107 | + await userEvent.click(within(list).getByRole('option', { name: typeLabel })); |
| 108 | +} |
| 109 | + |
| 110 | +describe('referenceNameVisible in the field inspector', () => { |
| 111 | + it.each([ |
| 112 | + ['lookup', LOOKUP], |
| 113 | + ['user', USER], |
| 114 | + ] as const)('a %s field offers the toggle, and checking it saves referenceNameVisible: true', async (_type, def) => { |
| 115 | + const { saved } = renderField(def); |
| 116 | + const box = toggle(); |
| 117 | + expect(box).not.toBeNull(); |
| 118 | + expect((box as HTMLInputElement).checked).toBe(false); |
| 119 | + |
| 120 | + await userEvent.click(box!); |
| 121 | + |
| 122 | + expect(saved().referenceNameVisible).toBe(true); |
| 123 | + expect(rejections(saved())).toEqual([]); |
| 124 | + expect((toggle() as HTMLInputElement).checked).toBe(true); |
| 125 | + }); |
| 126 | + |
| 127 | + it('the help text is the toggle\'s accessible description', () => { |
| 128 | + renderField(LOOKUP); |
| 129 | + expect(screen.getByRole('checkbox', { name: LABEL, description: HELP })).toBeTruthy(); |
| 130 | + }); |
| 131 | + |
| 132 | + it('clearing the toggle removes the key: the saved field carries no referenceNameVisible', async () => { |
| 133 | + const { saved } = renderField({ ...LOOKUP, referenceNameVisible: true }); |
| 134 | + expect((toggle() as HTMLInputElement).checked).toBe(true); |
| 135 | + |
| 136 | + await userEvent.click(toggle()!); |
| 137 | + |
| 138 | + expect(has(saved(), 'referenceNameVisible')).toBe(false); |
| 139 | + expect(rejections(saved())).toEqual([]); |
| 140 | + expect((toggle() as HTMLInputElement).checked).toBe(false); |
| 141 | + }); |
| 142 | + |
| 143 | + it('a stored false reads unchecked, and checking it writes true', async () => { |
| 144 | + const { saved } = renderField({ ...LOOKUP, referenceNameVisible: false }); |
| 145 | + expect((toggle() as HTMLInputElement).checked).toBe(false); |
| 146 | + |
| 147 | + await userEvent.click(toggle()!); |
| 148 | + |
| 149 | + expect(saved().referenceNameVisible).toBe(true); |
| 150 | + }); |
| 151 | + |
| 152 | + it.each([ |
| 153 | + ['text', { type: 'text', label: 'Vendor name' }], |
| 154 | + ['master_detail', { type: 'master_detail', label: 'Vendor', reference: 'vendor' }], |
| 155 | + ] as const)('CONTROL — a %s field offers no toggle (the spec refuses the key there)', (_type, def) => { |
| 156 | + renderField(def); |
| 157 | + expect(toggle()).toBeNull(); |
| 158 | + expect(screen.queryByTestId('field-reference-name-visible')).toBeNull(); |
| 159 | + }); |
| 160 | + |
| 161 | + it('CONTROL — a user field offers none of the lookup picker controls (its target is always sys_user)', () => { |
| 162 | + renderField(USER); |
| 163 | + expect(toggle()).not.toBeNull(); |
| 164 | + expect(screen.queryByText(t('designer.field.relatedObject', 'en-US'))).toBeNull(); |
| 165 | + expect(screen.queryByText(t('designer.field.lookup.pickerConfig', 'en-US'))).toBeNull(); |
| 166 | + expect(screen.queryByText(t('designer.field.lookup.displayField', 'en-US'))).toBeNull(); |
| 167 | + expect(screen.queryByText(t('designer.field.lookup.selectableRecords', 'en-US'))).toBeNull(); |
| 168 | + expect(screen.queryByText(t('designer.field.lookup.dependsOn', 'en-US'))).toBeNull(); |
| 169 | + expect(screen.queryByTestId('field-related-list')).toBeNull(); |
| 170 | + }); |
| 171 | + |
| 172 | + it('a retype away from lookup removes the key, so the save is not refused at [referenceNameVisible]', async () => { |
| 173 | + const { saved } = renderField({ ...LOOKUP, referenceNameVisible: true }); |
| 174 | + |
| 175 | + await retypeTo('Text'); |
| 176 | + |
| 177 | + expect(saved().type).toBe('text'); |
| 178 | + expect(has(saved(), 'referenceNameVisible')).toBe(false); |
| 179 | + expect(rejections(saved()).filter((r) => r.endsWith('[referenceNameVisible]'))).toEqual([]); |
| 180 | + expect(toggle()).toBeNull(); |
| 181 | + }); |
| 182 | + |
| 183 | + it('a retype from lookup to user keeps the key (both types accept it)', async () => { |
| 184 | + const { saved } = renderField({ ...LOOKUP, referenceNameVisible: true }); |
| 185 | + |
| 186 | + await retypeTo('User'); |
| 187 | + |
| 188 | + expect(saved().type).toBe('user'); |
| 189 | + expect(saved().referenceNameVisible).toBe(true); |
| 190 | + expect((toggle() as HTMLInputElement).checked).toBe(true); |
| 191 | + }); |
| 192 | + |
| 193 | + it('zh: the toggle is labelled from the studio catalogue', () => { |
| 194 | + renderField(LOOKUP, { locale: 'zh-CN' }); |
| 195 | + expect(screen.getByRole('checkbox', { name: '不可读时显示名称' })).toBeTruthy(); |
| 196 | + }); |
| 197 | +}); |
0 commit comments