Skip to content

Identify frontmatter code blocks when rendering Markdown

Enrique Alcántara requested to merge 338273-add-frontmatter-metadata-to-code-blocks into master

What does this MR do and why?

It identifies frontmatter code blocks by appending language metadata when converting a frontmatter definition into a codeblock. It also restores sourcepos metadata in highlighted code blocks.

When rendering the following Markdown snippet:

---
title: Page title
---

The pre tag should have the data-sourcepos and data-lang-params attributes.

Before

<pre class="code highlight js-syntax-highlight language-yaml white" lang="yaml" v-pre="true">
  <code>
  </code>
</pre>

After

<pre data-sourcepos="1:1-3:3" class="code highlight js-syntax-highlight language-yaml white" lang="yaml"
  data-lang-params="frontmatter"
  v-pre="true">
  <code>
  </code>
</pre>

Screenshots or screen recordings

How to set up and validate locally

  • Send an API request to the Markdown API endpoint where the request payload contains a code block and gfm is enabled.
  • The highlighted code block indicates via the data-lang-params when the original source is a frontmatter definition. See the examples in the previous section.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #338273 (closed)

Edited by Enrique Alcántara

Merge request reports