Microsoft/monaco-editor

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

Open

#2 527 ouverte le 14 juin 2021

Voir sur GitHub
 (2 commentaires) (0 réactions) (0 assignés)JavaScript (1 283 forks)batch import
buggrammarshelp wanted

Métriques du dépôt

Stars
 (14 836 stars)
Métriques de merge PR
 (Merge moyen 6h 26m) (15 PRs mergées en 30 j)

Description

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.

Guide contributeur

Direction de recherche
Examinez le tokenizer/grammaire CSS dans le code source de monaco editor, probablement dans src/basic languages/css/css.ts. Le bug spécifique est que le premier sélecteur à l'intérieur d'un bloc @media manque de coloration syntaxique. Étudiez comment le tokenizer gère le changement de contexte après @media et le début d'un bloc de règles. Recherchez des différences dans la façon dont la première règle par rapport aux règles suivantes est analysée. Envisagez de tester avec un débogueur ou d'ajouter des journaux pour tracer la tokenisation de l'extrait CSS fourni.
Stack technique
typescriptcss
Domaine
frontend
Type d'issue
Bug
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
2
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
Une demi journée
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
CSSTypeScript
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
50