Skip to content

Fix markdown highlighting of multi-line HTML tags #5422

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Gxrvish wants to merge 1 commit into
base: main
Choose a base branch
from
+57 −0
Open

Fix markdown highlighting of multi-line HTML tags #5422

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 48 additions & 0 deletions src/languages/definitions/markdown/markdown.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,5 +91,53 @@ testTokenization('markdown', [
line: '<custom-component',
tokens: [{ startIndex: 0, type: 'tag.md' }]
}
],

// indented HTML tag spanning multiple lines inside an HTML block
[
{
line: '<div>',
tokens: [{ startIndex: 0, type: 'tag.md' }]
},
{
line: ' <img src="a"',
tokens: [
{ startIndex: 0, type: '' },
{ startIndex: 4, type: 'tag.md' },
{ startIndex: 8, type: 'white.md' },
{ startIndex: 9, type: 'attribute.name.html.md' },
{ startIndex: 12, type: 'delimiter.html.md' },
{ startIndex: 13, type: 'string.html.md' }
]
},
{
line: ' class="b" />',
tokens: [
{ startIndex: 0, type: 'white.md' },
{ startIndex: 9, type: 'attribute.name.html.md' },
{ startIndex: 14, type: 'delimiter.html.md' },
{ startIndex: 15, type: 'string.html.md' },
{ startIndex: 18, type: 'white.md' },
{ startIndex: 19, type: 'tag.md' }
]
},
// a blank line ends the HTML block, so block constructs apply again
{
line: '',
tokens: []
},
{
line: '# header',
tokens: [{ startIndex: 0, type: 'keyword.md' }]
},
{
line: '',
tokens: []
},
// an indented code block outside of an HTML block is still a code block
{
line: ' <div>code</div>',
tokens: [{ startIndex: 0, type: 'string.md' }]
}
]
]);
9 changes: 9 additions & 0 deletions src/languages/definitions/markdown/markdown.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,12 @@ export const language = <languages.IMonarchLanguage>{
// list (starting with * or number)
[/^\s*([\*\-+:]|\d+\.)\s/, 'keyword'],

// html block: a line starting (with at most 3 spaces of indent) with an html tag
// starts a raw html block which lasts until the next blank line. Inside such a
// block, markdown block constructs (notably indented code blocks) do not apply,
// so that tags spanning multiple lines keep being tokenized as html.
[/^[ ]{0,3}(?=<\/?[a-zA-Z][\w-]*(?:\s|\/?>|$))/, { token: '@rematch', next: '@htmlBlock' }],

// code block (4 spaces indent)
[/^(\t|[ ]{4})[^ ].*$/, 'string'],

Expand All @@ -101,6 +107,9 @@ export const language = <languages.IMonarchLanguage>{
{ include: '@linecontent' }
],

// raw html block: everything is tokenized as inline markup / html until a blank line
htmlBlock: [[/^\s*$/, { token: '', next: '@pop' }], { include: '@linecontent' }],

table_header: [
{ include: '@table_common' },
[/[^\|]+/, 'keyword.table.header'] // table header
Expand Down