huangzd1997
13e7a4c602
sidebar-collapse 提供阈值/宽高常量、toggle、localStorage 偏好读写(失败容忍)、 initialCollapsed(持久化优先，窄屏自动收起)；AdminLayout 接入并持久化折叠状态。
94 lines
3.8 KiB
TypeScript
94 lines
3.8 KiB
TypeScript
import test from 'node:test'
|
|
import assert from 'node:assert/strict'
|
|
import { readSource } from './helpers.ts'
|
|
import {
|
|
initialCollapsed,
|
|
isNarrowScreen,
|
|
readCollapsePreference,
|
|
SIDEBAR_COLLAPSED_WIDTH,
|
|
SIDEBAR_EXPANDED_WIDTH,
|
|
SIDEBAR_NARROW_THRESHOLD,
|
|
sidebarPixelWidth,
|
|
toggleCollapsed,
|
|
writeCollapsePreference,
|
|
type CollapseStorage,
|
|
} from '../src/layout/sidebar-collapse.ts'
|
|
|
|
function fakeStorage(entries: Record<string, string>, failing = false): CollapseStorage {
|
|
return {
|
|
getItem(key: string) {
|
|
if (failing) throw new Error('storage down')
|
|
return key in entries ? entries[key] : null
|
|
},
|
|
setItem(key: string, value: string) {
|
|
if (failing) throw new Error('storage down')
|
|
entries[key] = value
|
|
},
|
|
}
|
|
}
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_normal_primary_path', () => {
|
|
// 正常主路径：折叠开关反转状态。
|
|
assert.equal(toggleCollapsed(false), true)
|
|
assert.equal(toggleCollapsed(true), false)
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_normal_variant_input', () => {
|
|
// 正常变体：不同宽度判定窄屏与宽屏。
|
|
assert.equal(isNarrowScreen(SIDEBAR_NARROW_THRESHOLD), true)
|
|
assert.equal(isNarrowScreen(SIDEBAR_NARROW_THRESHOLD + 1), false)
|
|
assert.equal(isNarrowScreen(1440), false)
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_normal_repeated_operation_is_idempotent', () => {
|
|
// 正常重复：偏好读写与宽度结果稳定。
|
|
const storage = fakeStorage({})
|
|
assert.equal(initialCollapsed(1000, storage), initialCollapsed(1000, storage))
|
|
writeCollapsePreference(storage, true)
|
|
assert.equal(readCollapsePreference(storage), true)
|
|
assert.equal(readCollapsePreference(storage), true)
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_boundary_empty_input', () => {
|
|
// 边界空值：未知宽度/无存储不崩溃且回退展开。
|
|
assert.equal(isNarrowScreen(0), false)
|
|
assert.equal(initialCollapsed(0, null), false)
|
|
assert.equal(readCollapsePreference(null), null)
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_boundary_single_item', () => {
|
|
// 边界单元素：单值持久化可读回。
|
|
const storage = fakeStorage({ 'admin.sidebar.collapsed': 'false' })
|
|
assert.equal(readCollapsePreference(storage), false)
|
|
assert.equal(initialCollapsed(1024, storage), false)
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_boundary_limit_or_missing_field', () => {
|
|
// 边界上限/缺字段：非法持久化值按无偏好处理；像素宽与常量一致。
|
|
const storage = fakeStorage({ 'admin.sidebar.collapsed': 'maybe' })
|
|
assert.equal(readCollapsePreference(storage), null)
|
|
assert.equal(sidebarPixelWidth(true), SIDEBAR_COLLAPSED_WIDTH)
|
|
assert.equal(sidebarPixelWidth(false), SIDEBAR_EXPANDED_WIDTH)
|
|
assert.equal(SIDEBAR_COLLAPSED_WIDTH < SIDEBAR_EXPANDED_WIDTH, true)
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_invalid_input_rejected', () => {
|
|
// 异常输入：存储读写失败被容忍，不阻断交互。
|
|
const broken = fakeStorage({}, true)
|
|
assert.equal(readCollapsePreference(broken), null)
|
|
assert.doesNotThrow(() => writeCollapsePreference(broken, true))
|
|
const fallback = fakeStorage({ 'admin.sidebar.collapsed': 'true' })
|
|
assert.equal(initialCollapsed(1440, fallback), true, '持久化优先于视口宽度')
|
|
})
|
|
|
|
test('test_task_014_sidebar_responsive_behavior_dependency_failure_returns_actionable_message', () => {
|
|
// 依赖失败：壳层接入折叠逻辑；CSS 有 is-collapsed 与窄屏媒体适配。
|
|
const layout = readSource('src/layout/AdminLayout.vue')
|
|
assert.match(layout, /initialCollapsed/)
|
|
assert.match(layout, /writeCollapsePreference/)
|
|
assert.match(layout, /toggleSidebar/)
|
|
const css = readSource('src/styles/main.css')
|
|
assert.match(css, /is-collapsed/)
|
|
assert.match(css, /@media \(max-width: 820px\)/)
|
|
})
|