External/SnapOtter
1
0
Fork 0
mirror of https://github.com/snapotter-hq/SnapOtter.git synced 2026-08-03 07:46:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(pdf-to-image): redesign with thumbnails, page selection, color mode, and expanded formats

Browse Source 
- Add preview endpoint for page thumbnails with clickable selection
- Add 8 output formats (PNG, JPEG, WebP, AVIF, TIFF, GIF, HEIC, HEIF)
- Add quality slider for lossy formats, color mode (Color/Grayscale/B&W)
- Add custom DPI input (36-1200) alongside preset buttons
- Replace reply.hijack() ZIP streaming with JSON response + server-side ZIP
- Add dedicated Zustand store with bidirectional page range sync
- Add ResultsPanel with per-page download, format/size badges
- Update integration tests (16 cases) and e2e tests (3 cases)
This commit is contained in:
Siddharth Kumar Sah
2026-04-13 13:43:07 +08:00
parent df372ee1ca
commit d9704fda82
7 changed files with 1035 additions and 270 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/e2e/pdf-to-image.spec.ts
+38 -8
View File
@@ -4,17 +4,29 @@ import { expect, test, waitForProcessing } from "./helpers";
const PDF_FIXTURE = path.join(process.cwd(), "tests", "fixtures", "test-3page.pdf");
test.describe("PDF to Image tool", () => {
test("converts a PDF page to an image", async ({ loggedInPage: page }) => {
test("shows page thumbnails after uploading a PDF", async ({ loggedInPage: page }) => {
await page.goto("/pdf-to-image");
// Upload PDF via file input
const fileInput = page.locator("input[type='file'][accept='application/pdf']");
await fileInput.setInputFiles(PDF_FIXTURE);
// Wait for page count to appear in the file info area
await expect(page.locator(".bg-muted").getByText("3 pages")).toBeVisible({ timeout: 10_000 });
// Wait for page count to appear
await expect(page.locator(".bg-muted").getByText("3 pages")).toBeVisible({ timeout: 15_000 });
// Set pages to just page 1 for a single-image response
// Wait for thumbnails to appear in the results panel
await expect(page.locator("text=3 of 3 pages selected")).toBeVisible({ timeout: 15_000 });
});
test("converts a PDF page to an image and shows results", async ({ loggedInPage: page }) => {
await page.goto("/pdf-to-image");
// Upload PDF
const fileInput = page.locator("input[type='file'][accept='application/pdf']");
await fileInput.setInputFiles(PDF_FIXTURE);
await expect(page.locator(".bg-muted").getByText("3 pages")).toBeVisible({ timeout: 15_000 });
// Set pages to just page 1
await page.fill("#pdf-pages", "1");
// Click convert
@@ -24,9 +36,27 @@ test.describe("PDF to Image tool", () => {
await waitForProcessing(page);
// Verify download link appears
await expect(page.getByTestId("pdf-to-image-download")).toBeVisible({
timeout: 15_000,
});
await expect(page.getByTestId("pdf-to-image-download")).toContainText("Download Image");
await expect(page.getByTestId("pdf-to-image-download")).toBeVisible({ timeout: 15_000 });
await expect(page.getByTestId("pdf-to-image-download")).toContainText("Download All");
// Verify results panel shows converted page
await expect(page.locator("text=1 page converted")).toBeVisible();
});
test("can select and deselect pages via thumbnails", async ({ loggedInPage: page }) => {
await page.goto("/pdf-to-image");
// Upload PDF
const fileInput = page.locator("input[type='file'][accept='application/pdf']");
await fileInput.setInputFiles(PDF_FIXTURE);
await expect(page.locator("text=3 of 3 pages selected")).toBeVisible({ timeout: 15_000 });
// Click "Deselect All"
await page.locator("text=Deselect All").click();
await expect(page.locator("text=0 of 3 pages selected")).toBeVisible();
// Click "Select All"
await page.locator("text=Select All").click();
await expect(page.locator("text=3 of 3 pages selected")).toBeVisible();
});
});