mirror of
https://github.com/Ku6epXBOCTuK/easy-png-tools.git
synced 2026-11-13 17:08:20 +00:00
test: less fragile - use semantic locators\helpers
This commit is contained in:
@@ -10,10 +10,18 @@ import {
|
||||
expectNoErrorAlert,
|
||||
expectNoErrors,
|
||||
openTool,
|
||||
resultImage,
|
||||
trackErrors,
|
||||
uploadImage,
|
||||
verdictStatus,
|
||||
} from "./helpers/page";
|
||||
|
||||
async function expectVerdict(page: Parameters<typeof verdictStatus>[0]) {
|
||||
const verdict = verdictStatus(page);
|
||||
await expect(verdict).toBeVisible();
|
||||
await expect(verdict).toHaveText(/\S/);
|
||||
}
|
||||
|
||||
for (const [id, input] of [
|
||||
["base64-to-png", tinyBase64],
|
||||
["hex-to-png", "ff0000ff"],
|
||||
@@ -26,11 +34,11 @@ for (const [id, input] of [
|
||||
] as const) {
|
||||
test(`text input → ${id} produces result image`, async ({ page }) => {
|
||||
const sink = trackErrors(page);
|
||||
await openTool(page, id);
|
||||
await expect(async () => {
|
||||
await openTool(page, id);
|
||||
await page.locator(".text-source textarea").fill(input);
|
||||
await page.getByRole("textbox", { name: "Text data" }).fill(input);
|
||||
await page.getByRole("button", { name: "Render text" }).click();
|
||||
await expect(page.locator('img[alt="Result image"]')).toBeVisible();
|
||||
await expect(resultImage(page)).toBeVisible();
|
||||
}).toPass({ timeout: 25_000 });
|
||||
await expectNoErrorAlert(page);
|
||||
expectNoErrors(sink);
|
||||
@@ -41,62 +49,61 @@ test("png-to-base64 shows decoded text result", async ({ page }) => {
|
||||
const sink = trackErrors(page);
|
||||
await openTool(page, "png-to-base64");
|
||||
await uploadImage(page, opaquePng);
|
||||
const code = page.locator(".result-pre code");
|
||||
await expect(code).toBeVisible();
|
||||
const text = (await code.textContent()) ?? "";
|
||||
expect(text.length).toBeGreaterThan(20);
|
||||
const output = page.getByLabel("Text result");
|
||||
await expect(output).toBeVisible();
|
||||
await expect(output).toHaveText(/\S/);
|
||||
await expectNoErrorAlert(page);
|
||||
expectNoErrors(sink);
|
||||
});
|
||||
|
||||
for (const [input, expected] of [
|
||||
[tinyBase64, "Yes — this is a valid PNG signature."],
|
||||
["aGVsbG8=", "No — the signature does not match a PNG file."],
|
||||
] as const) {
|
||||
test(`verify-is-png verdict: ${expected}`, async ({ page }) => {
|
||||
await expect(async () => {
|
||||
await openTool(page, "verify-is-png");
|
||||
await page.locator(".text-source textarea").fill(input);
|
||||
await page.getByRole("button", { name: "Render text" }).click();
|
||||
await expect(page.locator(".verdict-text")).toContainText(expected);
|
||||
}).toPass({ timeout: 25_000 });
|
||||
});
|
||||
}
|
||||
test("verify-is-png renders different verdicts for valid and invalid input", async ({
|
||||
page,
|
||||
}) => {
|
||||
await openTool(page, "verify-is-png");
|
||||
const input = page.getByRole("textbox", { name: "Text data" });
|
||||
const render = page.getByRole("button", { name: "Render text" });
|
||||
const verdict = verdictStatus(page);
|
||||
|
||||
test("png-is-transparent: opaque image → 'No'", async ({ page }) => {
|
||||
await openTool(page, "png-is-transparent");
|
||||
await uploadImage(page, opaquePng);
|
||||
await expect(page.locator(".verdict-text")).toContainText(
|
||||
"No — all pixels are fully opaque.",
|
||||
);
|
||||
await input.fill(tinyBase64);
|
||||
await render.click();
|
||||
await expect(verdict).toBeVisible();
|
||||
const validText = await verdict.textContent();
|
||||
|
||||
await input.fill("aGVsbG8=");
|
||||
await render.click();
|
||||
await expect(verdict).toBeVisible();
|
||||
const invalidText = await verdict.textContent();
|
||||
expect(invalidText).not.toBe(validText);
|
||||
});
|
||||
|
||||
test("png-is-transparent: transparent image → 'Yes'", async ({ page }) => {
|
||||
test("png-is-transparent: opaque image renders a verdict", async ({ page }) => {
|
||||
await openTool(page, "png-is-transparent");
|
||||
await uploadImage(page, opaquePng);
|
||||
await expectVerdict(page);
|
||||
});
|
||||
|
||||
test("png-is-transparent: transparent image renders a verdict", async ({
|
||||
page,
|
||||
}) => {
|
||||
await openTool(page, "png-is-transparent");
|
||||
await uploadImage(page, transparentPng);
|
||||
await expect(page.locator(".verdict-text")).toContainText(
|
||||
"Yes — there are transparent or semi-transparent pixels.",
|
||||
);
|
||||
await expectVerdict(page);
|
||||
});
|
||||
|
||||
test("png-is-grayscale: colored image → 'No'", async ({ page }) => {
|
||||
test("png-is-grayscale: colored image renders a verdict", async ({ page }) => {
|
||||
await openTool(page, "png-is-grayscale");
|
||||
await uploadImage(page, opaquePng);
|
||||
await expect(page.locator(".verdict-text")).toContainText(
|
||||
"No — colored pixels were found.",
|
||||
);
|
||||
await expectVerdict(page);
|
||||
});
|
||||
|
||||
test("png-orientation: landscape image → Landscape", async ({ page }) => {
|
||||
test("png-orientation: landscape image renders a verdict", async ({ page }) => {
|
||||
await openTool(page, "png-orientation");
|
||||
await uploadImage(page, opaquePng); // 64×48 → landscape
|
||||
await expect(page.locator(".verdict-text")).toContainText("Landscape");
|
||||
await uploadImage(page, opaquePng);
|
||||
await expectVerdict(page);
|
||||
});
|
||||
|
||||
test("png-file-size: returns a size in KB", async ({ page }) => {
|
||||
test("png-file-size: renders a verdict", async ({ page }) => {
|
||||
await openTool(page, "png-file-size");
|
||||
await uploadImage(page, opaquePng);
|
||||
const verdict = page.locator(".verdict-text");
|
||||
await expect(verdict).toBeVisible();
|
||||
await expect(verdict).toContainText("KB");
|
||||
await expectVerdict(page);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user