Skip to content

Commit 9407dac

Browse files
andrewbranchandrewbranch
committed
Add tests
1 parent 8664538 commit 9407dac

File tree

11 files changed

+229
-3
lines changed

11 files changed

+229
-3
lines changed

‎src/createCodeNodeRegistry.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,8 @@ function createCodeNodeRegistry({ prefixAllClassNames } = {}) {
3535
forEachLine: (node, action) => blockMap.get(node).lines.forEach(action),
3636
forEachToken: (node, lineIndex, tokenAction) => {
3737
generateClassNames();
38-
const { tokenizationResults, isTokenized, lines } = blockMap.get(node);
38+
const map = node.type === 'code' ? blockMap : spanMap;
39+
const { tokenizationResults, isTokenized, lines } = map.get(node);
3940
if (!isTokenized) {
4041
return;
4142
}

‎src/graphql/getCodeSpanDataFromRegistry.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
const { renderHTML } = require('../renderers/html');
2-
const { partitionOne } = require('../utils');
2+
const { partitionOne, flatMap } = require('../utils');
33
const { createTokenElement, createCodeSpanElement } = require('../factory/html');
4+
const { getThemeClassNames } = require('../themeUtils');
5+
const { joinClassNames } = require('../renderers/css');
46

57
/**
68
* @template {Keyable} TKey
@@ -27,7 +29,9 @@ function getCodeSpanDataFromRegistry(registry, key, codeSpan, getClassName) {
2729
});
2830
});
2931

30-
const className = getClassName();
32+
const customClassName = getClassName();
33+
const themeClassNames = flatMap(possibleThemes, getThemeClassNames);
34+
const className = joinClassNames(customClassName, ...themeClassNames);
3135
const html = createCodeSpanElement(index, languageName, className, tokenElements);
3236
const [defaultTheme, additionalThemes] = partitionOne(possibleThemes, t =>
3337
t.conditions.some(c => c.condition === 'default')

‎test/integration/baselines/inline-custom-class.html

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<h1>Inline Code</h1>
2+
<p>Lorem <code>ipsum</code>, and <code class="my-inline-code default-light" data-language="css" data-index="0"><span class="mtk11">.</span><span class="mtk11">grvsc-container</span><span class="mtk1"> </span><span class="mtk1">{</span><span class="mtk1"> </span><span class="mtk6">display</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk8">block</span><span class="mtk1"> </span><span class="mtk1">}</span></code>.</p>
3+
<p><code class="my-inline-code default-light" data-language="ts" data-index="1"><span class="mtk1">(</span><span class="mtk12">x</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk9">string</span><span class="mtk1">,</span><span class="mtk1"> </span><span class="mtk12">y</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk9">boolean</span><span class="mtk1">)</span><span class="mtk1"> </span><span class="mtk4">=></span><span class="mtk1"> </span><span class="mtk1">{</span><span class="mtk1">}</span></code></p>
4+
<p><code class="my-inline-code default-light" data-language="sh" data-index="2"><span class="mtk1"> leading space should be preserved</span></code></p>
5+
<p><code class="my-inline-code default-light" data-language="js" data-index="3"><span class="mtk17">`</span><span class="mtk17">This should be fine </span><span class="mtk4">${</span><span class="mtk12">because</span><span class="mtk4">}</span><span class="mtk17"> the Markdown parser should have already trimmed the leading space.</span><span class="mtk17">`</span></code></p>
6+
<style class="grvsc-styles">
7+
.grvsc-container {
8+
overflow: auto;
9+
-webkit-overflow-scrolling: touch;
10+
padding-top: 1rem;
11+
padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));
12+
padding-bottom: 1rem;
13+
padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));
14+
border-radius: 8px;
15+
border-radius: var(--grvsc-border-radius, 8px);
16+
font-feature-settings: normal;
17+
}
18+
19+
.grvsc-code {
20+
display: inline-block;
21+
min-width: 100%;
22+
}
23+
24+
.grvsc-line {
25+
display: inline-block;
26+
box-sizing: border-box;
27+
width: 100%;
28+
padding-left: 1.5rem;
29+
padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));
30+
padding-right: 1.5rem;
31+
padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));
32+
}
33+
34+
.grvsc-line-highlighted {
35+
background-color: var(--grvsc-line-highlighted-background-color, transparent);
36+
box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);
37+
}
38+
39+
.default-light {
40+
background-color: #FFFFFF;
41+
color: #000000;
42+
}
43+
.default-light .mtk11 { color: #800000; }
44+
.default-light .mtk1 { color: #000000; }
45+
.default-light .mtk6 { color: #FF0000; }
46+
.default-light .mtk8 { color: #0451A5; }
47+
.default-light .mtk12 { color: #001080; }
48+
.default-light .mtk9 { color: #267F99; }
49+
.default-light .mtk4 { color: #0000FF; }
50+
.default-light .mtk17 { color: #A31515; }
51+
</style>

‎test/integration/baselines/inline-theme-function.html

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<h1>Inline Code</h1>
2+
<p>Lorem <code>ipsum</code>, and <code class="my-inline-code abyss" data-language="css" data-index="0"><span class="mtk6">.</span><span class="mtk6">grvsc-container</span><span class="mtk1"> </span><span class="mtk1">{</span><span class="mtk1"> </span><span class="mtk15 mtki">display</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk15">block</span><span class="mtk1"> </span><span class="mtk1">}</span></code>.</p>
3+
<p><code class="my-inline-code abyss" data-language="ts" data-index="1"><span class="mtk1">(</span><span class="mtk19 mtki">x</span><span class="mtk7">:</span><span class="mtk1"> </span><span class="mtk15 mtki">string</span><span class="mtk1">,</span><span class="mtk1"> </span><span class="mtk19 mtki">y</span><span class="mtk7">:</span><span class="mtk1"> </span><span class="mtk15 mtki">boolean</span><span class="mtk1">)</span><span class="mtk1"> </span><span class="mtk15 mtki">=></span><span class="mtk1"> </span><span class="mtk1">{</span><span class="mtk1">}</span></code></p>
4+
<p><code class="my-inline-code abyss" data-language="sh" data-index="2"><span class="mtk1"> leading space should be preserved</span></code></p>
5+
<p><code class="my-inline-code default-light grvsc-mm-tYvMB2" data-language="js" data-index="3"><span class="grvsc-t7UkM5-17 grvsc-tYvMB2-8">`</span><span class="grvsc-t7UkM5-17 grvsc-tYvMB2-8">This should be fine </span><span class="grvsc-t7UkM5-4 grvsc-tYvMB2-4">${</span><span class="grvsc-t7UkM5-12 grvsc-tYvMB2-12">because</span><span class="grvsc-t7UkM5-4 grvsc-tYvMB2-4">}</span><span class="grvsc-t7UkM5-17 grvsc-tYvMB2-8"> the Markdown parser should have already trimmed the leading space.</span><span class="grvsc-t7UkM5-17 grvsc-tYvMB2-8">`</span></code></p>
6+
<style class="grvsc-styles">
7+
.grvsc-container {
8+
overflow: auto;
9+
-webkit-overflow-scrolling: touch;
10+
padding-top: 1rem;
11+
padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));
12+
padding-bottom: 1rem;
13+
padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));
14+
border-radius: 8px;
15+
border-radius: var(--grvsc-border-radius, 8px);
16+
font-feature-settings: normal;
17+
}
18+
19+
.grvsc-code {
20+
display: inline-block;
21+
min-width: 100%;
22+
}
23+
24+
.grvsc-line {
25+
display: inline-block;
26+
box-sizing: border-box;
27+
width: 100%;
28+
padding-left: 1.5rem;
29+
padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));
30+
padding-right: 1.5rem;
31+
padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));
32+
}
33+
34+
.grvsc-line-highlighted {
35+
background-color: var(--grvsc-line-highlighted-background-color, transparent);
36+
box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);
37+
}
38+
39+
.abyss { background-color: #000c18; }
40+
.abyss .mtki { font-style: italic; }
41+
.abyss .mtk6 { color: #DDBB88; }
42+
.abyss .mtk1 { color: #6688CC; }
43+
.abyss .mtk15 { color: #9966B8; }
44+
.abyss .mtk19 { color: #2277FF; }
45+
.abyss .mtk7 { color: #225588; }
46+
.default-light {
47+
background-color: #FFFFFF;
48+
color: #000000;
49+
}
50+
.default-light .grvsc-t7UkM5-17 { color: #A31515; }
51+
.default-light .grvsc-t7UkM5-4 { color: #0000FF; }
52+
.default-light .grvsc-t7UkM5-12 { color: #001080; }
53+
54+
/* Default Dark+ */
55+
@media (prefers-color-scheme: dark) {
56+
.grvsc-mm-tYvMB2 {
57+
background-color: #1E1E1E;
58+
color: #D4D4D4;
59+
}
60+
.grvsc-mm-tYvMB2 .grvsc-tYvMB2-8 { color: #CE9178; }
61+
.grvsc-mm-tYvMB2 .grvsc-tYvMB2-4 { color: #569CD6; }
62+
.grvsc-mm-tYvMB2 .grvsc-tYvMB2-12 { color: #9CDCFE; }
63+
}
64+
</style>

‎test/integration/baselines/inline.html

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<h1>Inline Code</h1>
2+
<p>Lorem <code>ipsum</code>, and <code class="default-light" data-language="css" data-index="0"><span class="mtk11">.</span><span class="mtk11">grvsc-container</span><span class="mtk1"> </span><span class="mtk1">{</span><span class="mtk1"> </span><span class="mtk6">display</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk8">block</span><span class="mtk1"> </span><span class="mtk1">}</span></code>.</p>
3+
<p><code class="default-light" data-language="ts" data-index="1"><span class="mtk1">(</span><span class="mtk12">x</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk9">string</span><span class="mtk1">,</span><span class="mtk1"> </span><span class="mtk12">y</span><span class="mtk1">:</span><span class="mtk1"> </span><span class="mtk9">boolean</span><span class="mtk1">)</span><span class="mtk1"> </span><span class="mtk4">=></span><span class="mtk1"> </span><span class="mtk1">{</span><span class="mtk1">}</span></code></p>
4+
<p><code class="default-light" data-language="sh" data-index="2"><span class="mtk1"> leading space should be preserved</span></code></p>
5+
<p><code class="default-light" data-language="js" data-index="3"><span class="mtk17">`</span><span class="mtk17">This should be fine </span><span class="mtk4">${</span><span class="mtk12">because</span><span class="mtk4">}</span><span class="mtk17"> the Markdown parser should have already trimmed the leading space.</span><span class="mtk17">`</span></code></p>
6+
<style class="grvsc-styles">
7+
.grvsc-container {
8+
overflow: auto;
9+
-webkit-overflow-scrolling: touch;
10+
padding-top: 1rem;
11+
padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));
12+
padding-bottom: 1rem;
13+
padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));
14+
border-radius: 8px;
15+
border-radius: var(--grvsc-border-radius, 8px);
16+
font-feature-settings: normal;
17+
}
18+
19+
.grvsc-code {
20+
display: inline-block;
21+
min-width: 100%;
22+
}
23+
24+
.grvsc-line {
25+
display: inline-block;
26+
box-sizing: border-box;
27+
width: 100%;
28+
padding-left: 1.5rem;
29+
padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));
30+
padding-right: 1.5rem;
31+
padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));
32+
}
33+
34+
.grvsc-line-highlighted {
35+
background-color: var(--grvsc-line-highlighted-background-color, transparent);
36+
box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);
37+
}
38+
39+
.default-light {
40+
background-color: #FFFFFF;
41+
color: #000000;
42+
}
43+
.default-light .mtk11 { color: #800000; }
44+
.default-light .mtk1 { color: #000000; }
45+
.default-light .mtk6 { color: #FF0000; }
46+
.default-light .mtk8 { color: #0451A5; }
47+
.default-light .mtk12 { color: #001080; }
48+
.default-light .mtk9 { color: #267F99; }
49+
.default-light .mtk4 { color: #0000FF; }
50+
.default-light .mtk17 { color: #A31515; }
51+
</style>

‎test/integration/cases/inline-custom-class/options.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
inlineCode: {
3+
theme: 'Default Light+',
4+
marker: '•',
5+
className: 'my-inline-code'
6+
}
7+
};

‎test/integration/cases/inline-custom-class/test.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Inline Code
2+
3+
Lorem `ipsum`, and `css•.grvsc-container { display: block }`.
4+
5+
``ts•(x: string, y: boolean) => {}``
6+
7+
`sh• leading space should be preserved`
8+
9+
`` js•`This should be fine ${because} the Markdown parser should have already trimmed the leading space.` ``

‎test/integration/cases/inline-theme-function/options.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
module.exports = {
2+
inlineCode: {
3+
theme: ({ language }) => {
4+
if (language === 'js') {
5+
return {
6+
default: 'Default Light+',
7+
dark: 'Default Dark+'
8+
};
9+
}
10+
return 'Abyss';
11+
},
12+
marker: '•',
13+
className: 'my-inline-code'
14+
}
15+
};

‎test/integration/cases/inline-theme-function/test.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# Inline Code
2+
3+
Lorem `ipsum`, and `css•.grvsc-container { display: block }`.
4+
5+
``ts•(x: string, y: boolean) => {}``
6+
7+
`sh• leading space should be preserved`
8+
9+
`` js•`This should be fine ${because} the Markdown parser should have already trimmed the leading space.` ``

‎test/integration/cases/inline/options.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
inlineCode: {
3+
theme: 'Default Light+',
4+
marker: '•'
5+
}
6+
};

0 commit comments

Comments
 (0)