Keep where each divider was dragged to across a reload
A panel dragged wider was back at its first size after every reload. The sizes are now kept in the browser, next to the folded groups. - editor/panelSizes.ts holds one entry in localStorage, game-maker.panel-sizes: a name per divider and its width, height or share. - A panel reads its size once when it is built, held to the bounds its divider keeps today. Every drag writes the new size. - Kept are the columns left and right of the centre, the console, the split of the left column, the tilemap panel, the preview of the Shader, Particles and Pixel art tabs, each under its own name, and the split of the user management. - The sizes belong to the browser, not to the project. They hold for every project opened there. - A browser that refuses the storage, or holds rubbish under the entry, starts with the sizes the editor comes with. Tests: - Gate on melektaus-atx: 219 files, 3400 tests, CHECK EXIT 0. - Seven new unit tests in tests/editor/panel-sizes.test.ts. All five counter-probes bite. - Smokes on melektaus-atx: 24, 19 and 21, all pass. - One new e2e check in module 48: the left column dragged 40 px wider is as wide after a reload, and dragged back after. - Full suite on melektaus-atx: 1692 checks, all pass. It ran before the fix to the animation players of the commit before last. - Browser counter-probe: without the write to the browser exactly that check fails. - Only the left column is measured across a reload. The other dividers go the same way and have no check of their own. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
8f9d373d7b
commit
ca5b2db449
10 files changed
+201
-12
No files matched your search
@@ -0,0 +1,88 @@
|
||||
/** The sizes the dividers were dragged to, kept in the browser: what is written, read back and refused. */
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { keepPanelSize, panelSize, resetPanelSizes } from '../../src/editor/panelSizes';
|
||||
|
||||
const STORAGE_KEY = 'game-maker.panel-sizes';
|
||||
|
||||
function memoryStore(initial: Record<string, string> = {}) {
|
||||
const items = new Map(Object.entries(initial));
|
||||
return {
|
||||
items,
|
||||
getItem: (key: string) => items.get(key) ?? null,
|
||||
setItem: (key: string, value: string) => void items.set(key, value),
|
||||
};
|
||||
}
|
||||
|
||||
describe('the memory of panel sizes', () => {
|
||||
beforeEach(() => resetPanelSizes());
|
||||
afterEach(() => {
|
||||
vi.unstubAllGlobals();
|
||||
resetPanelSizes();
|
||||
});
|
||||
|
||||
it('starts a panel at its own size where nothing was kept', () => {
|
||||
vi.stubGlobal('window', { localStorage: memoryStore() });
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(250);
|
||||
});
|
||||
|
||||
it('writes a size to the browser and reads it back on a new page', () => {
|
||||
const store = memoryStore();
|
||||
vi.stubGlobal('window', { localStorage: store });
|
||||
keepPanelSize('left', 320);
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(320);
|
||||
resetPanelSizes();
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(320);
|
||||
expect(JSON.parse(store.items.get(STORAGE_KEY) ?? '')).toEqual({ left: 320 });
|
||||
});
|
||||
|
||||
it('keeps every panel under its own name', () => {
|
||||
const store = memoryStore();
|
||||
vi.stubGlobal('window', { localStorage: store });
|
||||
keepPanelSize('right', 410);
|
||||
keepPanelSize('console', 120);
|
||||
keepPanelSize('right', 430);
|
||||
resetPanelSizes();
|
||||
expect(panelSize('right', 350, 200, 600)).toBe(430);
|
||||
expect(panelSize('console', 300, 28, 600)).toBe(120);
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(250);
|
||||
expect(JSON.parse(store.items.get(STORAGE_KEY) ?? '')).toEqual({ console: 120, right: 430 });
|
||||
});
|
||||
|
||||
it('holds a kept size to the bounds the divider keeps today', () => {
|
||||
vi.stubGlobal('window', {
|
||||
localStorage: memoryStore({ [STORAGE_KEY]: JSON.stringify({ left: 9000, right: 3, share: 0.5 }) }),
|
||||
});
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(500);
|
||||
expect(panelSize('right', 350, 200, 600)).toBe(200);
|
||||
expect(panelSize('share', 0.6, 0.15, 0.85)).toBe(0.5);
|
||||
});
|
||||
|
||||
it('reads rubbish as nothing', () => {
|
||||
for (const rubbish of ['{broken', '[300]', '"wide"', 'null', '{"left":"300","right":null}']) {
|
||||
resetPanelSizes();
|
||||
vi.stubGlobal('window', { localStorage: memoryStore({ [STORAGE_KEY]: rubbish }) });
|
||||
expect(panelSize('left', 250, 160, 500), rubbish).toBe(250);
|
||||
expect(panelSize('right', 350, 200, 600), rubbish).toBe(350);
|
||||
}
|
||||
});
|
||||
|
||||
it('remembers for the page where the browser gives no storage', () => {
|
||||
keepPanelSize('left', 300);
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(300);
|
||||
resetPanelSizes();
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(250);
|
||||
});
|
||||
|
||||
it('remembers for the page where the browser refuses to write', () => {
|
||||
vi.stubGlobal('window', {
|
||||
localStorage: {
|
||||
getItem: () => null,
|
||||
setItem: () => {
|
||||
throw new Error('quota');
|
||||
},
|
||||
},
|
||||
});
|
||||
expect(() => keepPanelSize('left', 300)).not.toThrow();
|
||||
expect(panelSize('left', 250, 160, 500)).toBe(300);
|
||||
});
|
||||
});
|
||||
Reference in new issue
Block a user