浅念
f1c13bff7c
Task 10（广告位轮播实施计划）： - ads/carousel.ts 纯逻辑：nextIndex 环形推进（末→首、单条恒 0）+ swipeStep 滑动判定（≥40px 且水平分量严格大于垂直），carousel.spec 直测 7 例 - AdCarousel.vue：10:3 轮播，4s 自动推进（本地常量 ROTATE_MS）；pointerenter/ pointerdown 暂停、pointerleave 恢复；圆点跳页；touchstart/touchend 滑动翻页 （cancel 合成 click）；单条静态无圆点；左上角常驻「广告」徽标 + 右上角 ≥44px ✕ 关闭（emit close，组件无副作用）；视觉一律 var(--viewer-*)（半透明层经 color-mix 自 token 派生） - client.ts：PublicAd/PublicAdListResponse 契约类型 + getPublicAds（同形 apiRequest）；__tests__/ad-carousel.spec.ts 组件级 6 例（圆点/关闭/window.open spy/假时钟自动轮播与暂停/滑动/单条静态） - ActivityPage：load() 成功分支独立拉取广告（失败静默、会话级关闭记忆 viewer:ads-dismissed 先行、沿用 sequence 防跨相册竞态）；AlbumHeader 与 PhotoFeed 之间挂 AdCarousel；i18n zh-CN/en 补 ads.* 词条 Co-Authored-By: Claude Code <noreply@anthropic.com>
49 lines
1.7 KiB
TypeScript
49 lines
1.7 KiB
TypeScript
import { describe, expect, it } from 'vitest';
|
|
import { nextIndex, swipeStep } from './carousel';
|
|
|
|
// 广告轮播纯逻辑（Task 10 Step 1）：推进/环形回绕/单条静止 + 滑动手势判定
|
|
//（阈值 40px、水平分量须严格大于垂直分量）。
|
|
|
|
describe('nextIndex', () => {
|
|
it('advances forward and wraps from the tail to the head (ring)', () => {
|
|
expect(nextIndex(3, 0)).toBe(1);
|
|
expect(nextIndex(3, 1)).toBe(2);
|
|
expect(nextIndex(3, 2)).toBe(0); // 末→首
|
|
});
|
|
|
|
it('keeps a single item pinned at 0 (never switches)', () => {
|
|
expect(nextIndex(1, 0)).toBe(0);
|
|
expect(nextIndex(1, 0, -1)).toBe(0);
|
|
expect(nextIndex(0, 0)).toBe(0); // 空表防御：同 0
|
|
});
|
|
|
|
it('steps backwards wrapping from the head to the tail', () => {
|
|
expect(nextIndex(3, 0, -1)).toBe(2);
|
|
expect(nextIndex(3, 2, -1)).toBe(1);
|
|
expect(nextIndex(5, 4, -1)).toBe(3);
|
|
});
|
|
});
|
|
|
|
describe('swipeStep', () => {
|
|
it('maps an unambiguous horizontal swipe to its direction', () => {
|
|
expect(swipeStep(-80, 5)).toBe(1); // 左滑 → 下一张
|
|
expect(swipeStep(80, -5)).toBe(-1); // 右滑 → 上一张
|
|
});
|
|
|
|
it('ignores movement under the 40px threshold', () => {
|
|
expect(swipeStep(-39, 0)).toBe(0);
|
|
expect(swipeStep(39, 2)).toBe(0);
|
|
});
|
|
|
|
it('accepts exactly 40px (>= threshold)', () => {
|
|
expect(swipeStep(-40, 0)).toBe(1);
|
|
expect(swipeStep(40, 0)).toBe(-1);
|
|
});
|
|
|
|
it('ignores diagonal or vertically dominant movement', () => {
|
|
expect(swipeStep(60, 70)).toBe(0); // 垂直分量更大（斜向）
|
|
expect(swipeStep(50, 50)).toBe(0); // 等分量：水平须严格大于垂直
|
|
expect(swipeStep(-100, 100)).toBe(0);
|
|
});
|
|
});
|