@object-ui/fields 17.5.0 → 17.7.0

package/src/__tests__/widget-dom-leak-e2e.test.tsx

@@ -1,357 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/**
- * GATE: no field widget may leak a non-DOM prop onto a DOM element
- * (objectui#3291).
- *
- * Every registered field widget is rendered through BOTH hosts, and every
- * attribute of every element it produced is checked against what HTML actually
- * defines. An attribute nobody can explain is a leak.
- *
- * ## What this catches that a unit test cannot
- *
- * The leak was never in one widget. It was structural: a widget spread
- * `{...props}` onto its control, and the hosts hand a widget more than the DOM
- * can take. Measured on `origin/main`, a real form, a real widget:
- *
- * ```
- * <input placeholder="PH-f" zzcanary="CANARY-STR" zzcanaryobj="[object Object]"
- *        zzcanarynum="42" id="…" type="text" value="" name="f">
- * ```
- *
- * `zzcanaryobj="[object Object]"` is an ordinary key an author wrote on the
- * field config. That is why the fix is a WHITELIST (`toDomProps`) and why this
- * test plants canaries rather than checking a list of known-bad names: a
- * blacklist of today's renderer props would pass all three canaries above.
- *
- * ## Four things that silently defeat a test like this
- *
- * 1. **React warnings prove nothing.** React 19 passes an all-lowercase
- *    unknown attribute through in COMPLETE silence. In the audit sweep the
- *    only warning came from a camelCase canary — which was written to the DOM
- *    anyway. So this walks real DOM attributes and never listens for console
- *    output.
- * 2. **Both hosts, or the result is a false pass.** The form renderer strips a
- *    known set before forwarding; `SchemaRenderer` spreads the whole authored
- *    node with NO strip layer, so it leaks strictly more (`label` is only
- *    visible there). On that path the widget's own spread is the only defence.
- * 3. **An error variant that produces no error tests nothing.** `required` +
- *    a `false` boolean does NOT fail here — this repo made `required` a
- *    presence check, so `false` is a value (cloud#972). The audit's first pass
- *    under-reported the `error` leak by one widget for exactly this reason.
- *    Every error variant therefore ASSERTS the message rendered before it
- *    scans; a variant that silently produces no error fails the test.
- * 4. **This repo runs happy-dom, not jsdom** (`vitest.config.mts`), whose IDL
- *    coverage has real gaps — `select[size]`, `option[label]`, `textarea[wrap]`
- *    and `col[span]` are all standard HTML that happy-dom does not reflect.
- *    See `@object-ui/test-support`'s `dom-leak-judge` for how the judge is
- *    built, and its `HAPPY_DOM_IDL_GAPS` for each measured exception and its
- *    reason. Every one of those four was found BY a calibration fixture, not
- *    by guesswork.
- *
- * ## The judge proves itself — next to the judge, not here
- *
- * `isKnownAttribute` / `findLeaks` / `leakReport` are imported from
- * `@object-ui/test-support`, which is where they now live for BOTH DOM-leak
- * gates (objectui#4434). They used to be defined in this file and copied into
- * `packages/app-shell/src/__tests__/widget-dom-leak-sweep.test.tsx`, and the
- * two copies had already drifted.
- *
- * The calibration fixtures moved with them: standard markup that must yield
- * ZERO findings, and markup with planted fake attributes that must ALL be
- * found, now unioned from both gates' fixtures and run once in
- * `packages/test-support/src/__tests__/dom-leak-judge.test.tsx`. When a
- * happy-dom upgrade changes IDL coverage, that fails loudly instead of this
- * sweep going quietly blind — and it now fails in ONE place instead of needing
- * to be discovered twice.
- *
- * ## Deliberate coverage boundary
- *
- * Popovers are NOT opened. Radix needs pointer-capture APIs happy-dom does not
- * implement. Every widget's props spread lands on its inline control (the
- * trigger for a picker), which always renders — so the spread site IS covered,
- * but content that exists only inside an open dropdown is NOT scanned by this
- * test.
- *
- * Widgets are registered from STATIC imports wrapped in `withFieldCarrier`,
- * never via `registerAllFields()`, which wraps every loader in `React.lazy` —
- * an unbounded module load inside a bounded `waitFor` is this repo's known
- * flake generator (AGENTS.md 测试纪律 / objectui#3010).
- */
-
-import type { ComponentType } from 'react';
-import { describe, it, expect, beforeAll, beforeEach, afterEach, vi } from 'vitest';
-import { render, screen, fireEvent, waitFor, cleanup } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import { ComponentRegistry } from '@object-ui/core';
-// Module scope: pulls in the form renderer's registration side effect.
-import '@object-ui/components';
-import { SchemaRenderer } from '@object-ui/react';
-// The attribute judge, shared with `packages/app-shell`'s sweep gate
-// (objectui#4434). It used to be defined in this file and copied into that one;
-// its calibration fixtures now live next to it and prove it for both gates.
-// `@object-ui/test-support` is private and never published — see its README.
-import { findLeaks, leakReport } from '@object-ui/test-support';
-
-import { withFieldCarrier } from '../withFieldCarrier';
-import { FORM_FIELD_TYPES } from '../index';
-
-import { TextField } from '../widgets/TextField';
-import { TextAreaField } from '../widgets/TextAreaField';
-import { NumberField } from '../widgets/NumberField';
-import { BooleanField } from '../widgets/BooleanField';
-import { SelectField } from '../widgets/SelectField';
-import { DateField } from '../widgets/DateField';
-import { DateTimeField } from '../widgets/DateTimeField';
-import { TimeField } from '../widgets/TimeField';
-import { EmailField } from '../widgets/EmailField';
-import { PhoneField } from '../widgets/PhoneField';
-import { UrlField } from '../widgets/UrlField';
-import { MultiSelectField } from '../widgets/MultiSelectField';
-import { RadioField } from '../widgets/RadioField';
-import { CheckboxesField } from '../widgets/CheckboxesField';
-import { TagsField } from '../widgets/TagsField';
-import { CurrencyField } from '../widgets/CurrencyField';
-import { PercentField } from '../widgets/PercentField';
-import { PasswordField } from '../widgets/PasswordField';
-import { RichTextField } from '../widgets/RichTextField';
-import { LookupField } from '../widgets/LookupField';
-import { FileField } from '../widgets/FileField';
-import { ImageField } from '../widgets/ImageField';
-import { LocationField } from '../widgets/LocationField';
-import { FormulaField } from '../widgets/FormulaField';
-import { SummaryField } from '../widgets/SummaryField';
-import { AutoNumberField } from '../widgets/AutoNumberField';
-import { UserField } from '../widgets/UserField';
-import { ObjectField } from '../widgets/ObjectField';
-import { VectorField } from '../widgets/VectorField';
-import { GridField } from '../widgets/GridField';
-import { ColorField } from '../widgets/ColorField';
-import { SliderField } from '../widgets/SliderField';
-import { RatingField } from '../widgets/RatingField';
-import { CodeField } from '../widgets/CodeField';
-import { AvatarField } from '../widgets/AvatarField';
-import { AddressField } from '../widgets/AddressField';
-import { GeolocationField } from '../widgets/GeolocationField';
-import { SignatureField } from '../widgets/SignatureField';
-import { QRCodeField } from '../widgets/QRCodeField';
-import { ObjectRefField } from '../widgets/ObjectRefField';
-import { FilterConditionField } from '../widgets/FilterConditionField';
-import { RecipientPickerField } from '../widgets/RecipientPickerField';
-
-/* ════════════════════════════════════════════════════════════════════════════
- * Every registered field widget, both hosts
- * ══════════════════════════════════════════════════════════════════════════ */
-
-/**
- * Static components for the widget map's keys. Kept as one object so the
- * parity assertion below can prove it covers the whole registry: a NEW field
- * type added to `fieldWidgetMap` without a line here fails loudly rather than
- * quietly going unscanned.
- */
-const WIDGETS: Record<string, ComponentType<any>> = {
-  text: TextField,
-  textarea: TextAreaField,
-  number: NumberField,
-  boolean: BooleanField,
-  select: SelectField,
-  date: DateField,
-  datetime: DateTimeField,
-  time: TimeField,
-  email: EmailField,
-  phone: PhoneField,
-  url: UrlField,
-  multiselect: MultiSelectField,
-  radio: RadioField,
-  checkboxes: CheckboxesField,
-  tags: TagsField,
-  currency: CurrencyField,
-  percent: PercentField,
-  password: PasswordField,
-  markdown: RichTextField,
-  html: RichTextField,
-  richtext: RichTextField,
-  lookup: LookupField,
-  master_detail: LookupField,
-  file: FileField,
-  image: ImageField,
-  location: LocationField,
-  formula: FormulaField,
-  summary: SummaryField,
-  auto_number: AutoNumberField,
-  user: UserField,
-  owner: UserField,
-  object: ObjectField,
-  vector: VectorField,
-  grid: GridField,
-  color: ColorField,
-  slider: SliderField,
-  rating: RatingField,
-  code: CodeField,
-  avatar: AvatarField,
-  address: AddressField,
-  geolocation: GeolocationField,
-  signature: SignatureField,
-  qrcode: QRCodeField,
-  'object-ref': ObjectRefField,
-  'filter-condition': FilterConditionField,
-  'recipient-picker': RecipientPickerField,
-};
-
-/** Option widgets render an "unfillable" placeholder unless offered a list. */
-const OPTION_TYPES = new Set(['select', 'multiselect', 'radio', 'checkboxes', 'tags']);
-const OPTIONS = [
-  { label: 'Alpha', value: 'alpha' },
-  { label: 'Beta', value: 'beta' },
-];
-
-/**
- * The value each variant starts from: `null` is MISSING for the required check
- * this repo implements (presence, not truthiness — `false` and `0` are values,
- * cloud#972), so one value drives a real validation failure for every type,
- * including `boolean`. Trap 3 above is why that matters, and why every error
- * variant asserts the message before it scans.
- */
-const MISSING_VALUE = null;
-
-/** Author-written extras — the open tail that a blacklist cannot close. */
-const AUTHORED_EXTRAS = {
-  zzcanary: 'CANARY-STR',
-  zzcanaryobj: { nested: true },
-  zzcanarynum: 42,
-  zzcanaryCamel: 'CANARY-CAMEL',
-  reference_to: 'contacts',
-};
-
-function fieldConfig(type: string, extras: Record<string, unknown> = {}) {
-  return {
-    name: 'f',
-    label: 'F',
-    type: `field:${type}`,
-    ...(OPTION_TYPES.has(type) ? { options: OPTIONS } : {}),
-    ...extras,
-  };
-}
-
-function renderForm(field: Record<string, unknown>, required: boolean) {
-  const Form = ComponentRegistry.get('form')!;
-  return render(
-    <Form
-      schema={{
-        type: 'form',
-        mode: 'create',
-        showSubmit: true,
-        showCancel: false,
-        submitLabel: 'Create',
-        defaultValues: { f: MISSING_VALUE },
-        fields: [{ ...field, required }],
-        onSubmit: () => {},
-      }}
-    />,
-  );
-}
-
-/**
- * The form row. Waiting on `[data-field]` (emitted by `FormItem` for EVERY
- * field) rather than widget-specific copy keeps the wait condition identical
- * for all 46 widgets and independent of what any one of them renders.
- */
-async function formRow(): Promise<Element> {
-  return waitFor(() => {
-    const row = document.querySelector('[data-field="f"]');
-    if (!row) throw new Error('field row never rendered');
-    return row;
-  });
-}
-
-beforeAll(() => {
-  for (const [type, Widget] of Object.entries(WIDGETS)) {
-    // `withFieldCarrier` is the real registration seam (objectui#3233) — going
-    // around it would test a widget in a shape no host ever produces.
-    ComponentRegistry.register(type, withFieldCarrier(Widget) as any, {
-      namespace: 'field',
-      skipFallback: true,
-    });
-  }
-}, 60000);
-
-beforeEach(() => {
-  if (!(Element.prototype as any).scrollIntoView) {
-    (Element.prototype as any).scrollIntoView = () => {};
-  }
-});
-
-afterEach(() => {
-  cleanup();
-  vi.restoreAllMocks();
-});
-
-describe('no field widget leaks non-DOM props to the DOM (objectui#3291)', () => {
-  it('covers every field type the form can render', () => {
-    // The gate's reach. Without this, adding a widget adds an unscanned widget.
-    expect(Object.keys(WIDGETS).sort()).toEqual([...FORM_FIELD_TYPES].sort());
-  });
-
-  const types = Object.keys(WIDGETS);
-
-  it.each(types)('field:%s — form path, plain field', async (type) => {
-    renderForm(fieldConfig(type), false);
-    const row = await formRow();
-    expect(leakReport(`field:${type} [form/plain]`, findLeaks(row))).toBe('');
-  });
-
-  it.each(types)('field:%s — form path, author-written extra keys', async (type) => {
-    // The largest measured leak source: the form renderer destructures a fixed set
-    // of known keys and forwards the rest verbatim, so anything else an author
-    // put on the field config arrives at the widget as a prop.
-    renderForm(fieldConfig(type, AUTHORED_EXTRAS), false);
-    const row = await formRow();
-    expect(leakReport(`field:${type} [form/authored-extras]`, findLeaks(row))).toBe('');
-  });
-
-  it.each(types)('field:%s — form path, after a real validation failure', async (type) => {
-    renderForm(fieldConfig(type), true);
-    const row = await formRow();
-
-    fireEvent.click(screen.getByRole('button', { name: /create/i }));
-
-    // Trap 3: scan only once the error is PROVEN to exist. A variant that
-    // silently produced none would otherwise pass while testing nothing.
-    await waitFor(() => {
-      expect(document.querySelector('[data-field="f"]')?.textContent ?? '').toContain(
-        'is required',
-      );
-    });
-
-    expect(
-      leakReport(`field:${type} [form/validation-error]`, findLeaks(await formRow())),
-    ).toBe('');
-  });
-
-  it.each(types)('field:%s — SDUI path, plain node', async (type) => {
-    // Strictly wider than the form path: `SchemaRenderer` spreads the whole
-    // authored node as props with no strip layer, so the widget's own spread
-    // is the only defence here.
-    const { container } = render(
-      <SchemaRenderer schema={{ ...fieldConfig(type), type: `field:${type}` } as any} />,
-    );
-    await waitFor(() => expect(container.firstElementChild).toBeTruthy());
-    expect(leakReport(`field:${type} [sdui/plain]`, findLeaks(container))).toBe('');
-  });
-
-  it.each(types)('field:%s — SDUI path, author-written extra keys', async (type) => {
-    const { container } = render(
-      <SchemaRenderer
-        schema={{ ...fieldConfig(type, AUTHORED_EXTRAS), type: `field:${type}` } as any}
-      />,
-    );
-    await waitFor(() => expect(container.firstElementChild).toBeTruthy());
-    expect(leakReport(`field:${type} [sdui/authored-extras]`, findLeaks(container))).toBe('');
-  });
-});

package/src/__tests__/widget-props-contract.test.tsx

@@ -1,142 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/**
- * `FieldWidgetComponentProps` is a CLOSED contract (objectui#3221).
- *
- * It used to end in `[key: string]: any`, which made every check over it
- * vacuous: a type claiming to have every key can never be reported as missing
- * one (objectstack#4075). Three consequences, one test each below:
- *
- *  1. a key the type does not declare is a compile error, not a silent `any`
- *     — which is what let objectui#3222 rename the validation slot to the
- *     spec's `error` with the compiler, not grep, proving no call site was
- *     missed;
- *  2. a MISSPELLED prop (`readOnly` for `readonly`) is rejected;
- *  3. the pass-through keys hosts genuinely forward still type-check, and
- *     still reach the rendered control at runtime — closing the type must not
- *     have been paid for by dropping real behaviour.
- *
- * (1) and (2) are compile-time: a violation fails `pnpm --filter
- * @object-ui/fields type-check`, not this run. `@ts-expect-error` inverts
- * that — the line fails to compile if the error it expects ever STOPS
- * happening, i.e. if the index signature comes back.
- */
-
-import { describe, it, expect } from 'vitest';
-import { render, screen } from '@testing-library/react';
-
-import { TextField } from '../widgets/TextField';
-import { BooleanField } from '../widgets/BooleanField';
-import type { FieldWidgetComponentProps } from '../widgets/types';
-import type { FieldMetadata } from '@object-ui/types';
-
-type Assert<T extends true> = T;
-type Equal<A, B> = (<T>() => T extends A ? 1 : 2) extends <T>() => T extends B ? 1 : 2 ? true : false;
-type Extends<A, B> = [A] extends [B] ? true : false;
-
-const field = { name: 'title', label: 'Title', type: 'text' } as unknown as FieldMetadata;
-
-describe('FieldWidgetComponentProps is closed (objectui#3221)', () => {
-  it('has no `[key: string]` index signature', () => {
-    // The single assertion the whole change turns on. While the index
-    // signature existed this was `true`, and every check below was vacuous.
-    type _NotOpen = Assert<Equal<Extends<string, keyof FieldWidgetComponentProps>, false>>;
-    expect(true).toBe(true);
-  });
-
-  it('rejects keys it does not declare', () => {
-    const props = {} as FieldWidgetComponentProps<string>;
-
-    // `required` stays out on purpose (objectui#3222): the required marker has
-    // exactly one author, the form renderer's `<FormLabel>`, and handing the
-    // flag to widgets invites a second one. Its sibling `error` went the other
-    // way — the spec declares it, so the slot below adopted the spec's name and
-    // the form renderer now produces it.
-    // @ts-expect-error `required` is not part of this contract
-    void props.required;
-    const message: string | undefined = props.error;
-    void message;
-
-    // …and the class of bug the index signature hid best: a typo.
-    // @ts-expect-error the prop is `readonly`, not React's DOM `readOnly`
-    void props.readOnly;
-    // @ts-expect-error the prop is `onChange`
-    void props.onchange;
-
-    // The second metadata carrier is gone (objectui#3233). `schema` was a
-    // DECLARED key here through #3221 — one concept under two spellings, which
-    // is how ~30 widgets ended up resolving `field || schema`. v17 converged it
-    // at the producers, so reading it is now a compile error rather than a
-    // silent second contract for the next widget author to discover.
-    // @ts-expect-error `schema` was retired from the widget contract in v17
-    void props.schema;
-
-    expect(true).toBe(true);
-  });
-
-  it('still accepts the pass-through keys hosts actually forward', () => {
-    // Closing the type is only correct if the real call sites still compile.
-    // Each key here has a named producer: the form renderer, the inline-edit
-    // host, or the line-item grid. Deleting one from the type breaks this.
-    const passThrough: FieldWidgetComponentProps<string> = {
-      value: '',
-      onChange: () => {},
-      // The single metadata carrier (objectui#3233) — every host produces this
-      // one key: the form renderer (`renderFieldComponent`), the inline-edit
-      // hosts, and the registry adapter that maps `SchemaRenderer`'s SDUI node
-      // onto it.
-      field,
-      dataSource: {},
-      dependentValues: { country: 'cn' },
-      dependsOn: ['country'],
-      emptyHint: 'Select country first',
-      name: 'title',
-      // inline-edit hosts / line-item grid
-      compact: true,
-      autoFocus: true,
-      onSelectRecord: () => {},
-      onCreateNew: () => {},
-      // DOM / a11y
-      id: 'title-input',
-      'aria-label': 'Title',
-      'data-testid': 'field-title',
-    };
-    expect(passThrough.compact).toBe(true);
-  });
-});
-
-describe('closing the type kept the pass-through behaviour', () => {
-  it('forwards a11y and data attributes to the rendered input', () => {
-    render(
-      <TextField
-        value="hello"
-        onChange={() => {}}
-        field={field}
-        aria-label="Title"
-        data-testid="title-input"
-      />,
-    );
-    const input = screen.getByTestId('title-input');
-    expect(input).toHaveAttribute('aria-label', 'Title');
-    expect(input).toHaveValue('hello');
-  });
-
-  it('forwards `disabled` — a declared key, not an index-signature accident', () => {
-    render(
-      <BooleanField
-        value={false}
-        onChange={() => {}}
-        field={{ name: 'active', label: 'Active', type: 'boolean' } as unknown as FieldMetadata}
-        disabled
-        data-testid="active-switch"
-      />,
-    );
-    expect(screen.getByTestId('active-switch')).toBeDisabled();
-  });
-});

package/src/coerce-safe-value.test.ts

@@ -1,34 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { coerceToSafeValue } from './index';
-
-describe('coerceToSafeValue — reference / lookup values', () => {
-  it('extracts a label from a JSON-string reference (unresolved external-id ref)', () => {
-    // Regression: a master_detail/lookup value can arrive as a JSON-encoded
-    // string; it must render a label, not raw '{"externalId":"..."}'.
-    expect(coerceToSafeValue('{"externalId":"Website Relaunch"}')).toBe('Website Relaunch');
-  });
-
-  it('extracts a label from a reference object, name > label > externalId > id', () => {
-    expect(coerceToSafeValue({ externalId: 'X' })).toBe('X');
-    expect(coerceToSafeValue({ name: 'N', externalId: 'X' })).toBe('N');
-    expect(coerceToSafeValue({ label: 'L', externalId: 'X' })).toBe('L');
-    expect(coerceToSafeValue({ id: 'id1' })).toBe('id1');
-  });
-
-  it('handles a JSON-string array of references', () => {
-    expect(coerceToSafeValue('[{"name":"A"},{"externalId":"B"}]')).toBe('A, B');
-  });
-
-  it('leaves plain strings and non-JSON-looking strings untouched', () => {
-    expect(coerceToSafeValue('Website Relaunch')).toBe('Website Relaunch');
-    expect(coerceToSafeValue('{not valid json')).toBe('{not valid json');
-    expect(coerceToSafeValue('hello')).toBe('hello');
-  });
-
-  it('passes through primitives and null/undefined', () => {
-    expect(coerceToSafeValue(42)).toBe(42);
-    expect(coerceToSafeValue(true)).toBe(true);
-    expect(coerceToSafeValue(null)).toBe(null);
-    expect(coerceToSafeValue(undefined)).toBe(undefined);
-  });
-});