Can I enhance an existing language's parser configuration

Goal

I’d like to be able to fold everything in the <details> and </details> but I’d not sure where to start.

Essentially I want add a foldable range.

<details>
  <summary>see more</summary>

# My heading

blah blah

</details>

I can see lots of promising fold APIs but I’m struggling to understand how they would “plug in” to achieve this.

Things I’ve tried

Enhancing Parser

I found some example code to config folding in a parser:

What follows was my attempt to modify the markdown language parser behaviour BUT I’m not sure

  1. if I can even modify parsers using this config
  2. if HTMLBlock is already folding, but the node ends when the markdown starts i.e. # My heading
new EditorView({
  extensions: [
    markdown({
      extensions: [{
          props: [
            foldNodeProp.add({
              HTMLBlock: foldInside,
              HTMLTag: foldInside
            })]}]}),
    ...extensions
  ]
})

Using foldGutter

So my second attempt used foldGutter() configuration - but this seems to modify how fold gutters render.

Research

Then I found more example code, that calls foldAll. But I’m not sure where this “plugs into” the editor. Nor am I sure how I can calculate my own foldable range.

I found this foldEffect code, but this seems to be AFTER the initial fold range is calc’d

1 Like

The way Markdown parses HTML (stopping an HTML block as soon as it encounters an empty line) means that there is no syntax node covering the entire <details> tag in the parse tree, so that the syntax based folding doesn’t work for it.

You could try adding a fold service that recognizes that there’s an open tag on the given line, and finds the corresponding close tag by scanning the text, I guess.

1 Like