A living test document exercising every article-editor feature.
A living test document that exercises every feature of the article editor — formatting, math, callouts, toggles, embeds, and the editing gestures.
This article is a living checklist of everything the editor can do. Open it in the editor (Live preview) and compare against Preview mode and the published page — all three should agree. Edit freely; every block below is a working example you can copy.
How to read this document
Each section names a feature, shows the raw syntax, and renders it live. Where a feature is an editing gesture (not content), the instructions are in a callout like this one.
This paragraph mixes bold text, italic text, bold italic, inline code, and a plain external link. Formatting markers hide in Live preview and reveal when your cursor enters them.
Internal wikilinks render as chips: see Newton's Laws and General Relativity. Bare form also works: article-newtons-laws.
Turn-into shortcuts
Put the cursor on any line and press Ctrl/⌘ + Alt + a number to convert it:
0 paragraph · 1/2/3 headings · 7 bullet · 8 numbered · 9 to-do · q quote. Works across a multi-line selection too.
Check?
Bullet list:
Numbered list:
To-do list:
A plain blockquote. It stays a quote (not a callout) because it has no
[!type]marker on the first line.
Callouts use GitHub/Obsidian alert syntax > [!type] Optional title. Each type has its own color and icon:
Note
General information.
Tip
A helpful suggestion.
Success
Something worked.
Warning
Proceed with caution.
Danger
Critical — read carefully.
Foldable callouts collapse; click to expand.
This body is hidden until you click the title (the - after the type makes it start collapsed; use + to start open).
Inline math flows in text: the identity sits mid-sentence. While your cursor is inside a formula, a rendered preview floats above the source.
Block math stands alone and centered:
// Fenced code stays as syntax-highlighted source (not a live widget).
function greet(name) {
return `Hello, ${name}!`;
}
Tables render as real HTML tables when your cursor is outside them:
| Particle | Mass (kg) | Charge |
|---|---|---|
| Electron | 9.109e-31 | −1 |
| Proton | 1.673e-27 | +1 |
| Neutron | 1.675e-27 | 0 |
Three or more dashes on their own line become an editorial divider:
A native <details> block folds its content behind a summary:
Hidden content appears here. You can put formatted markdown inside, including lists:
Images render inline below their line:
Image syntax
 — use the Insert image toolbar button to upload and pick images; always give meaningful alt text (the editor warns about missing alt).
Interactive KAO animations embed as click-to-load cards (the sandboxed iframe mounts only when you press Load, so heavy animations never slow typing):
Slash command menu
Type / at the start of an empty line to open a searchable block menu (headings, lists, to-do, quote, callout, toggle, code, divider, table, math, wikilink). Keep typing to filter (e.g. /todo, /call, /math), then press Enter. A / in the middle of a sentence is ignored.
Modes
Toggle Live preview / Source / Preview with Ctrl/⌘ + E (or the header buttons). Live renders in place; Source shows raw markdown; Preview renders the full server pipeline read-only. Check MDX validates the document through the real compile pipeline.
That's everything
If every section above renders correctly in Live preview, Preview, and on the published page, the editor is fully working. Edit this file as a regression sandbox whenever you touch the editor.
No comments yet — yours could open the discussion.