mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
refactor: rename tool display name to "PNG Transparency Fixer"
This commit is contained in:
+1
-1
@@ -257,7 +257,7 @@ Intelligently resizes images by removing or adding low-energy seams, preserving
|
|||||||
|
|
||||||
Max input edge before auto-downscaling: **1200 px**.
|
Max input edge before auto-downscaling: **1200 px**.
|
||||||
|
|
||||||
## Transparency Fixer
|
## PNG Transparency Fixer
|
||||||
|
|
||||||
**Function:** `fixTransparency`
|
**Function:** `fixTransparency`
|
||||||
**Tool route:** `transparency-fixer`
|
**Tool route:** `transparency-fixer`
|
||||||
|
|||||||
@@ -152,7 +152,7 @@ All AI tools run on your hardware (CPU or NVIDIA GPU). No internet required.
|
|||||||
| `restore-photo` | Photo Restoration | Multi-step pipeline | `mode` (auto/light/heavy), `scratchRemoval`, `faceEnhancement`, `fidelity`, `denoise`, `denoiseStrength`, `colorize` |
|
| `restore-photo` | Photo Restoration | Multi-step pipeline | `mode` (auto/light/heavy), `scratchRemoval`, `faceEnhancement`, `fidelity`, `denoise`, `denoiseStrength`, `colorize` |
|
||||||
| `passport-photo` | Passport Photo | MediaPipe landmarks | `country` (37 countries), `printLayout` (4x6/A4/none), `backgroundColor` |
|
| `passport-photo` | Passport Photo | MediaPipe landmarks | `country` (37 countries), `printLayout` (4x6/A4/none), `backgroundColor` |
|
||||||
| `content-aware-resize` | Content-Aware Resize | Seam carving (caire) | `width`, `height`, `protectFaces`, `blurRadius`, `sobelThreshold`, `square` |
|
| `content-aware-resize` | Content-Aware Resize | Seam carving (caire) | `width`, `height`, `protectFaces`, `blurRadius`, `sobelThreshold`, `square` |
|
||||||
| `transparency-fixer` | Transparency Fixer | BiRefNet HR-matting | `defringe` (0-100), `outputFormat` (png/webp) |
|
| `transparency-fixer` | PNG Transparency Fixer | BiRefNet HR-matting | `defringe` (0-100), `outputFormat` (png/webp) |
|
||||||
|
|
||||||
### Watermark & Overlay
|
### Watermark & Overlay
|
||||||
|
|
||||||
|
|||||||
@@ -71,7 +71,7 @@ pnpm dev
|
|||||||
| **Essentials** | Resize, Crop, Rotate & Flip, Convert, Compress |
|
| **Essentials** | Resize, Crop, Rotate & Flip, Convert, Compress |
|
||||||
| **Optimization** | Optimize for Web, Strip Metadata, Edit Metadata, Bulk Rename, Image to PDF, Favicon Generator |
|
| **Optimization** | Optimize for Web, Strip Metadata, Edit Metadata, Bulk Rename, Image to PDF, Favicon Generator |
|
||||||
| **Adjustments** | Adjust Colors, Sharpening, Replace Color |
|
| **Adjustments** | Adjust Colors, Sharpening, Replace Color |
|
||||||
| **AI Tools** | Remove Background, Upscale, Erase Object, OCR, Blur Faces, Smart Crop, Image Enhancement, Enhance Faces, Colorize, Noise Removal, Red Eye Removal, Restore Photo, Passport Photo, Content-Aware Resize, Transparency Fixer |
|
| **AI Tools** | Remove Background, Upscale, Erase Object, OCR, Blur Faces, Smart Crop, Image Enhancement, Enhance Faces, Colorize, Noise Removal, Red Eye Removal, Restore Photo, Passport Photo, Content-Aware Resize, PNG Transparency Fixer |
|
||||||
| **Watermark & Overlay** | Text Watermark, Image Watermark, Text Overlay, Image Composition |
|
| **Watermark & Overlay** | Text Watermark, Image Watermark, Text Overlay, Image Composition |
|
||||||
| **Utilities** | Image Info, Compare, Find Duplicates, Color Palette, QR Code Generator, Barcode Reader, Image to Base64 |
|
| **Utilities** | Image Info, Compare, Find Duplicates, Color Palette, QR Code Generator, Barcode Reader, Image to Base64 |
|
||||||
| **Layout** | Collage, Stitch, Split, Border & Frame |
|
| **Layout** | Collage, Stitch, Split, Border & Frame |
|
||||||
|
|||||||
@@ -239,7 +239,7 @@ const tools: { name: string; description: string; category: string; icon: Lucide
|
|||||||
icon: Scaling,
|
icon: Scaling,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "Transparency Fixer",
|
name: "PNG Transparency Fixer",
|
||||||
description: "Fix fake transparent PNGs with AI matting",
|
description: "Fix fake transparent PNGs with AI matting",
|
||||||
category: "ai",
|
category: "ai",
|
||||||
icon: Droplets,
|
icon: Droplets,
|
||||||
|
|||||||
@@ -243,7 +243,7 @@ export const TOOLS: Tool[] = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "transparency-fixer",
|
id: "transparency-fixer",
|
||||||
name: "Transparency Fixer",
|
name: "PNG Transparency Fixer",
|
||||||
description: "Fix fake transparent PNGs in one click",
|
description: "Fix fake transparent PNGs in one click",
|
||||||
category: "ai",
|
category: "ai",
|
||||||
icon: "Wand2",
|
icon: "Wand2",
|
||||||
|
|||||||
@@ -125,7 +125,7 @@ export const en = {
|
|||||||
"Create government-compliant passport, visa, and ID photos with auto face detection",
|
"Create government-compliant passport, visa, and ID photos with auto face detection",
|
||||||
},
|
},
|
||||||
"transparency-fixer": {
|
"transparency-fixer": {
|
||||||
name: "Transparency Fixer",
|
name: "PNG Transparency Fixer",
|
||||||
description: "Fix fake transparent PNGs in one click",
|
description: "Fix fake transparent PNGs in one click",
|
||||||
},
|
},
|
||||||
"watermark-text": { name: "Text Watermark", description: "Add text watermark overlay" },
|
"watermark-text": { name: "Text Watermark", description: "Add text watermark overlay" },
|
||||||
|
|||||||
@@ -835,10 +835,10 @@ test.describe("GUI AI Tools", () => {
|
|||||||
// ========================================================================
|
// ========================================================================
|
||||||
// TRANSPARENCY FIXER
|
// TRANSPARENCY FIXER
|
||||||
// ========================================================================
|
// ========================================================================
|
||||||
test.describe("Transparency Fixer", () => {
|
test.describe("PNG Transparency Fixer", () => {
|
||||||
test("renders tool page with dropzone", async ({ loggedInPage: page }) => {
|
test("renders tool page with dropzone", async ({ loggedInPage: page }) => {
|
||||||
await page.goto("/transparency-fixer");
|
await page.goto("/transparency-fixer");
|
||||||
await expect(page.getByText("Transparency Fixer").first()).toBeVisible();
|
await expect(page.getByText("PNG Transparency Fixer").first()).toBeVisible();
|
||||||
await expect(page.getByText("Upload from computer")).toBeVisible();
|
await expect(page.getByText("Upload from computer")).toBeVisible();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -41,7 +41,7 @@ const TOOLS_WITH_DROPZONE = [
|
|||||||
{ id: "vectorize", name: "Image to SVG" },
|
{ id: "vectorize", name: "Image to SVG" },
|
||||||
{ id: "gif-tools", name: "GIF" },
|
{ id: "gif-tools", name: "GIF" },
|
||||||
{ id: "noise-removal", name: "Noise Removal" },
|
{ id: "noise-removal", name: "Noise Removal" },
|
||||||
{ id: "transparency-fixer", name: "Transparency Fixer" },
|
{ id: "transparency-fixer", name: "PNG Transparency Fixer" },
|
||||||
];
|
];
|
||||||
|
|
||||||
const TOOLS_WITHOUT_DROPZONE = [{ id: "qr-generate", name: "QR Code" }];
|
const TOOLS_WITHOUT_DROPZONE = [{ id: "qr-generate", name: "QR Code" }];
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import path from "node:path";
|
|||||||
import { expect, isAiSidecarRunning, test } from "./helpers";
|
import { expect, isAiSidecarRunning, test } from "./helpers";
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// Transparency Fixer tool - e2e tests.
|
// PNG Transparency Fixer tool - e2e tests.
|
||||||
// Covers UI rendering, advanced settings, processing flow, and result display.
|
// Covers UI rendering, advanced settings, processing flow, and result display.
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
|
||||||
@@ -29,7 +29,7 @@ async function fixTransparencyAndWait(page: import("@playwright/test").Page) {
|
|||||||
await expect(page.getByTestId("transparency-fixer-submit")).toBeVisible({ timeout: 10_000 });
|
await expect(page.getByTestId("transparency-fixer-submit")).toBeVisible({ timeout: 10_000 });
|
||||||
}
|
}
|
||||||
|
|
||||||
test.describe("Transparency Fixer tool", () => {
|
test.describe("PNG Transparency Fixer tool", () => {
|
||||||
async function skipIfFeatureNotInstalled(page: import("@playwright/test").Page) {
|
async function skipIfFeatureNotInstalled(page: import("@playwright/test").Page) {
|
||||||
await page.goto("/transparency-fixer");
|
await page.goto("/transparency-fixer");
|
||||||
try {
|
try {
|
||||||
@@ -48,7 +48,7 @@ test.describe("Transparency Fixer tool", () => {
|
|||||||
await skipIfFeatureNotInstalled(page);
|
await skipIfFeatureNotInstalled(page);
|
||||||
|
|
||||||
// Tool title shown in the settings panel header
|
// Tool title shown in the settings panel header
|
||||||
await expect(page.getByText("Transparency Fixer")).toBeVisible();
|
await expect(page.getByText("PNG Transparency Fixer")).toBeVisible();
|
||||||
|
|
||||||
// Description text from the settings component
|
// Description text from the settings component
|
||||||
await expect(page.getByText("Upload a PNG with a fake transparent background")).toBeVisible();
|
await expect(page.getByText("Upload a PNG with a fake transparent background")).toBeVisible();
|
||||||
|
|||||||
@@ -89,7 +89,7 @@ async function postWithRawSettings(fileBuffer: Buffer, filename: string, rawSett
|
|||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
// Happy path
|
// Happy path
|
||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
describe("Transparency Fixer - Happy path", () => {
|
describe("PNG Transparency Fixer - Happy path", () => {
|
||||||
it("processes fake-transparency PNG with default settings", async () => {
|
it("processes fake-transparency PNG with default settings", async () => {
|
||||||
const res = await postTransparencyFixer(FAKE_TRANSPARENCY, "test-fake-transparency.png", {});
|
const res = await postTransparencyFixer(FAKE_TRANSPARENCY, "test-fake-transparency.png", {});
|
||||||
expect([200, 202, 501]).toContain(res.statusCode);
|
expect([200, 202, 501]).toContain(res.statusCode);
|
||||||
@@ -115,7 +115,7 @@ describe("Transparency Fixer - Happy path", () => {
|
|||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
// Advanced settings
|
// Advanced settings
|
||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
describe("Transparency Fixer - Advanced settings", () => {
|
describe("PNG Transparency Fixer - Advanced settings", () => {
|
||||||
it("accepts defringe at 0", async () => {
|
it("accepts defringe at 0", async () => {
|
||||||
const res = await postTransparencyFixer(PNG, "test.png", { defringe: 0 });
|
const res = await postTransparencyFixer(PNG, "test.png", { defringe: 0 });
|
||||||
expect([200, 202, 501]).toContain(res.statusCode);
|
expect([200, 202, 501]).toContain(res.statusCode);
|
||||||
@@ -140,7 +140,7 @@ describe("Transparency Fixer - Advanced settings", () => {
|
|||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
// Input format coverage
|
// Input format coverage
|
||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
describe("Transparency Fixer - Input format coverage", () => {
|
describe("PNG Transparency Fixer - Input format coverage", () => {
|
||||||
it("accepts JPEG input", async () => {
|
it("accepts JPEG input", async () => {
|
||||||
const res = await postTransparencyFixer(JPG, "photo.jpg", {});
|
const res = await postTransparencyFixer(JPG, "photo.jpg", {});
|
||||||
expect([200, 202, 501]).toContain(res.statusCode);
|
expect([200, 202, 501]).toContain(res.statusCode);
|
||||||
@@ -170,7 +170,7 @@ describe("Transparency Fixer - Input format coverage", () => {
|
|||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
// Error handling
|
// Error handling
|
||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
describe("Transparency Fixer - Error handling", () => {
|
describe("PNG Transparency Fixer - Error handling", () => {
|
||||||
it("rejects requests without a file", async () => {
|
it("rejects requests without a file", async () => {
|
||||||
const { body, contentType } = createMultipartPayload([
|
const { body, contentType } = createMultipartPayload([
|
||||||
{ name: "settings", content: JSON.stringify({}) },
|
{ name: "settings", content: JSON.stringify({}) },
|
||||||
@@ -237,7 +237,7 @@ describe("Transparency Fixer - Error handling", () => {
|
|||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
// Edge cases
|
// Edge cases
|
||||||
// ═══════════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════════
|
||||||
describe("Transparency Fixer - Edge cases", () => {
|
describe("PNG Transparency Fixer - Edge cases", () => {
|
||||||
it("handles 1x1 pixel image", async () => {
|
it("handles 1x1 pixel image", async () => {
|
||||||
const res = await postTransparencyFixer(TINY, "tiny.png", {});
|
const res = await postTransparencyFixer(TINY, "tiny.png", {});
|
||||||
expect([200, 202, 422, 501]).toContain(res.statusCode);
|
expect([200, 202, 422, 501]).toContain(res.statusCode);
|
||||||
|
|||||||
Reference in New Issue
Block a user