Is it possible to modify the vfile from a handler in remark-rehype

[ben519]

I developed a rehype plugin that allows users to gate content with container directives...

## My secret cookie recipe

:::gate
- 2 eggs
- 1 stick butter
...
:::

My plugin looks more or less like this

export default function gateContent() {
  return (tree, file) => {
    // Initialize the has_gated_content flag to false
    file.data["has_gated_content"] = false

    visit(tree, nodeTest, (node, index, parent) => {
      // Modify the AST 
      ...

      // Update the has_gated_content flag
      file.data["has_gated_content"] = true

      return [SKIP, index]
    })
  }
}

Within the plugin, I am setting a has_gated_content flag in the file metadata to let me know if the markdown includes at least one :::gate tag.

Some things have lead me to think it may be better to implement this logic as a Handler inside remark-rehype, as opposed to a standalone plugin.

My issue / question is, how can I modify the file metadata from within a handler?

So far, my handler looks like this

import { h } from "hastscript"
import { icons } from "../icons.js"

export function containerDirective(state, node) {
  if (node.name === "gate") {
    console.log("state", state)
    console.log("node", node)
  }
}

and it's part of a processor like this

  let processor = unified()
    .use(remarkParse)
    .use(remarkDirective)
    .use(remarkRehype, {
      handlers: { containerDirective, leafDirective, textDirective },
    })
    .use(rehypeStringify)

(Note that I have tried to exclude numerous other details which I think are irrelevant.)

[wooorm]

Heya!

First I’d recommend going with hasGatedContent, most stuff in JS is camelcased :)

And, I do think that handlers are a good place to solve this, indeed!

Then, indeed, handlers and their state do not have access to files. That is because currently transforming an AST from markdown to HTML is not affected by files. To illustrate, a file name or so does not change how ASTs are transformed. I can particularly see a use case for this handler transform being able to emit messages on files though. For example for your handler to emit a warning when an unknown handler is used.

How to go about all this depends more on why you want this flag. Can you explain that?

[ben519]

Thanks for the quick reply!

The hasGatedContent flag informs a downstream process about whether or not the markdown includes gated content. This makes its way into a database which helps with searching and displaying a navigation. (My site is still being built, but you can get an idea of it here.)

Note that speed is very important to me. As such, I try to traverse the AST as little as possible.

Let me know if you need more context.

[wooorm]

Added support for passing them in options. Automatically done in remark-rehype: https://github.com/remarkjs/remark-rehype/releases/tag/11.1.0. So you can access them in handlers with state.options.file!

[ben519]

This is great, thanks @wooorm! (Looks like you took a much deserved break over the last few weeks.) By the way, did you get my email on Dec. 29?