Spaces:
Running
Running
File size: 2,772 Bytes
d0878a6 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 | import {
computeLayout,
PREFERRED_SLIDE,
MIN_SLIDE,
CONTROLS_W,
GAP,
MAX_VISIBLE,
} from './advisorCarouselLayout';
function totalWidth(layout) {
const reserved = layout.controlsMode === 'side' ? CONTROLS_W : 0;
return layout.cardsWidth + reserved;
}
describe('computeLayout', () => {
test('shows three preferred cards when the shell is wide enough', () => {
const L = computeLayout(1600, 3);
expect(L.visible).toBe(3);
expect(L.controlsMode).toBe('none');
expect(L.slideW).toBe(PREFERRED_SLIDE);
expect(totalWidth(L)).toBeLessThanOrEqual(1600);
});
test('shows two preferred cards with side arrows in a typical 1280 chat pane', () => {
// ~1280 viewport minus ~300 sidebar minus ~40 messages-scroll padding
const L = computeLayout(940, 3);
expect(L.visible).toBe(2);
expect(L.controlsMode).toBe('side');
expect(L.slideW).toBe(PREFERRED_SLIDE);
expect(totalWidth(L)).toBeLessThanOrEqual(940);
});
test('does not claim three 400px cards when they cannot fit', () => {
const width = 3 * PREFERRED_SLIDE + 2 * GAP - 1; // 1231
const L = computeLayout(width, 3);
expect(L.visible).toBeLessThan(3);
expect(L.controlsMode).not.toBe('none');
expect(totalWidth(L)).toBeLessThanOrEqual(width);
});
test('overlays arrows to keep three preferred cards when side controls do not fit', () => {
const width = 3 * PREFERRED_SLIDE + 2 * GAP + 10; // 1242: 3 cards fit, 3+side do not
const L = computeLayout(width, 4);
expect(L.visible).toBe(3);
expect(L.controlsMode).toBe('overlay');
expect(L.slideW).toBe(PREFERRED_SLIDE);
expect(totalWidth(L)).toBeLessThanOrEqual(width);
});
test('falls back to min-size cards rather than clipping', () => {
const L = computeLayout(700, 3);
expect(L.visible).toBe(2);
expect(L.slideW).toBeGreaterThanOrEqual(MIN_SLIDE);
expect(L.slideW).toBeLessThan(PREFERRED_SLIDE);
expect(totalWidth(L)).toBeLessThanOrEqual(700);
});
test('never shows more than three cards', () => {
const L = computeLayout(2400, 6);
expect(L.visible).toBe(MAX_VISIBLE);
expect(L.controlsMode).toBe('side');
});
test('keeps arrows when more cards exist than are visible', () => {
const L = computeLayout(500, 3);
expect(L.visible).toBe(1);
expect(L.controlsMode).toMatch(/side|overlay|below/);
expect(totalWidth(L)).toBeLessThanOrEqual(500);
});
test('narrow pane overlays or stacks controls instead of overflowing', () => {
const L = computeLayout(320, 3);
expect(L.visible).toBe(1);
expect(L.controlsMode).toMatch(/overlay|below|side/);
expect(totalWidth(L)).toBeLessThanOrEqual(320);
});
});
|