Skip to content

Commit 9566bd7

Browse files
vikingairvikingair
authored
Add vue language support (react-syntax-highlighter#555)
1 parent b0d7714 commit 9566bd7

File tree

8 files changed

+2502
-1848
lines changed

8 files changed

+2502
-1848
lines changed

‎__tests__/__snapshots__/vue-language.js.snap‎

Lines changed: 317 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,317 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`SyntaxHighlighter component renders vue 1`] = `
4+
<pre
5+
style={
6+
Object {
7+
"background": "#F0F0F0",
8+
"color": "#444",
9+
"display": "block",
10+
"overflowX": "auto",
11+
"padding": "0.5em",
12+
}
13+
}
14+
>
15+
<code
16+
className="language-vue"
17+
style={
18+
Object {
19+
"whiteSpace": "pre",
20+
}
21+
}
22+
>
23+
<span
24+
className="xml hljs-tag"
25+
style={Object {}}
26+
>
27+
&lt;
28+
</span>
29+
<span
30+
className="xml hljs-tag"
31+
style={
32+
Object {
33+
"fontWeight": "bold",
34+
}
35+
}
36+
>
37+
script
38+
</span>
39+
<span
40+
className="xml hljs-tag"
41+
style={Object {}}
42+
>
43+
44+
</span>
45+
<span
46+
className="xml hljs-tag hljs-attr"
47+
style={Object {}}
48+
>
49+
lang
50+
</span>
51+
<span
52+
className="xml hljs-tag"
53+
style={Object {}}
54+
>
55+
=
56+
</span>
57+
<span
58+
className="xml hljs-tag"
59+
style={
60+
Object {
61+
"color": "#880000",
62+
}
63+
}
64+
>
65+
"ts"
66+
</span>
67+
<span
68+
className="xml hljs-tag"
69+
style={Object {}}
70+
>
71+
72+
</span>
73+
<span
74+
className="xml hljs-tag hljs-attr"
75+
style={Object {}}
76+
>
77+
setup
78+
</span>
79+
<span
80+
className="xml hljs-tag"
81+
style={Object {}}
82+
>
83+
&gt;
84+
</span>
85+
<span
86+
className="xml javascript"
87+
style={Object {}}
88+
>
89+
90+
91+
</span>
92+
<span
93+
className="xml javascript"
94+
style={Object {}}
95+
>
96+
97+
</span>
98+
<span
99+
className="xml javascript"
100+
style={
101+
Object {
102+
"fontWeight": "bold",
103+
}
104+
}
105+
>
106+
import
107+
</span>
108+
<span
109+
className="xml javascript"
110+
style={Object {}}
111+
>
112+
113+
</span>
114+
<span
115+
style={
116+
Object {
117+
"color": "#BC6060",
118+
}
119+
}
120+
>
121+
{ Layout }
122+
</span>
123+
<span
124+
className="xml javascript"
125+
style={Object {}}
126+
>
127+
128+
</span>
129+
<span
130+
className="xml javascript"
131+
style={
132+
Object {
133+
"fontWeight": "bold",
134+
}
135+
}
136+
>
137+
from
138+
</span>
139+
<span
140+
className="xml javascript"
141+
style={Object {}}
142+
>
143+
144+
</span>
145+
<span
146+
className="xml javascript"
147+
style={
148+
Object {
149+
"color": "#880000",
150+
}
151+
}
152+
>
153+
"@ui/libs"
154+
</span>
155+
<span
156+
className="xml javascript"
157+
style={Object {}}
158+
>
159+
;
160+
161+
</span>
162+
<span
163+
className="xml javascript"
164+
style={Object {}}
165+
>
166+
167+
</span>
168+
<span
169+
className="xml hljs-tag"
170+
style={Object {}}
171+
>
172+
&lt;/
173+
</span>
174+
<span
175+
className="xml hljs-tag"
176+
style={
177+
Object {
178+
"fontWeight": "bold",
179+
}
180+
}
181+
>
182+
script
183+
</span>
184+
<span
185+
className="xml hljs-tag"
186+
style={Object {}}
187+
>
188+
&gt;
189+
</span>
190+
<span
191+
className="xml"
192+
style={Object {}}
193+
>
194+
195+
196+
</span>
197+
<span
198+
className="xml"
199+
style={Object {}}
200+
>
201+
202+
203+
</span>
204+
<span
205+
className="xml"
206+
style={Object {}}
207+
>
208+
209+
</span>
210+
<span
211+
className="xml hljs-tag"
212+
style={Object {}}
213+
>
214+
&lt;
215+
</span>
216+
<span
217+
className="xml hljs-tag"
218+
style={
219+
Object {
220+
"fontWeight": "bold",
221+
}
222+
}
223+
>
224+
template
225+
</span>
226+
<span
227+
className="xml hljs-tag"
228+
style={Object {}}
229+
>
230+
&gt;
231+
</span>
232+
<span
233+
className="xml"
234+
style={Object {}}
235+
>
236+
237+
238+
</span>
239+
<span
240+
className="xml"
241+
style={Object {}}
242+
>
243+
244+
</span>
245+
<span
246+
className="xml hljs-tag"
247+
style={Object {}}
248+
>
249+
&lt;
250+
</span>
251+
<span
252+
className="xml hljs-tag"
253+
style={
254+
Object {
255+
"fontWeight": "bold",
256+
}
257+
}
258+
>
259+
Layout
260+
</span>
261+
<span
262+
className="xml hljs-tag"
263+
style={Object {}}
264+
>
265+
/&gt;
266+
</span>
267+
<span
268+
className="xml"
269+
style={Object {}}
270+
>
271+
272+
273+
</span>
274+
<span
275+
className="xml"
276+
style={Object {}}
277+
>
278+
279+
</span>
280+
<span
281+
className="xml hljs-tag"
282+
style={Object {}}
283+
>
284+
&lt;/
285+
</span>
286+
<span
287+
className="xml hljs-tag"
288+
style={
289+
Object {
290+
"fontWeight": "bold",
291+
}
292+
}
293+
>
294+
template
295+
</span>
296+
<span
297+
className="xml hljs-tag"
298+
style={Object {}}
299+
>
300+
&gt;
301+
</span>
302+
<span
303+
className="xml"
304+
style={Object {}}
305+
>
306+
307+
308+
</span>
309+
<span
310+
className="xml"
311+
style={Object {}}
312+
>
313+
314+
</span>
315+
</code>
316+
</pre>
317+
`;

‎__tests__/vue-language.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import React from 'react';
2+
import renderer from 'react-test-renderer';
3+
import SyntaxHighlighter from '../src';
4+
5+
const code = `<script lang="ts" setup>
6+
import { Layout } from "@ui/libs";
7+
</script>
8+
9+
<template>
10+
<Layout />
11+
</template>
12+
`;
13+
14+
test('SyntaxHighlighter component renders vue', () => {
15+
const tree = renderer
16+
.create(<SyntaxHighlighter language="vue">{code}</SyntaxHighlighter>)
17+
.toJSON();
18+
expect(tree).toMatchSnapshot();
19+
});

0 commit comments

Comments
 (0)