Hi all,
I’m having an issue with mixed language parsing. For context, I have a general templating grammar that looks like this -
@top TemplateString { (Expression | StringContent)* }
@local tokens {
ExpressionStart[closedBy=ExpressionEnd]{ "{{" }
@else StringContent
}
@precedence {
Expression
StringContent
}
@skip {} {
Expression {
ExpressionStart (JavaScriptText* | "") ExpressionEnd
}
}
@local tokens {
ExpressionEnd[openedBy=ExpressionStart] { "}}" }
@else JavaScriptText
}
Using this grammar, I wanted to make a parser that parses external markdown and javascript within the expressions.
So I modified my parser as so -
const mixedMarkdownParser = templateStringParser.configure({
wrap: parseMixed((node) => {
if (node.type.isTop) {
return {
parser: markdownLanguage.language.parser,
overlay: (node) => {
return node.name === 'StringContent'
},
}
} else if (node.name === 'JavaScriptText') {
return { parser: javascriptLanguage.parser }
} else {
return null
}
}),
})
Where the markdown and javascript parsers are the default codemirror parsers.
However, when I plug this language support into the editor along with some syntax highlighting
syntaxHighlighting(HighlightStyle.define(markdownHighlightStyles(), { scope: markdownLanguage })),
In the end result, the markdown syntax highlighting is applied to all of the code, ignoring the scoping.
A workaround I’ve found is adding syntax highlighting for the javascript that sets all to initial, but here, the braces still adopt the markdown styles, even though I don’t believe they should have any styling?
syntaxHighlighting(HighlightStyle.define([], { scope: javascriptLanguage, all: 'initial' }))
How would I get it to the ideal case where both the braces and brackets have no styling?