3

Compare the way this list looks in the post versus the screenshot of the preview:

text:

1. { label: `Baz ${x ? n1 : n2}`, kind: "B", } satisfies B, 1. { label: `Baz ${x ? n1 : n2}` satisfies `Baz ${number}`, kind: "B", },

Here is a screenshot of the preview:

enter image description here

I'm not sure which version is rendering correctly (I hope it's the preview, because that's how I wanted it to look), but it seems like a bug that there is a difference between preview and the post.

Workaround

This can be fixed by putting a blank comment on the first line of the list. Compare what renders to a screenshot of the markdown:

text:

  1. {
  label: `Baz ${x ? n1 : n2}`,
  kind: "B",
} satisfies B,

  2. {
  label: `Baz ${x ? n1 : n2}` satisfies `Baz ${number}`,
  kind: "B",
},

enter image description here

Improve this question
7
  • 1
    So it looks like having text right before the list is throwing it off. Commented Mar 8, 2024 at 1:04
  • @SonictheAnonymousHedgehog Yep. Seems like it. Commented Mar 8, 2024 at 1:04
  • It's valid HTML comment text but any other HTML unsupported by markdown would do. Commented Mar 8, 2024 at 2:21
  • Answers do not belong in question posts, put them in answer posts. Commented Mar 8, 2024 at 2:22
  • 1
    Please use a code block to show the literal content of the relevant part of the post before formatting by preview/publishing. Commented Mar 8, 2024 at 2:24
  • The demo on the CommonMark site formats it as in the edit preview here. Commented Mar 9, 2024 at 17:16
  • Thus, the backend rendered version is, presumptively, not compliant with CommonMark, so this is a bug. However, it would be beneficial to go through the CommonMark specification to determine exactly what the specification says should happen here. Commented Mar 9, 2024 at 17:17

1 Answer 1

Reset to default
3

I seem to remember that putting the code fence on the same line as the list marker, but indenting the rest of the block to match the first character of the fence, works:

1. ```
   {
     label: `Baz ${x ? n1 : n2}`,
     kind: "B",
   } satisfies B,
   ```
1. ```
   {
     label: `Baz ${x ? n1 : n2}` satisfies `Baz ${number}`,
     kind: "B",
   },
   ```

Gives:

  1. {
  label: `Baz ${x ? n1 : n2}`,
  kind: "B",
} satisfies B,

  2. {
  label: `Baz ${x ? n1 : n2}` satisfies `Baz ${number}`,
  kind: "B",
},

A screenshot of what I see after posting this answer:

This matches the behaviour of fenced code blocks in lists in general, where you have to indent the whole thing by three spaces x nesting level, and have the code block aligned with the first character of the starting fence.

Improve this answer
1
  • three spaces x nesting level I only bring this up because I found it interesting: 3 spaces work until your list number reaches double digits, then you need to change everything (or maybe just those that follow, can't remember) to 4 spaces. I assume something similar happens if the list reaches triple digits. Commented Mar 8, 2024 at 4:04

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.