Le parole che il CSS teneva separate restano separate
Una riga come 39 words · 1 heading · 1 table è di solito fatta di elementi distinti la cui distanza viene dal layout e non dal markup, così veniva convertita come 39words1heading1table. L’estensione ora legge la pagina con il suo layout in mano e rimette quegli spazi prima di convertire. Righe di conteggi, liste di tag e briciole di pane tornano a uscire come frasi.
Apri il markup di una pagina e guarda la riga di conteggi sotto il titolo di un articolo. Molto spesso non contiene un solo carattere di spazio: <span>39</span><span>words</span>, e la distanza che vedi sullo schermo è una proprietà gap su un contenitore flex. Lo spazio sta nel foglio di stile, non nel documento.
Ogni convertitore che viene dopo vede la stringa e non la pagina — il nostro compreso — e le parole arrivano dunque appiccicate. Non è nemmeno una forma esotica: una riga di conteggi, una lista di tag, una traccia di briciole di pane e una barra di paginazione hanno tutte questo aspetto in qualsiasi framework attuale.
Perché si può sistemare solo dentro la pagina
L’unico posto capace di dire se due elementi sono disposti fianco a fianco è la pagina stessa, finché lì esiste getComputedStyle. Una volta che l’HTML è stato copiato fuori per essere convertito, il layout se n’è andato con il foglio di stile e nessuna congettura lo recupera: in <span>39</span><span>words</span> non c’è nulla che dica se uno spazio ci vada o no.
L’estensione perciò clona il documento, percorre il clone accanto a quello vivo e, ovunque l’elemento vero disponga i suoi figli come elementi flex o grid, la copia riceve uno spazio dopo ciascuno di loro. A essere convertita è la copia. La tua pagina non viene toccata, e tutto questo gira solo nel momento in cui premi il pulsante: nelle tue schede non siede alcuno script.
Un file che lasci cadere sul sito non riceve niente di tutto ciò, perché lì non c’è layout da leggere. È la differenza fra convertire una pagina e convertire una copia del suo markup, ed è buona parte del motivo per cui l’estensione esiste.
Che cosa non copre
Flex e grid, e nient’altro. Lo spazio prodotto da un margine su un inline-block, da un posizionamento assoluto o da contenuto generato in un ::before resta invisibile nel markup, e continua a uscire chiuso.
Nemmeno la conversione di una selezione cambia: un intervallo selezionato viene clonato direttamente dal documento, quindi una riga di conteggi presa come selezione può ancora arrivare come 39words. Premi il pulsante senza selezionare nulla e la via della pagina intera ti restituisce gli spazi.
Da leggere: salvare una pagina web come Markdown e Turndown e le librerie da HTML a Markdown.