5

About the bug

This is a bug whose effects you can see in the revision history of this answer. Specifically, it’s about the edit that created Revision 15 (click “side-by-side markdown” to see that edit’s changes).

The rendered version of Revision 15 wraps the text following my code blocks within code blocks of their own, and also adds empty code blocks in some places. However, when I was writing that Markdown in the code editor before saving that edit, those extra code blocks were not visible in the preview.

This is a bug because the JavaScript-rendered preview HTML should always match the server-rendered HTML. In this case, the JavaScript-rendered HTML had the better rendering of my Markdown, so the server’s Markdown renderer should change.

The Markdown I wrote included fenced code blocks within list items. That is a rare combination of formatting, so it is probably what triggered the bug in the server rendering. I will note that it is legal Markdown (according to CommonMark), and <pre><code> within an <li> is legal HTML (according to MDN’s summary of the spec).

Bug reproduction

I was able to to reproduce that bug in the body of this question. In the JavaScript preview of the following Markdown, there are only two multi-line pre-wrapped code blocks. But in the rendered version, there are four:


  • console.log() (and its alias, console.info()):

    • If the 1st argument is NOT a format string: util.inspect() is automatically applied to every argument:
      • o = { one: 1, two: 'deux', foo: function(){} };
        console.log(o, [1,2,3])
        // ->  '{ one: 1, two: 'deux', foo: [Function] } [ 1, 2, 3 ]'
        
      * Note that you **cannot pass options** through `util.inspect()` in this case, which implies 2 notable limitations:
        * Structural **depth** of the output is **limited to *2* levels** (the default).
            * Since you cannot change this with `console.log()`, you must instead use `console.dir()`: **`console.dir(myObject, { depth: null }` prints with *unlimited* depth**; see below.
        * You can’t turn syntax coloring on.
      
    • If the 1st argument IS a format string (see below): uses util.format() to print the remaining arguments based on the format string (see below); e.g.:
      • o = { one: 1, two: 'deux', foo: function(){} };
        console.log('o as JSON: %j', o)
        // ->  'o as JSON: {"one":1,"two":"deux"}'
        
      * Note:
        * There is NO placeholder for representing _objects_ `util.inspect()`-style.
        * JSON generated with `%j` is NOT pretty-printed.
      
  • console.dir():

0

You must log in to answer this question.

Browse other questions tagged .