Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

A new List choice typed after "Add to list" is thrown away unless you press Enter

Aperta
  • Qualcosa non va?
#656 0 commenti 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@richshaw ci sta già lavorando.

Dal 27/10/2026.

  • #692 di @richshaw — aperta

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
52/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
react, typescript
Ambito
frontend

Direzione di ricerca

Read src/components/build-wysiwyg/EnumPicker.tsx and its useOutsideClose behavior, then inspect EnumPicker.test.tsx and the SlotEditor and WysiwygGroup call sites. Reproduce the outside-click and unmount-blur sequence first. Done means outside clicks save once, Escape cancels, and Enter, Tab, and the Add button save once; verify Duplicate uses the new slot value and group heading renaming still works.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

bug pipeline:building pipeline:ux

Needs your OK: this changes what happens when an organizer types a new choice into a List field and clicks away. Swap pipeline:proposed for pipeline:ready to have it built.

What happens

On the Build tab, a List field's picker has "+ Add to list". Choosing it shows a small box ("New item name"). What you type is added only if you then press Enter, or Tab out of the box. A click anywhere else throws the text away. That includes another field, Duplicate, Done, or the page. Nothing on screen says Enter is needed, and nothing says the text was dropped. The slot keeps its old value (or sits under the empty group heading), and the list keeps its old choices.

The picker is EnumPicker (src/components/build-wysiwyg/EnumPicker.tsx). SlotEditor uses it for a slot's value, and WysiwygGroup for a group's heading. A mousedown outside runs useOutsideClose → close(), which sets settledRef. The box's onBlur → commitNew then returns early. Tab works only because the hook isn't given { focus: true }, so a blur without a click still reaches commitNew.

In the walkthrough, a new organizer followed a step that said "choose Add to list and type Main", then chose Duplicate as the next step said. The choice was lost twice before they tried Enter. Every list in a signup built that way starts with this step.

Fix, in outline

  • A click outside adds the text, the way Tab already does: if the box holds anything but spaces, add it to the list and pick it for this slot, then close.
  • Escape stays the one way to cancel.
  • Show an "Add" button beside the box, so a mouse user can see how to finish without knowing about Enter.
  • Keep the settledRef guard, so Enter (or the Add button) followed by the unmount blur still adds once.

Watch for

  • The discard is deliberate today. close()'s comment says a blur after Escape or a click outside must not add the draft. Only the click-outside half changes. Escape keeps cancelling.
  • Tests that must keep passing: EnumPicker.test.tsx has "Escape inside the add-input cancels without saving", "does not double-add when Enter is followed by an unmount blur" and "does not add when Escape is followed by an unmount blur". Leave them as they are.
  • A click that also does something. The click that commits may be on Duplicate or Done. commitNew awaits onAddOption (the field's choices PATCH) before onChange (the cell value). Check that a Duplicate pressed straight after typing copies the new value, not the old one, or say in the PR why it can't race.
  • The group heading's picker (WysiwygGroup) is the same component, so it changes too. Check renaming a group heading still behaves.
  • Help: no article mentions Add to list today. Run the help-pages skill's affected-articles.mjs anyway, in case one shows the picker in a screenshot.

Choices this makes

  • A click outside adds rather than discards. Every other builder control saves as you go, so typed text vanishing is the surprise. The alternative is to keep the discard and only show "Press Enter to add".
  • An "Add" button, labelled "Add". A visible way to finish beats a hint line. A hint alone would still lose text for anyone who misses it.

Done when

  • Typing a new choice and then clicking another field, Duplicate or Done adds the choice to the list and sets it on the slot.
  • Escape still cancels with nothing added. Enter, Tab and the Add button each add it once.
  • Unit tests in EnumPicker.test.tsx pin the click-outside add (a mousedown outside, then the unmount blur, adds once) and the Add button.
  • pnpm lint && pnpm typecheck && pnpm knip && pnpm test pass, and the help walkthroughs (pnpm test:e2e tests/e2e/help) still pass.

Found by the UX walkthrough, scenario V2 (following a page's set-up steps word for word), on opensignup-prod main merged with upstream 1d4ff3a. Checked by reading EnumPicker and useOutsideClose against the tester's two lost choices. https://claude.ai/code/session_01ATJ4moQv7TF11SrH9fDe2q

Lingua principale
TypeScript
Stelle
19
Fork
4
Merge medio
22h 10m
PR unite (30g)
168

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di richshaw/OpenSignup

Tutte le issue di richshaw/OpenSignup

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.