You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
86 lines
1.8 KiB
86 lines
1.8 KiB
import { describe, expect, test } from 'bun:test'
|
|
import {
|
|
clampModalOffset,
|
|
clampModalRect,
|
|
clampModalSize,
|
|
createDefaultModalRect,
|
|
createDefaultModalSize,
|
|
} from './quick-note-modal-layout'
|
|
|
|
describe('quick-note modal layout helpers', () => {
|
|
test('createDefaultModalSize uses near-fullscreen viewport with margins', () => {
|
|
expect(createDefaultModalSize({
|
|
viewportWidth: 1200,
|
|
viewportHeight: 900,
|
|
margin: 24,
|
|
minWidth: 640,
|
|
minHeight: 420,
|
|
})).toEqual({
|
|
width: 1152,
|
|
height: 852,
|
|
})
|
|
})
|
|
|
|
test('createDefaultModalRect uses margin as origin', () => {
|
|
expect(createDefaultModalRect({
|
|
viewportWidth: 1200,
|
|
viewportHeight: 900,
|
|
margin: 24,
|
|
minWidth: 640,
|
|
minHeight: 420,
|
|
})).toEqual({
|
|
left: 24,
|
|
top: 24,
|
|
width: 1152,
|
|
height: 852,
|
|
})
|
|
})
|
|
|
|
test('clampModalSize enforces min and max bounds', () => {
|
|
expect(clampModalSize({
|
|
width: 400,
|
|
height: 2000,
|
|
minWidth: 640,
|
|
minHeight: 420,
|
|
maxWidth: 1152,
|
|
maxHeight: 852,
|
|
})).toEqual({
|
|
width: 640,
|
|
height: 852,
|
|
})
|
|
})
|
|
|
|
test('clampModalOffset keeps dragged modal inside viewport bounds', () => {
|
|
expect(clampModalOffset({
|
|
offsetX: 1000,
|
|
offsetY: -1000,
|
|
width: 800,
|
|
height: 500,
|
|
viewportWidth: 1200,
|
|
viewportHeight: 900,
|
|
margin: 24,
|
|
})).toEqual({
|
|
offsetX: 176,
|
|
offsetY: -176,
|
|
})
|
|
})
|
|
|
|
test('clampModalRect keeps resized modal inside viewport and min size', () => {
|
|
expect(clampModalRect({
|
|
left: -200,
|
|
top: 50,
|
|
width: 300,
|
|
height: 1200,
|
|
minWidth: 640,
|
|
minHeight: 420,
|
|
viewportWidth: 1200,
|
|
viewportHeight: 900,
|
|
margin: 24,
|
|
})).toEqual({
|
|
left: 24,
|
|
top: 24,
|
|
width: 640,
|
|
height: 852,
|
|
})
|
|
})
|
|
})
|
|
|