microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
164.79k stars 29.49k forks source link

Allow disabling indented code blocks in the Markdown previewer. #234485

Closed RokeJulianLockhart closed 2 days ago

RokeJulianLockhart commented 4 days ago

Desire

As I've poorly aforedescribed at reddit.com/r/vscode (to 5 upvotes), I want a way to disable the conversion of a single tab or 2 spaces to a <pre><code>. Instead, I want it these to merely be ignored (as they are in other markup languages, like HTML).

Rationale

I author most of my markup in HTML, because it provides significantly more versatile and semantic markup capabilities. However, it has an (ultimately non-inherent, but in-practice) significant failure — <code> tags are not automatically syntax-highlighted by any parsers.

Markdown, being a superset of HTML, improves this perfectly. As an example, when I render the undermentioned in VS Code with the PowerShell extension installed, I see beautiful colours:

<tr>
<th>
Construction
</th>
<td>

```PS1
${'Status'} = [PSCustomObject]@{
    'Non-Chronological' = 'Indeterminate';
    'Chronological' = [PSCustomObject]@{
        1 = @(
            'Uncommenced',
            'Commenced'
        );
        2 = @(
            'Completed',
            'Cancelled'
        )
    }
}

${'Person'} = [PSCustomObject]@{
    3 = '';
    1 = '';
    2 = ''
}
```

</td>
</tr>

However, that's really difficult to read. It gets exponentially more difficult if, for example, you have nested tables with code blocks in each. At that stage, I basically have to re-indent and then de-indent each time I modify the markup. It's a dreadful workflow.

Instead, it should be the undermentioned:

<tr>
    <th>
        Construction
    </th>
    <td>
        ```PS1
        ${'Status'} = [PSCustomObject]@{
            'Non-Chronological' = 'Indeterminate';
            'Chronological' = [PSCustomObject]@{
                1 = @(
                    'Uncommenced',
                    'Commenced'
                );
                2 = @(
                    'Completed',
                    'Cancelled'
                )
            }
        }

        ${'Person'} = [PSCustomObject]@{
            3 = '';
            1 = '';
            2 = ''
        }
        ```
    </td>
</tr>

However, all beneath the first <td> shall render in a <pre><code>.

This is, of course, a basic example, where the aforedescribed potential complexity is less evident. However, I can provide incredibly complex examples if necessary.

Summarily, having this implemented would completely change how I write my Markdown documents. I would finally be able to write the HTML within them in a readable manner, and have syntax-highlighted code blocks, without needing to deal with the indentation havoc that is <pre>.

Feasibility

Per https://github.com/11ty/eleventy/issues/2438#issuecomment-2464912554, this should be possible in VS Code, since markdown-it appears to be the parser that VS Code uses, and it supports the ability to disable indented code blocks.

Corroberations

  1. "A switch that disables code blocks by indenting" at forum.obsidian.md/t/21764

    For years I’ve been using apps that “use Markdown” like Bear and Ulysses. So I would often tab underneath a header for typing because I visually like to indent different topics. Well, turns out that those apps were really using “Markdown flavors”. It was like Markdown lite. So now that I’m using Obsidian that uses the full Markdown specs, when I try and indent underneath a header, I get a code block! That technically is correct, but I hate it! I can’t write the way I normally like to write. I would love a simple switch that says something along the lines of “disable code blocks by indenting” or something to that effect. I would still be able to do a code block using the three ticks.
  2. "Inline HTML breaks when using indentation" at talk.commonmark.org/t/3317 ^1

    The only input I found that works [...] requires: 1. Inner markdown body not indented at all 2. Blank line between first para and HTML 3. No blank line between second para and HTML If there *is* a blank line between second para and the HTML, then the HTML gets parsed as an indented code block and breaks the HTML.
  3. https://github.com/jgm/pandoc/issues/2120#issue-71270331

  4. https://github.com/11ty/eleventy/issues/2438#issue-1271419451

  5. "Disable “indent -> code block”" at forum.obsidian.md/t/19173

    #### **Situation** I often indent lists and put an empty line in between for visual distrinction. #### **Problem** Obsidian recognizes that as code and colors the line red. #### **What I’m trying to do** Turn off code blocks alltogether, or turn off the indent → code block function.
  6. "Break Markdown: Option to change default tab / indent behavior / Do not create code block" at forum.obsidian.md/t/8741/5

    If there’s an empty line in between, the indent will default to code. If anybody found a solution, please let me know.

  7. "This is how to use Markdown inside HTML blocks" at forum.obsidian.md/t/74435/14

    It’s sad we can’t combine HTML with Markdown, I really wanted to use the metabind plugin in an html table, but since HTML goes separately, that really limits the amount of customization we can have.

  8. "Change the code block button from inserting indentation to triple-backticks" at meta.stackoverflow.com/revisions/414866/1:

    Indentation is also used with lists (bullet and numbered), making it more confusing how to properly indent a block inside them. Fenced blocks provide a separate syntax, simplifying the markup for indenting a block inside a list.

Reposts

  1. [x] https://github.com/searKing/preview-vscode/issues/96#issue-2686597767
  2. [ ] https://github.com/shd101wyy/vscode-markdown-preview-enhanced/issues/new

Interested

  1. [x] @JaredRichardWilliam
  2. [ ] @YerEverLuvinUncleBert
JaredRichardWilliam commented 4 days ago

I have this problem when converting txt readmes into markdown, because indent the body text under headings. it's really, really annoying, because I have to use lists for nested headings. if there's an extension that does this I'll gladly use that, but I haven't found one

@RokeJulianLockhart

RokeJulianLockhart commented 4 days ago

https://github.com/microsoft/vscode/issues/234485#issuecomment-2495650513

@JaredRichardWilliam, glad you agree! I'd actually forgotten about that - indented content under headings in .txt files was the reason I originally staved off using Markdown for so long. I've also used the same solution, but by following how YAML uses list-like syntax for nested keys. It works in some parsers, but can look strange in GLFM and Discourse.

mjbvz commented 2 days ago

This sounds like a good fit for a markdown extension. These can add support for new syntax or modify existing syntax

Our built-in markdown support targets standard markdown which will parse your examples differently than you want

RokeJulianLockhart commented 2 days ago

Our built-in markdown support targets standard markdown which will parse your examples differently than you want

@mjbvz, CommonMark?

mjbvz commented 2 days ago

Yes we try to match common mark. Common mark will not parse your example well at all because everything until the blank line is considered inline html

RokeJulianLockhart commented 2 days ago

https://github.com/microsoft/vscode/issues/234485#event-15423275988

@mjbvz, I presume you meant to close as unplanned?