60 lines
1.8 KiB
JavaScript
60 lines
1.8 KiB
JavaScript
import test from 'node:test'
|
|
import assert from 'node:assert/strict'
|
|
import { getTopMaskProgress, getTopMaskStartY } from '../src/utils/homeTopMask.js'
|
|
|
|
test('returns 0 before the title reaches the status-bar area', () => {
|
|
assert.equal(
|
|
getTopMaskProgress({ scrollTop: 30, startY: 80, rangeY: 40 }),
|
|
0
|
|
)
|
|
})
|
|
|
|
test('ramps linearly through the transition range', () => {
|
|
assert.equal(
|
|
getTopMaskProgress({ scrollTop: 100, startY: 80, rangeY: 40 }),
|
|
0.5
|
|
)
|
|
})
|
|
|
|
test('returns 1 after the full transition range', () => {
|
|
assert.equal(
|
|
getTopMaskProgress({ scrollTop: 180, startY: 80, rangeY: 40 }),
|
|
1
|
|
)
|
|
})
|
|
|
|
test('clamps invalid values into a stable progress range', () => {
|
|
assert.equal(getTopMaskProgress({ scrollTop: -10, startY: 80, rangeY: 40 }), 0)
|
|
assert.equal(getTopMaskProgress({ scrollTop: 90, startY: 80, rangeY: 0 }), 1)
|
|
assert.equal(getTopMaskProgress({ scrollTop: Number.NaN, startY: 80, rangeY: 40 }), 0)
|
|
})
|
|
|
|
|
|
test('converts a viewport-relative title bottom to a document-relative start Y', () => {
|
|
assert.equal(
|
|
getTopMaskStartY({ viewportBottom: 148, scrollTop: 0, statusBarHeight: 44 }),
|
|
96
|
|
)
|
|
|
|
// The same header, measured after the user has already scrolled, must keep
|
|
// the same document-relative threshold instead of collapsing to 0.
|
|
assert.equal(
|
|
getTopMaskStartY({ viewportBottom: 48, scrollTop: 100, statusBarHeight: 44 }),
|
|
96
|
|
)
|
|
})
|
|
|
|
test('clamps the document-relative start Y at zero', () => {
|
|
assert.equal(
|
|
getTopMaskStartY({ viewportBottom: 20, scrollTop: 0, statusBarHeight: 44 }),
|
|
0
|
|
)
|
|
})
|
|
|
|
test('treats non-finite threshold inputs as zero without producing NaN', () => {
|
|
assert.equal(
|
|
getTopMaskStartY({ viewportBottom: Number.NaN, scrollTop: 80, statusBarHeight: 44 }),
|
|
28
|
|
)
|
|
})
|