Attualmente in Discourse, se incolli testo normale nell’editor, il comportamento tipico del browser tramite Ctrl+Z annullerà l’incolla e rimuoverà il testo incollato. Tuttavia, se incolli testo formattato come questo testo in grassetto, l’annullamento non funziona. Allo stesso modo, non è possibile annullare l’incolla di link sopra del testo per renderli collegati, né il markdown inserito tramite scorciatoie come Ctrl+B o quando si aggiunge formattazione dalle opzioni della barra degli strumenti dell’editor. Idealmente, la maggior parte di questo dovrebbe essere aggiunta allo stack di annullamento in modo che Ctrl+Z funzioni.
Ti darò una descrizione di ciò che mi succede abbastanza spesso.
Copio del testo da un altro sito web che risulta essere un link, in grassetto, un’intestazione, ecc. (A volte questo fatto viene registrato e a volte no.)
Vado su Discourse per incollare questo testo nel mio post già parzialmente scritto.
Premo Ctrl+V che inserisce il testo formattato.
Mi rendo conto del mio errore e premo Ctrl+Z, che non fa nulla.
Rimuovo manualmente il testo formattato che ho inserito per errore. (Il più delle volte è la versione collegata che ho incollato per errore, quindi non è come se dovessi rimuovere solo un # o qualcosa di simile.)
Premo Ctrl+Shift+V che avrei dovuto fare la prima volta per incollare il testo non formattato.
Ovviamente questo è in parte un errore dell’utente, e quando non sbaglio sono solo due passaggi (copia da altro sito web, incolla come testo normale in Discourse). Ma quando sbaglio (cosa che accade spesso dato che sono abituato a premere solo Ctrl+V dato che la maggior parte dei siti web non fa l’incolla formattato) sarebbe bello se potessi risparmiare tempo facendo funzionare Ctrl+Z come al solito.
Questo è generalmente un comportamento nativo del browser e non qualcosa che Discourse sta facendo. Prova a testare con una casella di testo normale in HTML.
Va bene, l’annullamento non funziona per impostazione predefinita quando si utilizza JavaScript per modificare un input. Ma ho cercato su Google e ho scoperto che document.execCommand può inserire testo aggiungendolo allo stack di annullamento.
Ad esempio, se fai document.getElementById('myInput').value = 'asd' e poi Ctrl+Z, non verrà annullato.
Ma se fai document.execCommand('insertText', false, 'asd') mentre il cursore è dove vuoi che sia (come dovrebbe essere in base al flusso di lavoro corrente di Discourse), il testo viene inserito correttamente e Ctrl+Z rimuoverà il testo aggiunto come previsto.
Fondamentalmente, mi chiedo se document.execCommand (o qualche altro processo se un altro approccio è considerato migliore) possa essere utilizzato per aggiungere allo stack di annullamento in modo che Ctrl+Z funzioni in questi casi.
No — abbiamo rimosso intenzionalmente quel supporto da Discourse anni fa, preferendo lasciare che la gestione nativa dell’annullamento della casella di testo del browser funzioni come dovrebbe su tutti i siti web standard.
Penso di essermi perso qualcosa. Cosa significa esattamente “consentire al browser di gestire nativamente l’annullamento delle caselle di testo”? Per quanto ne so, l’annullamento per il testo formattato non funziona affatto in Discourse, quindi stai dicendo che il mancato funzionamento dell’annullamento è il comportamento standard del sito web?
Il motivo per cui sono confuso è che non riesco a pensare a un singolo sito web (ad eccezione di cose come Microsoft Word dove l’annullamento funziona) che supporti il copia-incolla formattato oltre a Discourse. Quindi non ho nulla con cui confrontare Discourse per vedere cosa è “standard”. Se potessi indicarmi alcuni siti web di confronto, sarebbe molto utile.
Premi Try it yourself, quindi inserisci del testo nella casella di testo, fai una pausa, quindi premi Ctrl+Z per annullare le tue azioni. Ecco una demo. Per prima cosa premiamo il pulsante Try it yourself, che visualizza un textarea HTML nel browser.
La mia comprensione è che @seanblue stia chiedendo se possiamo modificare le API del browser che utilizziamo quando manipoliamo l’area di testo per suggerire meglio al browser in modo che possa gestire meglio l’annullamento. Quindi questo si applicherebbe solo alle scorciatoie da tastiera, alla barra degli strumenti, al caricamento e cose del genere.
Non sono contrario a ottimizzare le cose qui, ma temo che alcune di queste API richiederanno molta attenzione, c’è certamente il rischio di regressioni.
Non sono contrario a esperimenti qui, forse se la community desidera inviare alcune PR per mostrarci come si fa.
Potremmo decisamente fare di meglio qui. Molti dei nostri pulsanti della barra degli strumenti e il comportamento di incolla avanzato impostano direttamente il valore dell’area di testo in JavaScript. Questo interrompe completamente la cronologia nativa di annullamento/ripristino del browser.
Invece, ogni volta che apportiamo modifiche programmatiche all’area di testo, dovremmo utilizzare document.execCommand (come menzionato da @seanblue). In questo modo, il browser lo interpreta allo stesso modo di un’azione dell’utente e lo inserisce in modo pulito nella cronologia di annullamento/ripristino.
il comando insertText, che puoi usare per sostituire programmaticamente il testo nella posizione del cursore preservando il buffer di annullamento (cronologia delle modifiche) negli elementi textarea e input semplici.
Ma quella casella di testo non gestisce il testo formattato, che non è di ciò di cui sto parlando. So che i browser gestiscono l’annullamento del testo normalmente digitato e incollato. Il mio punto è che Discourse non gestisce l’annullamento del testo formattato incollato. Segui questi passaggi per vedere di cosa sto parlando.
Ora copia il seguente testo invece e incollalo nel compositore: questo è un test fantastico
Nota che lo incolla con il markdown per rendere corsivo “fantastico”.
Esatto. Non sto suggerendo di gestire l’annullamento in JavaScript. Sto suggerendo che quando manipoli la textarea, lo fai sapere al browser in modo che possa annullare la modifica da solo quando l’utente preme Ctrl+Z.
Per quanto vale, il 99% della mia frustrazione sarebbe risolta se Ctrl+Z funzionasse dopo aver incollato testo formattato. Sarebbe ideale se ogni singola operazione potesse essere annullata con Ctrl+Z? Certo. Ma la maggior parte delle altre operazioni possono essere annullate ripetendo l’operazione originale (ad esempio, fare Ctrl+B può aggiungere e rimuovere il markdown in grassetto). Ma con l’incolla, ha il potenziale per includere una quantità significativa di markdown inaspettato, inclusi intestazioni, collegamenti e persino tabelle, motivo per cui è così importante che l’annullamento funzioni in quel caso.
Se restringessimo l’ambito alla sola gestione dell’annullamento nel caso dell’incolla formattato e ignorassimo altre scorciatoie, pulsanti della barra degli strumenti, ecc., ciò ridurrebbe abbastanza il rischio da tentare?
Capisco; tra la tua spiegazione e quella di @david, capisco la distinzione. Semplicemente non uso molto quei pulsanti nell’editor per la maggior parte. Digito le cose nella casella di testo usando la tastiera del mio computer (fisica o su schermo), e questo viene gestito senza problemi dal browser.
È comprensibile. Anch’io tendo a digitare il markdown invece di usare i pulsanti della barra degli strumenti per quello, quindi quell’aspetto non è un vero problema per me. Ho menzionato le cose della barra degli strumenti nell’OP solo per sottolineare che non succede solo quando si incolla testo formattato. La possibilità di annullare le azioni della barra degli strumenti non è molto importante perché l’utente sta compiendo quelle azioni intenzionalmente. Ma quando si incolla, la formattazione è spesso incidentale e inaspettata, quindi la possibilità di annullarla sarebbe molto comoda.
Non è ancora programmato, ma sì, sembra fare al caso nostro. Penso che dovremmo cambiare la nostra implementazione sia per la barra degli strumenti che per cose come le scorciatoie CTRL-B e le menzioni.
È un cambiamento piuttosto complesso, direi che ci vorrebbero circa 1-3 settimane di lavoro per implementarlo completamente. C’è molta superficie di attacco:
Copia e incolla immagini
Caricamenti
Grassetto / Corsivo
Link
@menzioni
#autocompletamento
Supporto questo cambiamento ma non sono sicuro di quando possiamo programmarlo… Suppongo che vada bene inserirlo nella nostra prossima release, ci sono obiezioni @codinghorror?
Mi piace che sarai in grado di fare CTRL-Z fino a una casella vuota invece di essere bloccato alla tua prima menzione, link, ecc…
Una cosa positiva è che (secondo me) può essere ragionevolmente fatto in modo incrementale piuttosto che doverlo rilasciare tutto in una volta. Ovviamente non so se sarà così da una prospettiva tecnica, ma da una prospettiva utente penso che andrebbe bene. Alcune separazioni logiche potrebbero essere:
Incollare testo che diventa formattato, incluse cose come grassetto, immagini e collegamenti
Completamento automatico di menzioni, categorie/tag, emoji
Scorciatoie da tastiera come Ctrl+B per il grassetto
Azioni della barra degli strumenti, come grassetto, nascondi dettagli, sfoca spoiler, ecc.
Penso che ogni gruppo potrebbe essere realizzato individualmente senza confondere gli utenti, e personalmente questo è l’ordine in cui lo implementerei.
Sto inserendo questo lavoro per il nostro prossimo rilascio, il che significa che lo sistemeremo nei prossimi 6 mesi circa, non accadrà dall’oggi al domani, ma faremo progressi qui.
Sì, ti capisco perfettamente, ma ci vorrà ancora un po’ di tempo.
Si è trasformato in un refactoring completo necessario per il composer. Il nostro piano a lungo termine è quello di supportare un diverso livello di astrazione per il composer, che ora è INCOLLATO MOLTO DURAMENTE al fatto che sia sempre un elemento TEXTAREA.
La prima mossa per sbloccare la situazione è supportare un composer contenteditable che assomigli e si comporti come la nostra attuale area di testo.
Non prevedo che inizieremo questo progetto prima di altri 3 mesi, perché abbiamo altri 3 progetti molto grandi prima di questo, ma sicuramente prevedo che inizieremo questo progetto quest’anno.
Nessun problema, stavo solo cercando un aggiornamento.
Wow, non avevo mai sentito parlare di contenteditable fino ad ora. Ti dispiace condividere una breve spiegazione tecnica del perché questo cambiamento è necessario/desiderabile? Se non vuoi va bene, sono solo curioso.
È un po’ complicato, ma vogliamo entrare nel mondo della sperimentazione con editor avanzati. Questo lo renderebbe possibile.
Il motivo per cui questo lavoro è sulla strada critica è che tutti i nostri interni sono pesantemente accoppiati a un’implementazione specifica (TEXTAREA). Non abbiamo una singola funzione per interfacciarci con il compositore, è più simile a copiare e incollare 20 implementazioni diverse.
Quello che vorremmo fare è avere un piccolo componente “scheletro” che dica:
Questo è come si seleziona il testo
Questo è come si inserisce il testo
E così via… poi possiamo reimplementare lo scheletro come un contenteditable o un’implementazione di TEXTAREA “undo friendly”.
Tuttavia, molto codice deve essere spostato per consentirlo.
Questo non è neanche lontanamente completo come il lavoro a lungo termine descritto da @sam. Ma penso che possa aiutare nel breve termine. Dovrebbe preservare la cronologia di annullamento quando si incolla testo formattato, si cita e quando si utilizzano (la maggior parte dei) pulsanti/scorciatoie da tastiera dell’editor.
È già attivo su Meta - segnalate se notate problemi.
