1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
|
import assert from 'node:assert/strict';
import { describe, it } from 'node:test';
import { createMarkdownProcessor, createShikiHighlighter } from '../dist/index.js';
describe('shiki syntax highlighting', () => {
it('does not add is:raw to the output', async () => {
const processor = await createMarkdownProcessor();
const { code } = await processor.render('```\ntest\n```');
assert.ok(!code.includes('is:raw'));
});
it('supports light/dark themes', async () => {
const processor = await createMarkdownProcessor({
shikiConfig: {
themes: {
light: 'github-light',
dark: 'github-dark',
},
},
});
const { code } = await processor.render('```\ntest\n```');
// light theme is there:
assert.match(code, /background-color:/);
assert.match(code, /github-light/);
// dark theme is there:
assert.match(code, /--shiki-dark-bg:/);
assert.match(code, /github-dark/);
});
it('createShikiHighlighter works', async () => {
const highlighter = await createShikiHighlighter();
const html = await highlighter.highlight('const foo = "bar";', 'js');
assert.match(html, /astro-code github-dark/);
assert.match(html, /background-color:#24292e;color:#e1e4e8;/);
});
it('diff +/- text has user-select: none', async () => {
const highlighter = await createShikiHighlighter();
const html = await highlighter.highlight(
`\
- const foo = "bar";
+ const foo = "world";`,
'diff'
);
assert.match(html, /user-select: none/);
assert.match(html, />-<\/span>/);
assert.match(html, />+<\/span>/);
});
it('renders attributes', async () => {
const highlighter = await createShikiHighlighter();
const html = await highlighter.highlight(`foo`, 'js', {
attributes: { 'data-foo': 'bar', autofocus: true },
});
assert.match(html, /data-foo="bar"/);
assert.match(html, /autofocus(?!=)/);
});
it('supports transformers that reads meta', async () => {
const highlighter = await createShikiHighlighter({
transformers: [
{
pre(node) {
const meta = this.options.meta?.__raw;
if (meta) {
node.properties['data-test'] = meta;
}
},
},
],
});
const html = await highlighter.highlight(`foo`, 'js', {
meta: '{1,3-4}',
});
assert.match(html, /data-test="\{1,3-4\}"/);
});
});
|
