Load every picture of a project ahead so animated tiles don't flicker
A texture was fetched only when it was drawn for the first time. Until the file arrived, the tilemap skipped the cell for that frame. An animated tile whose next step sat in another picture therefore blinked away once on its first cycle, and sprite animations did the same. - FileLibrary gets preload(files). It requests every file that is not held, loading or known to have failed. Each library reports what it holds through holds(). - src/core/model/projectFiles.ts lists the files a project names per library: uploaded textures, fonts and pixel art cels. - App.ts runs the preload on every project event. That covers opening a project, new assets and edits from a collaborator. - A new test hook __gm.heldPictures() reports which textures of the project are in memory. Not done on purpose: - The tilemap keeps no fallback frame while a step is still loading. - Sounds still load on first play. Not checked: the flicker itself was not reproduced in the browser, the e2e check measures "held in memory". Modules 42, 44 and 47 read textures from the project and were not run locally. Tests: - ./check.sh: 174 files, 2518 tests, CHECK EXIT 0 - e2e 39 + 40: ALL PASSED, 96 checks - 3 new unit tests for preload and the project file list - New e2e check 40k-ii: an unplaced picture is held after a reload - Counter-probe: without the preload 40k-ii fails with "Autotiles: held false, unworn: held false" Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
6015869297
commit
7e829f737e
11 files changed
+190
-2
No files matched your search
@@ -962,6 +962,19 @@ export async function tilemap(t) {
|
||||
const inMemory = await json(
|
||||
`__gm.state.project.assets.find((a) => a.id === ${JSON.stringify(made.id)}).layers.map((l) => l.cells)`,
|
||||
);
|
||||
// For 40k-ii: a picture of its own that nothing wears, so only loading ahead can bring it in.
|
||||
await evaluate(`(async () => {
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.width = canvas.height = 8;
|
||||
const g = canvas.getContext('2d');
|
||||
g.fillStyle = 'rgb(201, 17, 99)';
|
||||
g.fillRect(0, 0, 8, 8);
|
||||
const blob = await new Promise((resolve) => canvas.toBlob(resolve, 'image/png'));
|
||||
const transfer = new DataTransfer();
|
||||
transfer.items.add(new File([blob], 'unworn.png', { type: 'image/png' }));
|
||||
window.dispatchEvent(new ClipboardEvent('paste', { clipboardData: transfer, bubbles: true }));
|
||||
})()`);
|
||||
await t.sleep(2500);
|
||||
await saved();
|
||||
const storedMap = (await api(`projects/${projectId}`)).project.assets.find((a) => a.id === made.id);
|
||||
const storedLayers = storedMap?.layers ?? [];
|
||||
@@ -984,6 +997,20 @@ export async function tilemap(t) {
|
||||
JSON.stringify({ reloaded, inMemory }),
|
||||
);
|
||||
|
||||
// 40k-ii. Every picture the project names is loaded right after opening, not on its first draw:
|
||||
// a tile stepping to a picture fetched only then blinked out once. "unworn" was pasted
|
||||
// above and is placed nowhere.
|
||||
let pictures = await json('__gm.heldPictures()');
|
||||
for (let i = 0; i < 20 && !pictures.every((p) => p.held); i++) {
|
||||
await t.sleep(150);
|
||||
pictures = await json('__gm.heldPictures()');
|
||||
}
|
||||
check(
|
||||
'every picture of the project is in memory after opening, drawn anywhere or not',
|
||||
pictures.some((p) => p.name === 'unworn') && pictures.every((p) => p.held),
|
||||
JSON.stringify(pictures),
|
||||
);
|
||||
|
||||
// 40l. Collision (#132). The switch sits on the tile, and the map outlines where it now blocks.
|
||||
// The map holds a 3 × 3 block and, on the second layer, one cell at (4, 0).
|
||||
await openTab(t, 'scene');
|
||||
|
||||
Reference in new issue
Block a user