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

Visual editor: body text font shrinks after toggling outline (Ctrl+Alt+O) and stays shrunk

Aperta
#1,113 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à
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
72/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Attiva
Stack tecnologico
css, typescript
Ambito
frontend

Direzione di ricerca

Start in the visual editor's theme CSS generator and inspect how the ProseMirror font-size decoration is applied during outline-triggered re-renders. Reproduce the toggle with a configured font size and verify the body font remains unchanged afterward while code blocks remain unaffected. Done means the configured body text size survives opening and closing the outline without reloading the document.

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

Descrizione

visual-editor
Description

In the Quarto visual editor, opening the outline (Ctrl+Alt+O / Show Outline) shrinks the body text font and it stays shrunk after closing the outline. Code blocks are unaffected.

Environment
  • Positron 1.130.0 (VS Code / Code OSS derivative) on Windows 11
  • Quarto extension: 1.136.0 and 1.137.0 (both reproduce)
  • Setting: quarto.visualEditor.fontSize: 20 (pt rendering ~21.33px)
Steps to reproduce
  1. Open any .qmd document in the Quarto visual editor (body text renders at the configured 16pt/20px).
  2. Open the outline panel (Ctrl+Alt+O or Show Outline button).
  3. Observe: body text shrinks to ~14px (14.4px = body {0.9rem} × 16px inherited).
  4. Close the outline: font stays shrunk (does not recover until document reload / source↔visual toggle).

Code cells (.pm-fixedwidth-font) keep their size in every step.

Root cause (instrumented, confirmed on 1.136.0/1.137.0)

Toggling the outline triggers a re-render of the editor; during that re-render the ProseMirror decoration that applies the .pm-proportional-font class to the body is lost. The CSS rule still exists, but the class is no longer on the element, so body text falls back to the inherited font size (~14px). Code blocks use the independent .pm-fixedwidth-font class which is not dropped, which is why only body text shrinks.

Evidence from a DOM probe around the toggle:

  • before: .pm-proportional-font present, computed font-size 21.33px
  • after: .pm-proportional-font count = 0, computed font-size 14px (CSS rule unchanged)
Expected behavior

Body text font size must not depend on a decoration class surviving re-renders. After toggling the outline (or any layout-affecting UI state change) the font-size decoration should be re-applied, or the proportional font should be styled on a stable element (e.g. the ProseMirror root).

Local workaround (what we ship)

Patch the theme CSS generator so the rule targets the editor root as well:

.pm-proportional-font, .ProseMirror {
  font-family: ${x.proportionalFont} !important;
  font-size: ${x.proportionalFontSizePt}pt !important;
}

This keeps body text at the configured size even when the class is dropped. It works, but it is a stopgap; the decoration-loss bug itself should be fixed upstream.

Lingua principale
TypeScript
Stelle
652
Fork
64
Merge medio
8h 45m
PR unite (30g)
36

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 quarto-dev/quarto

Tutte le issue di quarto-dev/quarto

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.