Wrong VS Code slugify: Should parse heading by the same markdown-it engine as VS Code's

iAnyKey commented 3 years ago

Problem

## [![OPC UA .NET](https://img.shields.io/badge/OPC_UA_.NET-v1.0.4-512BD4?style=flat-square&logo=csharp&color=239120)][UA.NETStandard repo] OPC UA .NET StandardLibrary produces following caption:

[][UA.NETStandard repo] OPC UA .NET StandardLibrary

with TOC entry like: - [!OPC UA .NET OPC UA .NET StandardLibrary](#uanetstandard-repo-opc-ua-net-standardlibrary)

!OPC UA .NET OPC UA .NET StandardLibrary

which is not working properly like a hyperlink.

In a sililar way this feature does not work properly with codespan in captions: CODE: ## [![`crc32(data)`](https://img.shields.io/badge/crc32-v1.0.0.0-blue?style=flat-square&logo=mathworks)][CRC32] CRC-32 Computation Algorithm: HEADER:

[][CRC32] CRC-32 Computation Algorithm

CODE TOC (generated): - [!`crc32(data)` CRC-32 Computation Algorithm](#crc32-crc-32-computation-algorithm) TOC Entry:

!crc32(data) CRC-32 Computation Algorithm

How to reproduce

copy code sessions into VS code, generate TOC and turn on preview

Error message in the console

none

yzhang-gh commented 3 years ago

Thanks for your feedback.

https://github.com/yzhang-gh/vscode-markdown/blob/f560819acc2175691dd5d5d809e3329c50d18039/src/util/slugify.ts#L24-L42

Looks like we should make use of the env here.

Lemmingh commented 3 years ago

Which version are you using?
What is your configuration?

This should not happen after #890, and I cannot reproduce it on the latest dev build (f560819acc2175691dd5d5d809e3329c50d18039).

My result:

[UA.NETStandard repo]: u

[CRC32]: r

## [![OPC UA .NET](https://img.shields.io/badge/OPC_UA_.NET-v1.0.4-512BD4?style=flat-square&logo=csharp&color=239120)][UA.NETStandard repo] OPC UA .NET StandardLibrary

## [![`crc32(data)`](https://img.shields.io/badge/crc32-v1.0.0.0-blue?style=flat-square&logo=mathworks)][CRC32] CRC-32 Computation Algorithm

- [ OPC UA .NET StandardLibrary](#-opc-ua-net-standardlibrary)
- [ CRC-32 Computation Algorithm](#-crc-32-computation-algorithm)

Configuration:

{
    "markdown.extension.toc.slugifyMode": "github",
    "markdown.extension.toc.unorderedList.marker": "-"
}

yzhang-gh commented 3 years ago

Oops, thought I had installed the latest one.

@iAnyKey Could you try out the dev build and see whether it works?

iAnyKey commented 3 years ago

just tested it on v3.4.0 #943.

Settings(also attached as .json.txt:

"name": "markdown-all-in-one",
"displayName": "%ext.displayName%",
"description": "%ext.description%",
"icon": "images/Markdown-mark.png",
"version": "3.4.0",
"publisher": "yzhang",
"engines": {
"vscode": "^1.49.0"
...
"markdown.extension.toc.slugifyMode": {
    "type": "string",
    "default": "github",
    "markdownDescription": "%config.toc.slugifyMode.description%",
    "enum": [
        "github",
        "azureDevops",
        "bitbucketCloud",
        "gitea",
        "gitlab",
        "vscode"
    ],
    "enumDescriptions": [
        "GitHub",
        "Azure DevOps",
        "Bitbucket Cloud",
        "Gitea",
        "GitLab",
        "Visual Studio Code"
    ]
},
"markdown.extension.toc.unorderedList.marker": {
    "type": "string",
    "default": "-",
    "markdownDescription": "%config.toc.unorderedList.marker.description%",
    "enum": [
        "-",
        "*",
        "+"
    ]
},
"markdown.extension.toc.updateOnSave": {
    "type": "boolean",
    "default": true,
    "description": "%config.toc.updateOnSave.description%"
}

package.json.txt

Result

Still the same: I can "jump" to the headers You can jump here by clicking on them in preview or in pdf, but this doesnt work on the other 2 section headers

test.pdf test.md

yzhang-gh commented 3 years ago

The VS Code is using a different slugify (assign a heading an id/anchor) function which is not fully compatible with GitHub. VS Code: opc-ua-net-opc-ua-net-standardlibrary GitHub: -opc-ua-net-standardlibrary

The PDF is created by another extension. So it is quite likely that they are not compatible.

If we set the slugifyMode to github, then the links only work (guaranteed) on GitHub, the exported HTML (by this extension), and the PDF created from that HTML.

Now the problem is even if we set slugifyMode to vscode, it still doesn't work in the VS Code built-in preview...

Lemmingh commented 3 years ago

the problem is even if we set slugifyMode to vscode, it still doesn't work in the VS Code built-in preview

https://github.com/microsoft/vscode/blob/1664732e44dbdc05bfc14e594e8ab9d0d0226188/extensions/markdown-language-features/src/markdownEngine.ts#L283-L306

This part is hard to simulate. I suggest thorough redesign.

yzhang-gh / vscode-markdown