Markdown Test Bench

This document exercises every supported markdown feature. Use it to evaluate which features serve your editorial workflow and which do not. The paragraph you are reading is the lede; the next one carries the drop cap.

Generative engines reward content that is structured, citable, and unambiguous. Each feature below maps to a concrete signal — semantic alerts, accessible math, layout-stable images, and a navigable heading tree all feed the same goal: making the page easy for both humans and answer engines to parse.

GitHub Alerts

Mermaid diagrams

Mermaid is supported as an opt-in feature: at build time it renders to a static inline <svg> (nothing runs in the browser). It is intentionally not exercised in this test bench because its SSR launches a headless browser during next build, and the production Docker image (alpine) ships no Chromium — including a diagram here would fail the build. To use Mermaid in a real post, add a mermaid code fence and make sure the build image has Playwright + Chromium available (see MARKDOWN_FEATURES.md).

Math expressions

Inline math like $E = mc^2$ flows within prose naturally. Block expressions stand alone:

Where $w_i$ are signal weights, $s_i$ are signal scores, and $\mathcal{A}_{\text{access}}$ is the accessibility gate multiplier. Constraint: $\sum w_i = 1$.

Code blocks with diff notation

// Notation diff inline
const post = await fetchPost(slug)
const validated = articleSchema.parse(post)  
const old = legacyParse(post)                
return validated

Pure diff language:

- const old = legacyParse(post)
+ const validated = articleSchema.parse(post)
  return validated

Code blocks with titles, line numbers, and highlighting

import { z } from 'zod';
import { citationSchema } from './citation';
 
export const articleSchema = z.object({
  title: z.string(),
  slug: z.string(),
  citations: z.array(citationSchema),
});

function render(input: string): string {
  return processMarkdown(input)  
}

Code blocks with focus

const a = 1
const b = 2
const c = 3
const d = 4
const e = 5

Code blocks with error level

console.log('debug info')        
throw new Error('critical')      
return success

External links with automatic rel

A link to Cloudflare Radar ↗ gets rel and target automatically, plus an external indicator. Internal links like Insights do not.

Images with automatic sizing

The image below gets width/height inferred at build (preventing layout shift) plus loading="lazy" and decoding="async":

GFM features

Tables

Task lists

• Implement alerts
• Implement mermaid
• Decide which features to keep

Strikethrough

This feature was planned for v0.1 shipped in v0.2.

Footnotes (GFM style)

This is a claim with a footnote¹.

Autolinking

URLs like https://geo.primesentia.ai ↗ become links automatically.

Citations (Pandoc-style)

This claim cites a paper¹ and a dataset². Both render as superscript footnotes that link to the endnotes at the bottom of this article.

Asides (custom directive)

Smart typography (smartypants)

“Quoted text” gets curly quotes — and em-dashes from double-hyphens, plus ellipsis… handled smartly.

Headings hierarchy

The TOC should appear at the top of this article (3+ headings exist), generated automatically from h2/h3.

Level 3 heading

Content under level 3.

Another level 3

More content.

Final notes

If half the features feel unused after editorial use, comment them out in pipeline.ts. The architecture is built for empirical iteration.