Skip to content

Add Playwright visual regression coverage #34

Add Playwright visual regression coverage

Add Playwright visual regression coverage #34

Triggered via pull request March 28, 2026 11:23
Status Failure
Total duration 2m 27s
Artifacts 1
visual-regression
2m 22s
visual-regression
Fit to window
Zoom out
Zoom in

Annotations

7 errors, 1 warning, and 1 notice
visual-regression
Process completed with exit code 1.
[mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable: frontend/tests/e2e/create-payment.visual.spec.ts#L17
2) [mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable Retry #2 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(locator).toBeVisible() failed Locator: locator('main') Expected: visible Error: strict mode violation: locator('main') resolved to 2 elements: 1) <main class="flex-1 transition-all lg:pl-[260px]">…</main> aka getByRole('main').filter({ hasText: 'Home/Dashboard/' }) 2) <main class="mx-auto flex min-h-screen max-w-lg flex-col justify-center gap-10 px-6 py-16">…</main> aka locator('section').getByRole('main') Call log: - Expect "toBeVisible" with timeout 5000ms - waiting for locator('main') 15 | test("create payment form remains visually stable", async ({ page }) => { 16 | const formShell = page.locator("main"); > 17 | await expect(formShell).toBeVisible(); | ^ 18 | await expect(page.getByRole("heading", { name: "Create Payment Link" })).toBeVisible(); 19 | await expect(page.locator("select#trusted-address")).toBeVisible(); 20 | at /home/runner/work/Stellar_Payment_API/Stellar_Payment_API/frontend/tests/e2e/create-payment.visual.spec.ts:17:29
[mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable: frontend/tests/e2e/create-payment.visual.spec.ts#L17
2) [mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(locator).toBeVisible() failed Locator: locator('main') Expected: visible Error: strict mode violation: locator('main') resolved to 2 elements: 1) <main class="flex-1 transition-all lg:pl-[260px]">…</main> aka getByRole('main').filter({ hasText: 'Home/Dashboard/' }) 2) <main class="mx-auto flex min-h-screen max-w-lg flex-col justify-center gap-10 px-6 py-16">…</main> aka locator('section').getByRole('main') Call log: - Expect "toBeVisible" with timeout 5000ms - waiting for locator('main') 15 | test("create payment form remains visually stable", async ({ page }) => { 16 | const formShell = page.locator("main"); > 17 | await expect(formShell).toBeVisible(); | ^ 18 | await expect(page.getByRole("heading", { name: "Create Payment Link" })).toBeVisible(); 19 | await expect(page.locator("select#trusted-address")).toBeVisible(); 20 | at /home/runner/work/Stellar_Payment_API/Stellar_Payment_API/frontend/tests/e2e/create-payment.visual.spec.ts:17:29
[mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable: frontend/tests/e2e/create-payment.visual.spec.ts#L17
2) [mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable Error: expect(locator).toBeVisible() failed Locator: locator('main') Expected: visible Error: strict mode violation: locator('main') resolved to 2 elements: 1) <main class="flex-1 transition-all lg:pl-[260px]">…</main> aka getByRole('main').filter({ hasText: 'Home/Dashboard/' }) 2) <main class="mx-auto flex min-h-screen max-w-lg flex-col justify-center gap-10 px-6 py-16">…</main> aka locator('section').getByRole('main') Call log: - Expect "toBeVisible" with timeout 5000ms - waiting for locator('main') 15 | test("create payment form remains visually stable", async ({ page }) => { 16 | const formShell = page.locator("main"); > 17 | await expect(formShell).toBeVisible(); | ^ 18 | await expect(page.getByRole("heading", { name: "Create Payment Link" })).toBeVisible(); 19 | await expect(page.locator("select#trusted-address")).toBeVisible(); 20 | at /home/runner/work/Stellar_Payment_API/Stellar_Payment_API/frontend/tests/e2e/create-payment.visual.spec.ts:17:29
[desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable: frontend/tests/e2e/create-payment.visual.spec.ts#L17
1) [desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable Retry #2 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(locator).toBeVisible() failed Locator: locator('main') Expected: visible Error: strict mode violation: locator('main') resolved to 2 elements: 1) <main class="flex-1 transition-all lg:pl-[260px]">…</main> aka getByRole('main').filter({ hasText: 'Home/Dashboard/' }) 2) <main class="mx-auto flex min-h-screen max-w-lg flex-col justify-center gap-10 px-6 py-16">…</main> aka locator('section').getByRole('main') Call log: - Expect "toBeVisible" with timeout 5000ms - waiting for locator('main') 15 | test("create payment form remains visually stable", async ({ page }) => { 16 | const formShell = page.locator("main"); > 17 | await expect(formShell).toBeVisible(); | ^ 18 | await expect(page.getByRole("heading", { name: "Create Payment Link" })).toBeVisible(); 19 | await expect(page.locator("select#trusted-address")).toBeVisible(); 20 | at /home/runner/work/Stellar_Payment_API/Stellar_Payment_API/frontend/tests/e2e/create-payment.visual.spec.ts:17:29
[desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable: frontend/tests/e2e/create-payment.visual.spec.ts#L17
1) [desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(locator).toBeVisible() failed Locator: locator('main') Expected: visible Error: strict mode violation: locator('main') resolved to 2 elements: 1) <main class="flex-1 transition-all lg:pl-[260px]">…</main> aka getByRole('main').filter({ hasText: 'Home/Dashboard/' }) 2) <main class="mx-auto flex min-h-screen max-w-lg flex-col justify-center gap-10 px-6 py-16">…</main> aka locator('section').getByRole('main') Call log: - Expect "toBeVisible" with timeout 5000ms - waiting for locator('main') 15 | test("create payment form remains visually stable", async ({ page }) => { 16 | const formShell = page.locator("main"); > 17 | await expect(formShell).toBeVisible(); | ^ 18 | await expect(page.getByRole("heading", { name: "Create Payment Link" })).toBeVisible(); 19 | await expect(page.locator("select#trusted-address")).toBeVisible(); 20 | at /home/runner/work/Stellar_Payment_API/Stellar_Payment_API/frontend/tests/e2e/create-payment.visual.spec.ts:17:29
[desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable: frontend/tests/e2e/create-payment.visual.spec.ts#L17
1) [desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable Error: expect(locator).toBeVisible() failed Locator: locator('main') Expected: visible Error: strict mode violation: locator('main') resolved to 2 elements: 1) <main class="flex-1 transition-all lg:pl-[260px]">…</main> aka getByRole('main').filter({ hasText: 'Home/Dashboard/' }) 2) <main class="mx-auto flex min-h-screen max-w-lg flex-col justify-center gap-10 px-6 py-16">…</main> aka locator('section').getByRole('main') Call log: - Expect "toBeVisible" with timeout 5000ms - waiting for locator('main') 15 | test("create payment form remains visually stable", async ({ page }) => { 16 | const formShell = page.locator("main"); > 17 | await expect(formShell).toBeVisible(); | ^ 18 | await expect(page.getByRole("heading", { name: "Create Payment Link" })).toBeVisible(); 19 | await expect(page.locator("select#trusted-address")).toBeVisible(); 20 | at /home/runner/work/Stellar_Payment_API/Stellar_Payment_API/frontend/tests/e2e/create-payment.visual.spec.ts:17:29
visual-regression
Node.js 20 actions are deprecated. The following actions are running on Node.js 20 and may not work as expected: actions/cache@v4, actions/checkout@v4, actions/setup-node@v4, actions/upload-artifact@v4. Actions will be forced to run with Node.js 24 by default starting June 2nd, 2026. Node.js 20 will be removed from the runner on September 16th, 2026. Please check if updated versions of these actions are available that support Node.js 24. To opt into Node.js 24 now, set the FORCE_JAVASCRIPT_ACTIONS_TO_NODE24=true environment variable on the runner or in your workflow file. Once Node.js 24 becomes the default, you can temporarily opt out by setting ACTIONS_ALLOW_USE_UNSECURE_NODE_VERSION=true. For more information see: https://github.blog/changelog/2025-09-19-deprecation-of-node-20-on-github-actions-runners/
🎭 Playwright Run Summary
2 failed [desktop-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable [mobile-chrome] › tests/e2e/create-payment.visual.spec.ts:15:7 › Create Payment Visual Regression › create payment form remains visually stable 2 passed (36.5s)

Artifacts

Produced during runtime
Name Size Digest
frontend-visual-regression-artifacts Expired
422 KB
sha256:e7b56aedeeebabf595fd7c961d5099630264ed54c849c67418c72bde4836228c