import { jsx } from "react/jsx-runtime";import { renderToStaticMarkup } from "react-dom/server";import { describe, expect, it } from "vite-plus/test";import { getPreviewPanelMaxWidth, PreviewPanelShell } from "./PreviewPanelShell";describe("getPreviewPanelMaxWidth", () => { it("allows the panel to use 70% of an ultra-wide viewport without a pixel ceiling", () => { expect(getPreviewPanelMaxWidth(6_000)).toBe(4_200); }); it("rounds fractional CSS pixels down", () => { expect(getPreviewPanelMaxWidth(2_001)).toBe(1_400); }); it("keeps inline panels inside their containing workspace", () => { const markup = renderToStaticMarkup( jsx(PreviewPanelShell, { mode: "inline", defaultWidth: 1_000, children: "Panel" }), ); expect(markup).toContain("max-w-full"); }); it("reserves the sibling column minimum when the flex row is known", () => { // Fullscreen 14" MacBook: viewport 1512, sidebar ~256 → row of 1256. // The 70% fraction (1058) would leave the chat column only ~198px; // the container clamp caps the panel at 1256 − 360 instead. expect(getPreviewPanelMaxWidth(1_512, 1_256)).toBe(896); }); it("keeps the fraction cap when the row is wide enough for both columns", () => { expect(getPreviewPanelMaxWidth(3_000, 2_900)).toBe(2_100); }); it("rounds fractional row widths down", () => { expect(getPreviewPanelMaxWidth(1_512, 1_256.6)).toBe(896); }); it("never drops below the panel minimum when the row cannot fit both columns", () => { // ~1000px window with an expanded sidebar → row of 700. The sibling // reservation (700 − 360 = 340) would undercut the panel's own 360 // minimum and invert the resize clamp, so the floor wins. expect(getPreviewPanelMaxWidth(1_000, 700)).toBe(360); }); it("stays at the panel minimum even when the row is narrower than the reservation", () => { expect(getPreviewPanelMaxWidth(1_512, 300)).toBe(360); });});
import { jsx } from "react/jsx-runtime";
import { renderToStaticMarkup } from "react-dom/server";
import { describe, expect, it } from "vite-plus/test";
import { getPreviewPanelMaxWidth, PreviewPanelShell } from "./PreviewPanelShell";
describe("getPreviewPanelMaxWidth", () => {
it("allows the panel to use 70% of an ultra-wide viewport without a pixel ceiling", () => {
expect(getPreviewPanelMaxWidth(6_000)).toBe(4_200);
});
it("rounds fractional CSS pixels down", () => {
expect(getPreviewPanelMaxWidth(2_001)).toBe(1_400);
});
it("keeps inline panels inside their containing workspace", () => {
const markup = renderToStaticMarkup(
jsx(PreviewPanelShell, { mode: "inline", defaultWidth: 1_000, children: "Panel" }),
);
expect(markup).toContain("max-w-full");
});
it("reserves the sibling column minimum when the flex row is known", () => {
// Fullscreen 14" MacBook: viewport 1512, sidebar ~256 → row of 1256.
// The 70% fraction (1058) would leave the chat column only ~198px;
// the container clamp caps the panel at 1256 − 360 instead.
expect(getPreviewPanelMaxWidth(1_512, 1_256)).toBe(896);
});
it("keeps the fraction cap when the row is wide enough for both columns", () => {
expect(getPreviewPanelMaxWidth(3_000, 2_900)).toBe(2_100);
});
it("rounds fractional row widths down", () => {
expect(getPreviewPanelMaxWidth(1_512, 1_256.6)).toBe(896);
});
it("never drops below the panel minimum when the row cannot fit both columns", () => {
// ~1000px window with an expanded sidebar → row of 700. The sibling
// reservation (700 − 360 = 340) would undercut the panel's own 360
// minimum and invert the resize clamp, so the floor wins.
expect(getPreviewPanelMaxWidth(1_000, 700)).toBe(360);
});
it("stays at the panel minimum even when the row is narrower than the reservation", () => {
expect(getPreviewPanelMaxWidth(1_512, 300)).toBe(360);
});
});