Files
NODEDC_DESIGN_GUIDELINE/scripts/floating-position-contract.test.mjs
T

62 lines
1.7 KiB
JavaScript

import assert from "node:assert/strict";
import { readFile } from "node:fs/promises";
import test from "node:test";
import { computeFloatingPosition } from "../packages/ui-core/dist/index.js";
test("floating surface remains bounded when its anchor is above the viewport", () => {
const position = computeFloatingPosition({
anchor: {
top: -1888,
right: 1228,
bottom: -1842,
left: 940,
width: 288,
height: 46,
},
surfaceWidth: 324,
surfaceHeight: 144,
viewportWidth: 1280,
viewportHeight: 720,
viewportPadding: 8,
});
assert.equal(position.top, 8);
assert.ok(position.maxHeight <= 704);
assert.ok(position.maxHeight >= 0);
});
test("floating surface remains bounded when its anchor is below the viewport", () => {
const position = computeFloatingPosition({
anchor: {
top: 1200,
right: 640,
bottom: 1246,
left: 320,
width: 320,
height: 46,
},
surfaceWidth: 320,
surfaceHeight: 500,
viewportWidth: 1280,
viewportHeight: 720,
viewportPadding: 8,
});
assert.ok(position.top >= 8);
assert.ok(position.top + Math.min(500, position.maxHeight) <= 712);
assert.ok(position.maxHeight <= 704);
});
test("dropdown scroll keeps portal geometry stable and contained", async () => {
const styles = await readFile(
new URL("../packages/ui-core/styles.css", import.meta.url),
"utf8",
);
const dropdownRule = styles.match(/\.nodedc-dropdown-surface \{(?<body>[\s\S]*?)\n\}/)?.groups?.body ?? "";
assert.match(dropdownRule, /box-sizing:\s*border-box;/);
assert.match(dropdownRule, /overflow:\s*auto;/);
assert.match(dropdownRule, /overscroll-behavior:\s*contain;/);
});