Line Highlighting partially broken

[sharpchen]

Line Highlighting partially broken even in a same file.
Example link
I can't reproduce in a minimal project.

The only section got highlighted:

while others didn't:

I am not sure how to debug this, all I do is grouping a bunch of files from file system into a multi-sidebar, so they should be compiled into html?

[brc-dd]

Ah it's related to #4087

Your theme is splitting // and [!code highlight] into different tokens. You'll either need to adjust theme to generate same token for comments or use some other theme.

[sharpchen]

If that's the case, I don't think the theme is related, should be issue for certain tmLanguage implementation. And this is not always broken, as I paste the file content into a stackbliz vitepress project, everything looks fine.

[brc-dd]

tmLanguage is same in both, theme is different. On stackblitz, the default is github-light/dark. In your project you're loading eva-light/dark.

[sharpchen]

Hmm, I thought tokens are generated by tmLanguage, themes only assigns colors for tokens.
These are scopes inspect inside vscode with github dark, it's the same as eva theme I use. I think shiki uses the same source as builtin theme?

[brc-dd]

Yeah sorry I should've reworded my answer.

Your theme has different color or style for "comment" and "punctuation.definition.comment". This creates two different <span>s. Now the way those transformers are written, they only match the regex within same element. This function in shiki core needs to support separate elements - https://github.com/shikijs/shiki/blob/main/packages/transformers/src/utils.ts

with eva dark:

https://github.com/fisheva/Eva-Theme/blob/a90d1a6674271e03c585a0b37c787071e3f01f73/themes/Eva-Dark.json#L930 -- removing punctuation.definition.comment from this line will also work.

[sharpchen]

I see, // is normal while [!code highglight] is italic in eva theme, so setting comment style to none fixes the problem. Thanks for the instant answer!