test: add e2e test, add manual test checklist

2026-09-14 13:36:36 +00:00 · 2026-09-08 11:03:05 +05:00
parent 9a7b7c178b
commit 3f21f1c024
18 changed files with 937 additions and 11 deletions
@@ -0,0 +1,114 @@
+import { expect, test } from "playwright/test";
+import {
+	opaquePng,
+	landscapePng,
+	onePixelPng,
+	largePng,
+	corruptPng,
+} from "./helpers/fixtures";
+import {
+	trackErrors,
+	openTool,
+	uploadImage,
+	metaValue,
+	suggestedDownloadName,
+	expectNoErrorAlert,
+	expectNoErrors,
+} from "./helpers/page";
+
+test("flip-png: full flow — upload, result, meta, download", async ({
+	page,
+}) => {
+	const sink = trackErrors(page);
+	await openTool(page, "flip-png");
+	await uploadImage(page, landscapePng);
+	await expect(page.locator('img[alt="result"]')).toBeVisible();
+	await expect(page.locator('img[alt="result"]')).toHaveAttribute(
+		"src",
+		/^(blob:|data:image\/png;base64,)/,
+	);
+	const resultMeta = await metaValue(page, "RESULT");
+	expect(resultMeta).toBe("64 × 16 px");
+	const downloadName = await suggestedDownloadName(
+		page,
+		'button[aria-label="Download result"]',
+	);
+	expect(downloadName).toBe("flip-png.png");
+	await expectNoErrorAlert(page);
+	expectNoErrors(sink);
+});
+
+test("convert-png-to-jpg: produces a downloadable jpg", async ({ page }) => {
+	const sink = trackErrors(page);
+	await openTool(page, "convert-png-to-jpg");
+	await uploadImage(page, opaquePng);
+	await expect(page.locator('img[alt="result"]')).toBeVisible();
+	const downloadName = await suggestedDownloadName(
+		page,
+		'button[aria-label="Download result"]',
+	);
+	expect(downloadName).toBe("convert-png-to-jpg.jpg");
+	await expectNoErrorAlert(page);
+	expectNoErrors(sink);
+});
+
+test("reset clears result but keeps source", async ({ page }) => {
+	await openTool(page, "flip-png");
+	await uploadImage(page, opaquePng);
+	await expect(page.locator('img[alt="result"]')).toBeVisible();
+	await page.getByRole("button", { name: "Reset" }).click();
+	await expect(page.locator('img[alt="result"]')).toHaveCount(0);
+	await expect(page.locator(".empty")).toContainText("no result yet");
+	await expect(page.locator('img[alt="source"]')).toBeVisible();
+});
+
+test("blur: changing slider updates result image", async ({ page }) => {
+	await openTool(page, "blur-png");
+	await uploadImage(page, opaquePng);
+	await expect(page.locator('img[alt="result"]')).toBeVisible();
+	const src1 = await page.locator('img[alt="result"]').getAttribute("src");
+	await expect(async () => {
+		await page.locator('input[type="range"]').fill("20");
+		await expect(page.locator('img[alt="result"]')).not.toHaveAttribute(
+			"src",
+			src1 ?? "",
+		);
+	}).toPass();
+});
+
+test("runs without Web Worker (fallback)", async ({ browser }) => {
+	const context = await browser.newContext();
+	await context.addInitScript(() => {
+		Object.defineProperty(window, "Worker", {
+			value: undefined,
+			configurable: true,
+		});
+	});
+	const page = await context.newPage();
+	const sink = trackErrors(page);
+	await openTool(page, "flip-png");
+	await uploadImage(page, landscapePng);
+	await expect(page.locator('img[alt="result"]')).toBeVisible();
+	await expectNoErrorAlert(page);
+	expectNoErrors(sink);
+	await context.close();
+});
+
+test("invalid file upload shows error, no crash", async ({ page }) => {
+	const sink = trackErrors(page);
+	await openTool(page, "flip-png");
+	await uploadImage(page, corruptPng);
+	await expect(page.locator('[role="alert"]')).toBeVisible();
+	await expect(page.locator('img[alt="result"]')).toHaveCount(0);
+	expectNoErrors(sink);
+});
+
+for (const fixture of [onePixelPng, largePng]) {
+	test(`handles ${fixture.name} correctly`, async ({ page }) => {
+		const sink = trackErrors(page);
+		await openTool(page, "flip-png");
+		await uploadImage(page, fixture);
+		await expect(page.locator('img[alt="result"]')).toBeVisible();
+		expectNoErrors(sink);
+	});
+}