Add custom pair colorization and highlighting for divs#973
Add custom pair colorization and highlighting for divs#973
Conversation
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
juliasilge
left a comment
juliasilge
left a comment
There was a problem hiding this comment.
This is looking great!
Can we add some basic tests for this, in case we find a change we need to make later? I would think something like a new divs.test.ts that is similar to codeBlocks.test.ts, opening a .qmd and confirming the parser finds a Div token. Pretty cheap to test through MarkdownEngine! If you are motivated to go a little further, you could extract the logic for the depth calculation and getDivMarkerRange regex from activateDivBracketDecorations into a pure function to unit test, but that might not be worth it.
| /* | ||
| * div-brackets.ts | ||
| * | ||
| * Copyright (C) 2025 by Posit Software, PBC |
There was a problem hiding this comment.
| * Copyright (C) 2025 by Posit Software, PBC | |
| * Copyright (C) 2026 by Posit Software, PBC |
|
|
||
| // Update decorations when document changes | ||
| context.subscriptions.push( | ||
| vscode.workspace.onDidChangeTextDocument(event => { |
There was a problem hiding this comment.
Should we debounce this the same way we do the highlighting decorations in background.ts?
| const parser = markdownitParser(); | ||
|
|
||
| // Cache for parsed tokens | ||
| const parseCache = new Map<string, { |
There was a problem hiding this comment.
Could we add another listener in here so that we delete this cache at onDidCloseTextDocument?
3 participants
Fixes #670 (except "Navigation"? What does that mean? Do we want divs in the outline?)
Adds colorization to pairs of opening and closing div syntax. It is a custom decorator. I don't believe we can use VSCode's builtin pair colorizer because it relies on opening and closing brackets being preset and distinct, whereas Quarto fenced divs can have any number of colons >2 in them and the closing and opening brackets are the same (other than the trailing class/attribute syntax
{}on the opening bracket).Also fixes the parsing of opening syntax for divs where the class/attribute syntax is empty i.e. exactly
::: {}. This was previously not parsed as opening a div (it was parsed as an inline), the regex expected at least one character inside{}. As a result, folding also works better now.