The Build tab lets a list get a 21st item or one over 60 characters, then rolls it back with a cryptic error

Abierto
#784 0 comentarios 0 reacciones 1 asignado Ver en GitHub

Los mantenedores suelen responder en 1 día

@richshaw ya está trabajando en esto.

Desde el 3/11/2026.

  • #789 de @richshaw — abierto

Evaluación

Este issue todavía no se ha evaluado.

Descripción

bug pipeline:building pipeline:ux

What happens

A List field allows at most MAX_CHOICES (20) items, each at most CHOICE_MAX_LENGTH (60) characters (ChoiceSchema and the enum config in src/schemas/slot-fields.ts). The Build tab's list picker doesn't enforce either limit:

  • EnumPicker (src/components/build-wysiwyg/EnumPicker.tsx): "Add to list" is always shown, the "New option name" input has no maxLength, and commitNew only trims the text and checks it isn't empty.
  • onAddEnumOption in BuildWysiwyg.tsx (also used by WysiwygGroup.tsx) skips duplicates only, and sends [...choices, value] with no count check.

Example: an organizer running a potluck with 20 dishes types "Dish 21" and adds it.

  1. The cell shows "Dish 21" straight away.
  2. The field save is refused ("Array must contain at most 20 element(s)").
  3. The slot save behind it goes out anyway and is refused too.
  4. The cell rolls back.

What stays on the save rail is the slot refusal, "dish" must be one of: Dish 1, Dish 2, … Dish 20. Nothing says a list holds 20 items. A 61-character item goes the same way.

sanitizeEnumChoices caps the list at 20, but only when a field is first created.

Fix, in outline

  • Export CHOICE_MAX_LENGTH (and MAX_CHOICES, if it isn't already) from src/schemas/slot-fields.ts and import them on the client. Don't type the numbers.
  • In EnumPicker:
    • put maxLength={CHOICE_MAX_LENGTH} on the new-item input;
    • when the list already has MAX_CHOICES items, hide the "Add to list" footer and show a short line in its place, such as "A list holds up to 20 items."
  • In onAddEnumOption, return early at the cap as a backstop.

Watch for

  • Both pickers. The slot editor and the group header use the same component and handler. Check both.
  • Existing tests. BuildWysiwyg.test.tsx covers Enter and blur-to-add (#656, #692). Keep those passing.
  • Help pages. Run the help-pages skill's affected-articles.mjs. If an article describes adding list items, mention the limit and update its UI list if a control's name changes.
  • Out of scope: the slot save still runs after a failed field save. That's a separate change.

Done when

  • An EnumPicker test: with 20 options, there is no "Add to list" and the limit line shows. With 19, "Add to list" is there.
  • A test that the new-item input caps at 60 characters.
  • pnpm lint && pnpm typecheck && pnpm knip && pnpm test pass.

Found by the pipeline's bugs scout in the Build tab's list picker (src/components/build-wysiwyg), at 8e63fab. Checked by an independent verifier with a scratch component test: "Add to list" stayed enabled at 20 items, both saves were refused, and the rail ended on the "must be one of" message. https://claude.ai/code/session_016YZ9SUw2vvaNxfSUsArR5B

Lenguaje dominante
TypeScript
Estrellas
19
Forks
4
Merge medio
19 h 38 min
PR fusionados (30 d)
197

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de richshaw/OpenSignup

Todos los issues de richshaw/OpenSignup

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.