Skip to content

Step 1 of 5 · Reading · ~3 min

Read

Lists & Code

Code Blocks

Code is the one construct a Markdown parser must be able to keep its hands off. Everything inside a code span or a code fence is literal: no emphasis, no links, no entity interpretation. Getting that isolation right is what lets people paste Markdown examples into Markdown documents at all.

Fenced blocks: what exactly opens and closes one?

```python
print("hi")
```

Four rules do all the work, and each one has a failure mode:

RuleConsequence when you ignore it
Opener is three or more backticks or tildes, never mixed~~~ cannot be closed by ```
The closer must use the same character and be at least as longa 3-backtick line does not close a 4-backtick fence
An info string after a backtick fence may not contain a backtickotherwise inline code would open fences by accident
An unclosed fence runs to the end of the documentthere is no error and no backtracking

The info string is the language tag. It becomes class="language-python" on the <code> element, which is all a syntax highlighter needs.

<pre><code class="language-python">print(&quot;hi&quot;)
</code></pre>

Note the two details in that output: the content is HTML-escaped even though it is code, and it ends with a newline before </code>. Both are what the tests compare against.

Inline code: how many backticks?

A code span opens with a run of N backticks and closes with a run of exactly N. That is how you put a backtick inside code — surround it with two.

There is one more normalisation: if the content begins and ends with a space, and is not entirely spaces, one space is removed from each end. That rule exists so you can write code that itself starts with a backtick.

python

Row three is the whole lesson. The naive pattern closes on the first backtick it finds, even though that backtick is part of a longer run — so a code span whose content is two backticks collapses to a code span containing a space. The lookarounds (?<!)and(?!) enforce "this run, and no more", which is precisely the spec's definition of a backtick string.

Indented code blocks

Four spaces of indentation also makes code, with two differences worth knowing: there is no language tag, and an indented block cannot interrupt a paragraph — indented lines under prose are just continuation lines of that paragraph. Fenced blocks have neither restriction, which is why they won.

Your exercise

Convert fenced blocks and inline code spans; leave everything else alone.

The mistake the grader catches is including the closing fence line in the content. The expected output for the plain-fence test is exactly <pre><code>plain code then a newline then </code></pre> — three lines. If your loop appends every line until it sees the closer and then also appends the closer, you emit a stray ``` inside the block and every fenced test fails at once.

The second trap is the trailing newline: the content ends with a newline before </code> even when the block holds a single line. Join the collected body lines with a newline, then append one more.

Up nextBlockquotes & HRLists & Code

Discussion

Ask a question, share an insight, or help someone who’s stuck.

Sign in to post a comment or reply.

Loading…