Building a micromark plugin for Lemmy's custom spoiler format

[aeharding]

Hi there! I am building an app for Lemmy.

Lemmy uses a custom spoiler format, in the form of:

::: spoiler Tap to reveal
# Boo!
:::

Which transforms to

Tap to reveal

Boo!

As for why I am building a micromark plugin, it's because I have no other choice. I can't change the markdown format, because I don't control the Lemmy project. I just build an app for it. So I can't force lemmy to adopt a format that works with micromark-directive, for example. Therefore, I'm trying to fork micromark-directive to work with this format. I've had some modest success, but I'm currently stuck where I run DEBUG="micromark" npm test and the parser gets stuck. I'm not sure how to debug this. It appears as if the parser calls the final ok() though.

I've simplified the app so there's a single test case, so just npm i and DEBUG="micromark" npm test should see the issue.

Here's the repo, if you have a moment: https://github.com/aeharding/micromark-extension-lemmy-spoiler

P.S. The app I'm trying to get this working for is FOSS! It's called Voyager. This is Voyager's second most requested open feature; I've just had a really hard time getting this working despite multiple attempts at forking remark-directive over the last few weeks (I learn a bit each time). Any help is VERY appreciated. ❤️

[wooorm]

Hey Alexander!

For reference, the output HTML:

<details><summary>Tap to reveal</summary>

# Boo!

</details>

---

Cool. This sounds like a good use case for a micromark extension :) But yes, it’s very tough to get into extension development.
Thanks for the rep(r)o.

[wooorm]

spoiler.js

L47: you can’t just consume, it has to be inside a labelled thing. Every character needs to be in something. On this line you’re in the container for colons. It shouldn’t contain spaces. Spaces should go in a different thing. Do you want to parse : : :: and such?

L73: same as above: you shouldn’t put the name inside the same colons token, make a new token. Also Q: is the string case insensitive? If so, normalize case. Also: This looks like it will allow :::spo and that’s fine. It probably shouldn’t?

General Q: are block quotes and lists supported in this or not?

L78: Here you are putting any possible character in the spoilerLabel label. That includes \n, spaces, the end of the file, anything. That’s not going to work. Q: Do you want text here? Text includes emphasis and links and whatnot. Or just character references and character escapes? If so, that’s a string, not text. Or is it just a couple characters with no character references and -escapes? If it doesn’t link across newlines or things, you don’t need to link. I’d guess that this is a separate string?

L85: If afterColons is called with \n, a spoilerLabel and text would be opened by afterColons, then it would fall through to getLabelData, which would immediately close those. Meaning empty events. Which can’t happen. All things need to contain something. Note that as this is a container (something that can contain block quotes and lists and more containers), you can’t allow \n. Markdown is parsed per line, so that’ll go wrong.

---

There’s a couple things going on which could be the reason here.
I recommend trying again, and making different commits, and reporting here again when you’re stuck

1. Remove leaf and text and the tests that suddenly break.
2. Rename directive to spoiler if you want
3. Only allow the word spoiler
4. Remove attributes.
5. Allow any text/string after spoiler instead of attributes.