import type { BlockBox } from './scrollPosition' import { describe, expect, it } from 'vitest' import { anchorAt, blockForLine, holdAt, scrollTopFor } from './scrollPosition' // 页面上的块:顶部有 20px 工具栏,块与块之间 8px 间距 const boxes: BlockBox[] = [ { line: 0, top: 20, bottom: 60 }, { line: 3, top: 68, bottom: 108 }, { line: 4, top: 116, bottom: 196 }, { line: 10, top: 204, bottom: 244 }, ] describe('anchorAt:视口顶部那块', () => { it('视口顶部落在块中间:记这块的起始行和块内偏移', () => { expect(anchorAt(boxes, 150)).toEqual({ line: 4, offset: 34, scrollTop: 150 }) }) it('视口顶部落在块间空隙:取下面那块,偏移为负', () => { expect(anchorAt(boxes, 110)).toEqual({ line: 4, offset: -6, scrollTop: 110 }) }) it('还在最顶上:取第一块', () => { expect(anchorAt(boxes, 0)).toEqual({ line: 0, offset: -20, scrollTop: 0 }) }) it('所有块都滚过去了:取最后一块', () => { expect(anchorAt(boxes, 300)).toEqual({ line: 10, offset: 96, scrollTop: 300 }) }) it('没有块:没有位置可记', () => { expect(anchorAt([], 50)).toBeUndefined() }) }) describe('holdAt:页面变了也钉住不动的那块', () => { it('视口顶部落在块中间:钉这块', () => { expect(holdAt(boxes, 150)).toEqual({ line: 4, offset: 34, scrollTop: 150 }) }) it('视口顶部落在块间空隙(或上面那块的问答区)里:钉上面那块,下面那块长高不牵动视口', () => { expect(holdAt(boxes, 110)).toEqual({ line: 3, offset: 42, scrollTop: 110 }) }) it('还在所有块上面:不钉', () => { expect(holdAt(boxes, 0)).toBeUndefined() }) it('起始行相同的外层块和第一个子块:钉靠前的那块,按起始行找回来还是原处', () => { const nested = [{ line: 0, top: 20, bottom: 60 }, { line: 4, top: 68, bottom: 100 }, { line: 4, top: 108, bottom: 200 }] const anchor = holdAt(nested, 150)! expect(anchor).toEqual({ line: 4, offset: 82, scrollTop: 150 }) expect(scrollTopFor(nested, anchor)).toBe(150) }) }) describe('scrollTopFor:按记下的位置恢复', () => { it('内容没变:回到原来的 scrollTop', () => { expect(scrollTopFor(boxes, anchorAt(boxes, 150)!)).toBe(150) }) it('隐藏期间上面多了一块:跟着那块走,而不是停在原来的像素', () => { const anchor = anchorAt(boxes, 150)! const edited = [{ line: 0, top: 20, bottom: 60 }, { line: 1, top: 68, bottom: 108 }, ...boxes.slice(1).map(b => ({ ...b, top: b.top + 48, bottom: b.bottom + 48 }))] expect(scrollTopFor(edited, anchor)).toBe(198) }) it('那一行已经没有块了:退回原来的 scrollTop', () => { expect(scrollTopFor(boxes, { line: 7, offset: 12, scrollTop: 140 })).toBe(140) }) }) describe('blockForLine:包含某行的块', () => { it('正好是块的起始行', () => { expect(blockForLine(boxes, 4)?.line).toBe(4) }) it('落在块中间或块后面的空行:取之前最近的块', () => { expect(blockForLine(boxes, 8)?.line).toBe(4) expect(blockForLine(boxes, 99)?.line).toBe(10) }) it('在所有块之前:取第一块', () => { expect(blockForLine([{ line: 5, top: 20, bottom: 60 }, { line: 9, top: 68, bottom: 108 }], 2)?.line).toBe(5) }) it('没有块:找不到', () => { expect(blockForLine([], 3)).toBeUndefined() }) })