Skip to content

Commit c82e851

Browse files
Simon-He95Simon-He95
committed
feat: add test-vue component and corresponding tests with snapshots
1 parent 9255759 commit c82e851

File tree

5 files changed

+182
-1
lines changed

5 files changed

+182
-1
lines changed

‎src/transformCss.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -177,7 +177,7 @@ export async function transformCss(
177177
}
178178

179179
const {
180-
loc: { source, start, end },
180+
loc: { start, end },
181181
tag,
182182
props,
183183
} = r

‎test/__snapshots__/test-vue.test.ts.snap‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2+
3+
exports[`test-vue > test-vue.vue 1`] = `
4+
"<script setup lang="ts">
5+
// 这里可以添加你的逻辑
6+
</script>
7+
<template>
8+
<div class="portal-container min-h-100vh flex flex-col font-[Arial,_sans-serif] bg-[#f5f6fa]">
9+
<header class="portal-header bg-[#2d8cf0] text-[#fff] px-32px py-24px flex flex-col items-start">
10+
<h1>门户首页</h1>
11+
<nav class="mt-12px">
12+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">首页</a>
13+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">功能一</a>
14+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">功能二</a>
15+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">关于</a>
16+
</nav>
17+
</header>
18+
<main class="portal-main flex-1 px-32px py-40px">
19+
<section class="welcome-section mb-32px">
20+
<h2>欢迎来到门户页面</h2>
21+
<p>这里是你的 Vue 门户页面示例。</p>
22+
</section>
23+
<section class="features-section">
24+
<h3>功能介绍</h3>
25+
<ul class="pl-20px">
26+
<li>功能一描述</li>
27+
<li>功能二描述</li>
28+
<li>更多功能...</li>
29+
</ul>
30+
</section>
31+
</main>
32+
<footer class="portal-footer bg-[#222] text-[#fff] text-center px-0 py-16px text-14px">
33+
&copy; 2025 门户页面示例
34+
</footer>
35+
</div>
36+
</template>
37+
<style scoped></style>
38+
"
39+
`;

‎test/__snapshots__/transformCode.test.ts.snap‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2015,6 +2015,45 @@ body {
20152015
",
20162016
"
20172017
2018+
----- test-vue.vue -------
2019+
2020+
<script setup lang="ts">
2021+
// 这里可以添加你的逻辑
2022+
</script>
2023+
<template>
2024+
<div class="portal-container min-h-100vh flex flex-col font-[Arial,_sans-serif] bg-[#f5f6fa]">
2025+
<header class="portal-header bg-[#2d8cf0] text-[#fff] px-32px py-24px flex flex-col items-start">
2026+
<h1>门户首页</h1>
2027+
<nav class="mt-12px">
2028+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">首页</a>
2029+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">功能一</a>
2030+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">功能二</a>
2031+
<a class="text-[#fff] mr-20px decoration-none font-bold hover-decoration-underline" href="#">关于</a>
2032+
</nav>
2033+
</header>
2034+
<main class="portal-main flex-1 px-32px py-40px">
2035+
<section class="welcome-section mb-32px">
2036+
<h2>欢迎来到门户页面</h2>
2037+
<p>这里是你的 Vue 门户页面示例。</p>
2038+
</section>
2039+
<section class="features-section">
2040+
<h3>功能介绍</h3>
2041+
<ul class="pl-20px">
2042+
<li>功能一描述</li>
2043+
<li>功能二描述</li>
2044+
<li>更多功能...</li>
2045+
</ul>
2046+
</section>
2047+
</main>
2048+
<footer class="portal-footer bg-[#222] text-[#fff] text-center px-0 py-16px text-14px">
2049+
&copy; 2025 门户页面示例
2050+
</footer>
2051+
</div>
2052+
</template>
2053+
<style scoped></style>
2054+
",
2055+
"
2056+
20182057
----- test.vue -------
20192058
20202059
<template>

‎test/demo/test-vue.vue‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<script setup lang="ts">
2+
// 这里可以添加你的逻辑
3+
</script>
4+
5+
<template>
6+
<div class="portal-container">
7+
<header class="portal-header">
8+
<h1>门户首页</h1>
9+
<nav>
10+
<a href="#">首页</a>
11+
<a href="#">功能一</a>
12+
<a href="#">功能二</a>
13+
<a href="#">关于</a>
14+
</nav>
15+
</header>
16+
<main class="portal-main">
17+
<section class="welcome-section">
18+
<h2>欢迎来到门户页面</h2>
19+
<p>这里是你的 Vue 门户页面示例。</p>
20+
</section>
21+
<section class="features-section">
22+
<h3>功能介绍</h3>
23+
<ul>
24+
<li>功能一描述</li>
25+
<li>功能二描述</li>
26+
<li>更多功能...</li>
27+
</ul>
28+
</section>
29+
</main>
30+
<footer class="portal-footer">
31+
&copy; 2025 门户页面示例
32+
</footer>
33+
</div>
34+
</template>
35+
36+
<style scoped>
37+
.portal-container {
38+
min-height: 100vh;
39+
display: flex;
40+
flex-direction: column;
41+
font-family: Arial, sans-serif;
42+
background: #f5f6fa;
43+
}
44+
45+
.portal-header {
46+
background: #2d8cf0;
47+
color: #fff;
48+
padding: 24px 32px;
49+
display: flex;
50+
flex-direction: column;
51+
align-items: flex-start;
52+
}
53+
54+
.portal-header nav {
55+
margin-top: 12px;
56+
}
57+
58+
.portal-header a {
59+
color: #fff;
60+
margin-right: 20px;
61+
text-decoration: none;
62+
font-weight: bold;
63+
}
64+
65+
.portal-header a:hover {
66+
text-decoration: underline;
67+
}
68+
69+
.portal-main {
70+
flex: 1;
71+
padding: 40px 32px;
72+
}
73+
74+
.welcome-section {
75+
margin-bottom: 32px;
76+
}
77+
78+
.features-section ul {
79+
padding-left: 20px;
80+
}
81+
82+
.portal-footer {
83+
background: #222;
84+
color: #fff;
85+
text-align: center;
86+
padding: 16px 0;
87+
font-size: 14px;
88+
}
89+
</style>

‎test/test-vue.test.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import fsp from 'fs/promises'
2+
import path from 'path'
3+
import { describe, expect, it } from 'vitest'
4+
import { transfromCode } from '../src'
5+
6+
7+
8+
describe('test-vue', async () => {
9+
const demo = await fsp.readFile('./test/demo/test-vue.vue', 'utf-8')
10+
const filepath = path.resolve(process.cwd(), './test/demo/test-vue.vue')
11+
it('test-vue.vue', async () => {
12+
expect(await transfromCode(demo, {filepath, type:'vue'})).toMatchSnapshot()
13+
})
14+
})

0 commit comments

Comments
 (0)