|
| 1 | +/** |
| 2 | + * ObjectUI |
| 3 | + * Copyright (c) 2024-present ObjectStack Inc. |
| 4 | + * |
| 5 | + * This source code is licensed under the MIT license found in the |
| 6 | + * LICENSE file in the root directory of this source tree. |
| 7 | + */ |
| 8 | + |
| 9 | +/** |
| 10 | + * The builder accepts the spec-derived group the `filter-builder` renderer |
| 11 | + * hands it (#26306). |
| 12 | + * |
| 13 | + * The renderer passes `schema.value` — the authored `FilterGroup` from |
| 14 | + * `@object-ui/types`, whose row takes its operator from the spec's |
| 15 | + * `ViewFilterOperator` — to a builder typed on its own `FilterBuilderRowGroup`. |
| 16 | + * The two were assignable in neither direction, and the renderer props' `any` |
| 17 | + * index signature hid that. Measured against the spec's `ViewFilterRule` |
| 18 | + * (`@objectstack/spec/ui`), the row diverged in three VALUE cases and in no |
| 19 | + * operator case a consumer can author: |
| 20 | + * |
| 21 | + * | case | spec rule | builder row (before) | |
| 22 | + * |--------------------------------|------------------------|---------------------------------| |
| 23 | + * | value omitted (unary operator) | `value?` | `value` required | |
| 24 | + * | value `null` | admitted | refused | |
| 25 | + * | boolean entry in a list / pair | refused | admitted (kept, see below) | |
| 26 | + * | operator | `VIEW_FILTER_OPERATORS` | those + opt-in `exists` / `notExists` | |
| 27 | + * |
| 28 | + * The operator row is not a divergence on the way IN: every spec id is a |
| 29 | + * builder id. The opt-in pair is the builder's emit-side extension (objectui#9559 |
| 30 | + * ruling B) and is pinned in `filter-builder-name-authority-9306.test.tsx`. |
| 31 | + * |
| 32 | + * The builder's row now takes the spec's value by reference |
| 33 | + * (`ViewFilterRule["value"]`), so the two cases that kept an authored group out |
| 34 | + * of the builder have one pin each below. Neither was only a type gap: a field |
| 35 | + * switch converted the ABSENT value, so a value-less row on a number column |
| 36 | + * threw on `.trim()` and on a text column came back as the string |
| 37 | + * `"undefined"`. |
| 38 | + * |
| 39 | + * The third case runs the other way — the builder is WIDER than the spec, so it |
| 40 | + * does not keep an authored group out — and is left as it is here: the row |
| 41 | + * keeps its boolean list member beside the spec's value, and narrowing it is a |
| 42 | + * breaking change to a published type with a consumer in `@object-ui/plugin-list` |
| 43 | + * (`UserFilters` hands `LookupValuePicker` a boolean-bearing list). The pin |
| 44 | + * below states the width as it is, so the narrowing has to change it. |
| 45 | + * |
| 46 | + * Type-level pins are judged by `tsc -p tsconfig.test.json`; a green vitest run |
| 47 | + * says nothing about them. |
| 48 | + */ |
| 49 | +import { describe, it, expect, vi } from 'vitest'; |
| 50 | +import React from 'react'; |
| 51 | +import { render, screen, fireEvent, waitFor } from '@testing-library/react'; |
| 52 | +import '@testing-library/jest-dom'; |
| 53 | +import type { ViewFilterRule } from '@objectstack/spec/ui'; |
| 54 | +import type { FilterField, FilterGroup } from '@object-ui/types'; |
| 55 | +import { |
| 56 | + FilterBuilder, |
| 57 | + retypeFilterValue, |
| 58 | + type FilterBuilderProps, |
| 59 | + type FilterBuilderRow, |
| 60 | +} from '../custom/filter-builder'; |
| 61 | + |
| 62 | +type Equal<A, B> = |
| 63 | + (<T>() => T extends A ? 1 : 2) extends (<T>() => T extends B ? 1 : 2) ? true : false; |
| 64 | +function expectType<T extends true>(_: T = true as T): void { /* compile-time only */ } |
| 65 | +type Assignable<From, To> = [From] extends [To] ? true : false; |
| 66 | + |
| 67 | +/* ── The shapes ───────────────────────────────────────────────────────────── */ |
| 68 | + |
| 69 | +// The row's value IS the spec rule's value — by reference, not a copy of it — |
| 70 | +// plus the builder's own wider list member. |
| 71 | +expectType<Equal<FilterBuilderRow['value'], ViewFilterRule['value'] | (string | number | boolean)[]>>(); |
| 72 | +expectType<Assignable<ViewFilterRule['value'], FilterBuilderRow['value']>>(); |
| 73 | +// The renderer's two reads cross with no cast: the authored group and the |
| 74 | +// authored field list are what the builder's props take. |
| 75 | +expectType<Assignable<FilterGroup, NonNullable<FilterBuilderProps['value']>>>(); |
| 76 | +expectType<Assignable<FilterField[], NonNullable<FilterBuilderProps['fields']>>>(); |
| 77 | + |
| 78 | +const FIELDS: NonNullable<FilterBuilderProps['fields']> = [ |
| 79 | + { value: 'title', label: 'Title', type: 'text' }, |
| 80 | + { value: 'amount', label: 'Amount', type: 'number' }, |
| 81 | + { value: 'quota', label: 'Quota', type: 'currency' }, |
| 82 | +]; |
| 83 | + |
| 84 | +/** Render ONE authored row, typed as the authored group — no cast. */ |
| 85 | +function renderAuthored(row: FilterGroup['conditions'][number]) { |
| 86 | + const onChange = vi.fn(); |
| 87 | + // Hoisted out of the JSX: the sync effect re-seeds state when the `value` |
| 88 | + // prop's identity changes, which would undo the interaction under test. |
| 89 | + const value: FilterGroup = { logic: 'and', conditions: [row] }; |
| 90 | + render(<FilterBuilder fields={FIELDS} value={value} onChange={onChange} />); |
| 91 | + return onChange; |
| 92 | +} |
| 93 | + |
| 94 | +function lastRow(onChange: ReturnType<typeof vi.fn>): FilterBuilderRow { |
| 95 | + expect(onChange.mock.calls.length, 'the builder never called onChange').toBeGreaterThan(0); |
| 96 | + return onChange.mock.calls.at(-1)?.[0].conditions[0]; |
| 97 | +} |
| 98 | + |
| 99 | +/** Drive the row's REAL dropdown at `index` (0 = field). */ |
| 100 | +async function pick(index: number, label: string) { |
| 101 | + fireEvent.keyDown(screen.getAllByRole('combobox')[index], { key: 'ArrowDown' }); |
| 102 | + const option = await waitFor(() => { |
| 103 | + const found = screen.getAllByRole('option').find((o) => o.textContent === label); |
| 104 | + expect(found, `no "${label}" option in dropdown ${index}`).toBeTruthy(); |
| 105 | + return found!; |
| 106 | + }); |
| 107 | + fireEvent.click(option); |
| 108 | +} |
| 109 | + |
| 110 | +describe('#26306 — the builder accepts the spec-derived row', () => { |
| 111 | + it('value omitted: a value-less row keeps no value through a field switch (it used to throw on a number column)', async () => { |
| 112 | + const onChange = renderAuthored({ id: 'c1', field: 'title', operator: 'is_null' }); |
| 113 | + await pick(0, 'Amount'); |
| 114 | + const row = lastRow(onChange); |
| 115 | + expect(row.field).toBe('amount'); |
| 116 | + expect(row.operator).toBe('is_null'); |
| 117 | + expect(row.value).toBeUndefined(); |
| 118 | + // The text family, where the absence used to come back spelled out. |
| 119 | + expect(retypeFilterValue(undefined, 'text', 'is_null')).toBeUndefined(); |
| 120 | + }); |
| 121 | + |
| 122 | + it('value null: a null row keeps null through a field switch (it used to throw on `.trim()`)', async () => { |
| 123 | + const onChange = renderAuthored({ id: 'c1', field: 'amount', operator: 'equals', value: null }); |
| 124 | + // Drawn as unfilled, not as the string "null". |
| 125 | + expect((document.querySelector('input[placeholder="Value"]') as HTMLInputElement).value).toBe(''); |
| 126 | + await pick(0, 'Quota'); |
| 127 | + const row = lastRow(onChange); |
| 128 | + expect(row.field).toBe('quota'); |
| 129 | + expect(row.value).toBeNull(); |
| 130 | + }); |
| 131 | + |
| 132 | +}); |
![objectstack-fleet[bot]](https://avatars.githubusercontent.com/u/254823548?v=4&size=40){kind=avatar}
0 commit comments