I was including some text in the last item of a bulleted list and discovered that the text following the code wasn’t rendered by Discourse.
Markdown:
* Item 1
* Item 2
```javascript
var msg = "Hello world!";
console.debug(msg);
```
This is hidden
Rendered:
Item 1
Item 2
var msg = "Hello world!";
console.debug(msg);
This is hidden
I was expecting that indenting the last line (“This is hidden”) with 4 spaces would allow me to continue the bulleted item with text following the code. While I could surely be doing this wrong, it seemed like a bug that the text was actually omitted (hidden) within my post.
If the code doesn’t happen to be the last item in the bulletted list, it behaves slightly differently. The text following the code isn’t hidden and the code is no longer syntax-hlighted as expected:
Markdown:
* Item 1
* Item 2
```javascript
var msg = "Hello world!";
console.debug(msg);
```
This is not hidden
* Item 3
Rendered:
Item 1
Item 2
var msg = "Hello world!";
console.debug(msg);
This is not hidden
Item 3
That makes me think I just don’t know how to properly embed code within a bulletted list.
Any thoughts? Am I doing this wrong, is there a bug, or is this not yet a feature of Discourse?
Seems like an edge case misuse of MarkDown, but maybe if instead of using the 3 backticks “code block” you used the 1 backtick “inline code” ? (even though it spans more than 1 line)
Thanks for the suggestion. Individual lines is a reasonable workaround, but you lose the syntax highlighting. I guess syntax-highlighting code within a list is asking too much, eh?
The workarounds I’ve come up within (including yours) are:
Individual lines of code
Markdown
* Item 1
* Item 2
`var msg = "Hello world!";`
`console.debug(msg);`
This is not hidden
Rendered:
Item 1
Item 2 var msg = "Hello world!"; console.debug(msg);
This is not hidden
Code by reference
####Markdown:
* Item 1
* Item 2
(Figure 1 below)
This is not hidden
No you are missing the correct way to do this in Markdown:
Item 1
I can type some words here
Item 2
var msg = "Hello world!";
console.debug(msg);
This is not hidden
Item 3
Remember fenced code blocks were never part of the classic Markdown spec, such as it was…
I don’t think what you want to do is possible without using a “loose” list, versus a “tight” (no spacing) list.
- Item 1
I can type some words here
- Item 2
var msg = "Hello world!";
console.debug(msg);
This is not hidden
- Item 3
This is a tight list
I am
so close
to each line
This is a loose list
I am
So far apart
From each line
I always have to remind @sam about the different loose and tight list behaviors since so much is implicit in Markdown. But TL;DR never mix loose and tight lists.
Cool! Thanks for the tip, @codinghorror. It even works with syntax highlighting.
* Item 1
← this blank line is important
* Item 2
← this blank line is important
```
var msg = "Hello world!";
console.log(msg);
```
This text is no longer hidden
↓
Item 1
Item 2
var msg = "Hello world!";
console.log(msg);
This text is no longer hidden
I knew lists could be spaced out (loose), but didn’t appreciate how it could effect formatting.