Microsoft/monaco-editor

Syntax Highlighting isn't working for the first item inside a Media Query

Open

#2.527 geöffnet am 14. Juni 2021

Auf GitHub ansehen
 (2 Kommentare) (0 Reaktionen) (0 zugewiesene Personen)JavaScript (1.283 Forks)batch import
buggrammarshelp wanted

Repository-Metriken

Stars
 (14.836 Stars)
PR-Merge-Metriken
 (Durchschn. Merge 6h 26m) (15 gemergte PRs in 30 T)

Beschreibung

monaco-editor version: 0.25.0 Browser: Chrome 91.0.4472.77 (but appearing in all browsers tested in) OS: MacOS 11.4 Playground code that reproduces the issue:

@media (max-width: 300px) {
    p.test {

    }

    p.test {
        
    }
}

You'll see that the first p.test selector does not have syntax highlighting, where the second does.

Note that this isn't reproducible in VS Code directly, nor in VS Code web. It is however visible on the Monaco Editor homepage if you change the language to CSS and scroll down to line 629.

Contributor Guide

Research-Richtung
Untersuche den CSS Tokenizer/die CSS Grammatik im Quellcode von monaco editor, wahrscheinlich in src/basic languages/css/css.ts. Der spezifische Fehler ist, dass der erste Selektor innerhalb eines @media Blocks keine Syntaxhervorhebung erhält. Untersuche, wie der Tokenizer den Kontextwechsel nach @media und den Beginn eines Regelblocks handhabt. Suche nach Unterschieden in der Analyse der ersten Regel im Vergleich zu nachfolgenden Regeln. Erwäge, mit einem Debugger zu testen oder Logging hinzuzufügen, um die Tokenisierung des bereitgestellten CSS Snippets nachzuverfolgen.
Tech Stack
typescriptcss
Domain
frontend
Issue Type
Fehler
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
2
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
Halber Tag
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Aktiv
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Klar
Voraussetzungen
CSSTypeScript
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
50