Tags and classes are lost

[danielepolencic]

Tags and classes are lost

[ChristianMurphy]

Markdown supports a subset of HTML features.
Classes and tags are part of the information which don't map 1:1 to CommonMark.
mdast-to-hast adds data.hName and data.hProperties as more of a workarounds to allow transform plugins to generate HTML types that don't have a Markdown equivalent.

What is the intended use case for keeping hName and hProperties metadata on the Markdown side?

[ChristianMurphy]

Also see #38

[danielepolencic]

I'd like to highlight a code block using prism.js.
The result is an HTML string. I have two choice (afaik):

• parse the string as HTML->hast and include it to the original mdast with hast->mdast. Use remark2rehype to generate the HTML for the full document
• include the HTML as raw html in the mdast directly. Use remark2rehype + rehype-raw to render the raw html
  I'm using the latter at the moment because the hast->to->mdast doesn't keep classes or tags for <span> elements.

The other option I thought of would be to customise the remark2rehype transform. But from what I've seen, no one does that.

[ChristianMurphy]

@danielepolencic would https://github.com/mapbox/rehype-prism work for your use case?
Generating the syntax highlights during the HTML render phase?

[danielepolencic]

I had a look at that package, unfortunately, it doesn't work for me. I need to customise the rendering for Prism (with server-side highlights, etc.).
I found a way to customise the rendering with hast, I think that solves my issue at the moment.
Instead of working on the mdast tree, I do all the manipulations on the hast.

[wooorm]

@danielepolencic retype-prism does support server-side highlighting? 🤔

Anyway, yes, doing things in hast instead of mdast is often the solution ;)

[danielepolencic]

As far as I know, the line highlight plugin for Prism is only working in the browser.

https://github.com/PrismJS/prism/blob/master/plugins/line-highlight/prism-line-highlight.js#L3

[wooorm]

ahhh, yeah you’re right! Prism plugins interact with the DOM unfortunately... I built refractor to change Prism’s core to use a VDOM, but the plugins are too heavily dependent on the DOM...

It would be interesting to have a rehype version of the plugin though!