puter/paseo
1
0
Fork 0
mirror of https://github.com/getpaseo/paseo.git synced 2026-11-08 09:24:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

test(app): scope queued image loads to their file pane

Browse Source
This commit is contained in:
paseo-bot[bot]
2026-11-08 08:02:13 +00:00
parent 858cd5511e
commit d0876e032f
2 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/app/e2e/browser/file-editing.spec.ts
+2 -2
View File
@@ -766,7 +766,7 @@ test.describe("CodeMirror workspace file editing", () => {
await openWorkspaceFile(page, "pixel.png"); await openWorkspaceFile(page, "pixel.png");
const image = visibleFilePane.locator("img"); const image = visibleFilePane.locator("img");
await expect(image).toBeVisible(); await expect(image).toBeVisible();
const imageCanvas = page.getByTestId("image-file-preview-canvas"); const imageCanvas = visibleFilePane.getByTestId("image-file-preview-canvas");
await expect(imageCanvas).toBeVisible(); await expect(imageCanvas).toBeVisible();
await imageCanvas.hover(); await imageCanvas.hover();
const transformedContent = imageCanvas.locator(":scope > div").first(); const transformedContent = imageCanvas.locator(":scope > div").first();
@@ -791,7 +791,7 @@ test.describe("CodeMirror workspace file editing", () => {
width: element.naturalWidth, width: element.naturalWidth,
height: element.naturalHeight, height: element.naturalHeight,
})); }));
const pendingLoad = await holdNextPreviewLoad(page, oldSource.url); const pendingLoad = await holdNextPreviewLoad(visibleFilePane, oldSource.url);
try { try {
await writeFile( await writeFile(
path.join(workspace.repoPath, "shape.svg"), path.join(workspace.repoPath, "shape.svg"),
packages/app/e2e/support/helpers/image-preview.ts
+5 -5
View File
@@ -1,12 +1,12 @@
import { expect, type Page } from "@playwright/test"; import { expect, type Locator } from "@playwright/test";
function isReady(value: { ready(): boolean }): boolean { function isReady(value: { ready(): boolean }): boolean {
return value.ready(); return value.ready();
} }
/** Replay a queued native load payload after a real file refresh, through the image's load event. */ /** Replay a queued native load payload after a real file refresh, through the image's load event. */
export async function holdNextPreviewLoad(page: Page, previousUrl: string) { export async function holdNextPreviewLoad(pane: Locator, previousUrl: string) {
const pending = await page.evaluateHandle((oldUrl: string) => { const pending = await pane.evaluateHandle((container, oldUrl: string) => {
let image: HTMLImageElement | null = null; let image: HTMLImageElement | null = null;
let holding = true; let holding = true;
const hold = (event: Event) => { const hold = (event: Event) => {
@@ -14,7 +14,7 @@ export async function holdNextPreviewLoad(page: Page, previousUrl: string) {
}; };
const observer = new MutationObserver(() => { const observer = new MutationObserver(() => {
if (image) return; if (image) return;
const candidates = document.querySelectorAll<HTMLImageElement>( const candidates = container.querySelectorAll<HTMLImageElement>(
'[data-testid="image-file-preview-image"] img', '[data-testid="image-file-preview-image"] img',
); );
const next = Array.from(candidates).find((candidate) => candidate.src !== oldUrl); const next = Array.from(candidates).find((candidate) => candidate.src !== oldUrl);
@@ -23,7 +23,7 @@ export async function holdNextPreviewLoad(page: Page, previousUrl: string) {
image.addEventListener("load", hold, true); image.addEventListener("load", hold, true);
observer.disconnect(); observer.disconnect();
}); });
observer.observe(document.body, { subtree: true, childList: true, attributes: true }); observer.observe(container, { subtree: true, childList: true, attributes: true });
return { return {
ready: () => image !== null && image.complete && image.naturalWidth > 0, ready: () => image !== null && image.complete && image.naturalWidth > 0,
deliver(source: { url: string; width: number; height: number }) { deliver(source: { url: string; width: number; height: number }) {