mirror of
https://github.com/Ark0N/Codeman.git
synced 2026-10-20 09:09:35 +02:00
fix(test): build a genuinely short Run menu instead of assuming the stock one fits
The nightly browser suite failed in run-mode-menu-scroll: the short-menu case opened the stock menu and asserted it needs no scrollbar on a 390x640 phone. The GitHub Copilot entry made the stock CLI list eleven rows, 562px of content against a 538px cap, so the menu now scrolls there, which is the cap-and-scroll behaviour the CSS is written for (and what the other two cases verify). Every further CLI would have broken the same assumption again. The case now hides the whole CLI block (the container, since its buttons are rebuilt from the registry) and also checks the "not stretched" half of its name: the border-box height must stay under max-height. clientHeight would not do, since it leaves out the border and a menu stretched to its cap reads just under it. Visible side effect worth knowing: on a phone about 640px tall the stock Run dropdown now scrolls by roughly one row. At 900px it fits (564px) unscrolled. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
e63bb65b36
commit
6e7dee75eb
1 file changed
+19
-2
@@ -5,6 +5,10 @@
|
|||||||
* Before the fix the menu (anchored `bottom: 100%`) had no max-height and no overflow, so with
|
* Before the fix the menu (anchored `bottom: 100%`) had no max-height and no overflow, so with
|
||||||
* enough entries its top ran off the top of the screen and could not be scrolled to.
|
* enough entries its top ran off the top of the screen and could not be scrolled to.
|
||||||
*
|
*
|
||||||
|
* The stock CLI list alone outgrows this 640px-tall phone (eleven entries since GitHub Copilot),
|
||||||
|
* so the short-menu case hides the whole CLI block rather than assuming the stock menu fits:
|
||||||
|
* every new CLI would otherwise break that assumption again.
|
||||||
|
*
|
||||||
* Browser-driven, so excluded from `npm run test:ci` (config/test-suites.ts). Run locally:
|
* Browser-driven, so excluded from `npm run test:ci` (config/test-suites.ts). Run locally:
|
||||||
* npm run test:browser -- test/run-mode-menu-scroll.browser.test.ts
|
* npm run test:browser -- test/run-mode-menu-scroll.browser.test.ts
|
||||||
*
|
*
|
||||||
@@ -69,6 +73,7 @@ describe('Run dropdown on a phone', () => {
|
|||||||
scrollHeight: menu.scrollHeight,
|
scrollHeight: menu.scrollHeight,
|
||||||
clientHeight: menu.clientHeight,
|
clientHeight: menu.clientHeight,
|
||||||
viewport: window.innerHeight,
|
viewport: window.innerHeight,
|
||||||
|
maxHeight: parseFloat(getComputedStyle(menu).maxHeight),
|
||||||
overflowY: getComputedStyle(menu).overflowY,
|
overflowY: getComputedStyle(menu).overflowY,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
@@ -118,11 +123,23 @@ describe('Run dropdown on a phone', () => {
|
|||||||
|
|
||||||
it('a short menu is not stretched or squashed (no scrollbar when it fits)', async () => {
|
it('a short menu is not stretched or squashed (no scrollbar when it fits)', async () => {
|
||||||
await openWithEntries(0);
|
await openWithEntries(0);
|
||||||
|
// Hide the container, not its buttons: those are rebuilt from the registry and would lose a
|
||||||
|
// per-button style on the next render.
|
||||||
await page.evaluate(() => {
|
await page.evaluate(() => {
|
||||||
|
document.getElementById('runModeCliOptions')!.style.display = 'none';
|
||||||
document.getElementById('runModeCustomModelSep')!.style.display = 'none';
|
document.getElementById('runModeCustomModelSep')!.style.display = 'none';
|
||||||
document.getElementById('runModeCustomModelHeader')!.style.display = 'none';
|
document.getElementById('runModeCustomModelHeader')!.style.display = 'none';
|
||||||
});
|
});
|
||||||
const g = await geometry();
|
try {
|
||||||
expect(g.scrollHeight).toBeLessThanOrEqual(g.clientHeight + 1);
|
const g = await geometry();
|
||||||
|
// Border-box height: clientHeight leaves out the border, so a menu stretched to its cap
|
||||||
|
// would still read just under it.
|
||||||
|
expect(g.bottom - g.top).toBeLessThan(g.maxHeight); // not stretched to its cap
|
||||||
|
expect(g.scrollHeight).toBeLessThanOrEqual(g.clientHeight + 1); // not squashed into a scrollbar
|
||||||
|
} finally {
|
||||||
|
await page.evaluate(() => {
|
||||||
|
document.getElementById('runModeCliOptions')!.style.display = '';
|
||||||
|
});
|
||||||
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
Reference in new issue
Block a user