Files
sub2api/frontend/src/components/layout/__tests__/AppSidebar.spec.ts
T
li a86c534cb0 test: 补充侧边栏滚动位置持久化的前端测试
- AppSidebar.spec.ts:验证 template ref 绑定、sidebarNavRef 声明、
  onBeforeUnmount 保存 scrollTop、onMounted 恢复
- app.spec.ts:验证 sidebarScrollTop 默认值为 0 且可读写
2026-07-07 21:11:40 +08:00

56 lines
2.3 KiB
TypeScript

import { readFileSync } from 'node:fs'
import { dirname, resolve } from 'node:path'
import { fileURLToPath } from 'node:url'
import { describe, expect, it } from 'vitest'
const componentPath = resolve(dirname(fileURLToPath(import.meta.url)), '../AppSidebar.vue')
const componentSource = readFileSync(componentPath, 'utf8')
const stylePath = resolve(dirname(fileURLToPath(import.meta.url)), '../../../style.css')
const styleSource = readFileSync(stylePath, 'utf8')
describe('AppSidebar custom SVG styles', () => {
it('does not override uploaded SVG fill or stroke colors', () => {
expect(componentSource).toContain('.sidebar-svg-icon {')
expect(componentSource).toContain('color: currentColor;')
expect(componentSource).toContain('display: block;')
expect(componentSource).not.toContain('stroke: currentColor;')
expect(componentSource).not.toContain('fill: none;')
})
})
describe('AppSidebar scroll position persistence', () => {
it('binds a template ref to the sidebar nav element', () => {
expect(componentSource).toContain('ref="sidebarNavRef"')
expect(componentSource).toContain('sidebar-nav')
})
it('declares sidebarNavRef in script setup', () => {
expect(componentSource).toContain("const sidebarNavRef = ref<HTMLElement | null>(null)")
})
it('saves scroll position on beforeUnmount', () => {
expect(componentSource).toContain('onBeforeUnmount')
expect(componentSource).toContain('appStore.sidebarScrollTop')
expect(componentSource).toContain('sidebarNavRef.value.scrollTop')
})
it('restores scroll position on mount', () => {
expect(componentSource).toContain('onMounted')
expect(componentSource).toContain('appStore.sidebarScrollTop')
expect(componentSource).toContain('nextTick')
})
})
describe('AppSidebar header styles', () => {
it('does not clip the version badge dropdown', () => {
const sidebarHeaderBlockMatch = styleSource.match(/\.sidebar-header\s*\{[\s\S]*?\n {2}\}/)
const sidebarBrandBlockMatch = componentSource.match(/\.sidebar-brand\s*\{[\s\S]*?\n\}/)
expect(sidebarHeaderBlockMatch).not.toBeNull()
expect(sidebarBrandBlockMatch).not.toBeNull()
expect(sidebarHeaderBlockMatch?.[0]).not.toContain('@apply overflow-hidden;')
expect(sidebarBrandBlockMatch?.[0]).not.toContain('overflow: hidden;')
})
})