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

[Beta]: The editable button in the Plite inlines example cannot be edited with the mouse

Aperta Adatta ai principianti
#5,290 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

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

Direzione di ricerca

Inizia da apps/www/src/app/(app)/examples/plite/_examples/inlines.tsx, intorno alle righe 491–492, dove lo span del pulsante modificabile imposta role="button" e tabIndex={0}. Confronta quello span e il relativo gestore della tastiera con l’esempio inlines di Slate, quindi riproduci il comportamento al clic e al doppio clic nell’esempio Plite. Il lavoro è completo quando la selezione con il mouse e la digitazione o l’incollaggio consentono di modificare il testo del pulsante, mentre il testo circostante resta modificabile.

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

Descrizione

bug target:beta

Testing lane

  • Repository: udecode/plate
  • Branch: next
  • Release channel: Beta
  • Exact commit/package version: NOT_ENOUGH_INFO

Summary

On https://beta.platejs.org/examples/plite/inlines, the text inside the editable button inline cannot be edited with the mouse. A double-click on button does not select the word, and a single click does not put the caret in it. Whatever is pasted or typed next goes to the previous caret position instead, such as the start of the text. On https://www.slatejs.org/examples/inlines, which this example ports, the same double-click selects the word and a paste replaces it.

Reproduction

Repro 1: double-click and paste, Firefox

An agent ran this on natamox's Mac in Firefox 158 on 2026-10-20, with Slate's example beside it, and recorded both windows.

  1. Open https://beta.platejs.org/examples/plite/inlines with its default content.
  2. Click the text, then press ⌘↑ to put the caret at the start.
  3. Double-click button inside editable button.
  4. Paste a single character, Q.

Results:

  • Step 3: button is not selected.
  • Step 4: Q goes to the start of the text, which now begins QIn addition. The button still reads editable button.
  • Slate, same steps: step 3 selects button, and step 4 turns the button into editable Q.

Both sides were run twice from the default content, with the same result.

Repro 2: double-click and paste, Chrome

An agent ran the steps of Repro 1 in Chrome 155 on 2026-10-20 (PT), in a window 960 px wide. After the double-click the DOM selection was empty, and Q again went to the start of the text.

Repro 3: click and type

An agent ran this in Claude Code's built-in browser (Chromium 152) on 2026-10-21 (PT). There is no recording.

  1. Click inside button in editable button.
  2. Type q, then z.

Result: the button text does not change. qz goes to the previous caret position, which was the end of the document: …our favorite dog video. qz.

natamox retested by hand on 2026-10-20 and 2026-10-21 (PT): the word in the button cannot be selected with a double-click, and a click does not put the caret in it either.

Expected

The button text is editable like the text around it, as in Slate's example: a double-click selects the word, a click puts the caret in it, and pasting or typing changes the button text.

Actual

As listed under Results. Mouse input never reaches the button text, and the next edit lands somewhere else in the document.

Environment

  • Exact next commit/Beta package version: NOT_ENOUGH_INFO. The page does not show its build.
  • Repro 1: Firefox 158.0 on macOS 27.0.1, 2026-10-20. The window was about 960 points wide, so the button wrapped onto two lines, and the double-click hit button on the second line.
  • Repro 2: Chrome 155 on macOS, window 960 px wide, 2026-10-20 (PT). The button wraps here too, which is normal inline wrapping.
  • Repro 3: Claude Code's built-in browser (Chromium 152), 2026-10-21 (PT).
  • Not tried in Safari or on a phone. Not replayed on the live Beta after 2026-10-21. The code below reads the same on next 19023d2e3d.

Caveat

From a reading of the code on next 19023d2e3d, and two devtools checks:

  • The example's button span sets role="button" and tabIndex={0} (apps/www/src/app/(app)/examples/plite/_examples/inlines.tsx:491-492), next to an onKeyDown handler that swallows Enter and Space. Slate's inlines example has none of these. They came in with the lint commit 0231a088c4 on 2026-08-21.
  • In the built-in browser, a double-click on button moved focus to the span, and the editor's selection stayed where it was. With tabindex and role removed from the span in devtools, a double-click selected button and focus stayed in the editor, and a click followed by typing w gave buttwon.
  • So the cause looks like the example, not Plite core: a focusable element inside the editable takes focus away from the editor. Removing those attributes was not tried as a code change.

Evidence

  • Repro 1: the agent's recording, 0:24, Beta on the left and Slate on the right. The two sides were recorded separately and aligned by step, with speed changes and holds, so the timing does not compare. Its Chinese captions were replaced with English ones; the picture is unchanged. The double-click starts at 0:05 and the paste at 0:11. From 0:17 Beta reads QIn addition… and Slate's button reads editable Q.
  • Repro 2: the agent's recording, 0:10, with the browser's tab and address bars covered and English captions in place of the Chinese ones. The double-click is at 0:01.8, and the paste at 0:03.4 puts Q at the start of the text.
Repro 1 — Firefox 158, Beta (left) and Slate (right)

https://github.com/user-attachments/assets/53dd4c5c-63b3-4a4e-8511-1c9733a3931e

Repro 2 — Chrome 155

https://github.com/user-attachments/assets/1da274a8-a135-49b1-baa7-a7f00c0018d4

Related

  • None.
Lingua principale
TypeScript
Stelle
16.6k
Fork
993
Merge medio
20h 1m
PR unite (30g)
60

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

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 udecode/plate

Tutte le issue di udecode/plate

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.