skills.rest
afonsoft
afonsoftCOMMUNITY
Explore all skills by this author →
Website𝕏@afonsoftGitHub

testing-eaf-angular-visual

Verifies the EAF Angular admin UI visually using Playwright end-to-end checks.

Updated May 8, 2026
Search Tags:#screenshots#angular#playwright#end-to-end testing#visual verification#smoke testing#login flow
One-click install
npx skills add https://github.com/afonsoft/EAF --skill testing-eaf-angular-visual-afonsoft
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: testing-eaf-angular-visual
Source: https://github.com/afonsoft/EAF/tree/main/.agents/skills/testing-eaf-angular-visual
Command: npx skills add https://github.com/afonsoft/EAF --skill testing-eaf-angular-visual-afonsoft

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright.

What problem does it solve? Manually confirming that the EAF Angular admin UI renders correctly after deployment is slow and error-prone. This Skill automates visual end-to-end verification of login, dashboard, gateway selection, and subscriptions pages, catching console errors, page errors, and 5xx responses. ## Core Features & Use Cases - Automated Login Flow: Fills the seeded admin credentials, handles the social/external login view fallback, and waits for the dashboard route. - Page Render Verification: Checks the dashboard, /account/gateway-selection, and /app/admin/subscriptions pages using known selectors like #TenantDashboard, #GatewayName, and #SubscriptionsFilterText. - Screenshot Capture & Error Reporting: Saves full-page screenshots (01-login-page through 04-subscriptions) and reports console errors, page errors, and 5xx responses. - Use Case: After bringing up the full Docker stack, run the verification script to confirm the admin UI at http://localhost:4200 logs in and renders all payment/subscription screens without errors. ## Quick Start Run the Playwright verification script to visually check the EAF Angular admin UI login, dashboard, gateway selection, and subscriptions pages.

Frequently Asked Questions about testing-eaf-angular-visual

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I run visual end-to-end tests on an Angular admin UI with Playwright?▼

Run the verify-eaf-angular.py script with Python after the stack is healthy. It launches headless Chromium, logs in with seeded admin credentials, visits the dashboard, gateway selection, and subscriptions pages, and saves screenshots under the screenshots directory.

How to test Angular login flows with Playwright selectors?▼

Fill #userNameOrEmailAddress and #Password, then click button[type='submit']. If the password field is hidden behind a social login view, click the LoginSistem or Back link first to switch to the normal form.

What environment is required for Playwright Angular UI verification?▼

The Angular UI must be reachable at http://localhost:4200 with the API at http://localhost:5000, plus the seeded admin user and its password. Node should match the package.json range (>=18 <22), and Python needs the playwright package installed.

Why does Playwright fail when the login page shows a social login view?▼

The #Password field is not visible when an external/social login view renders first. The script handles this by clicking the LoginSistem or Back link to switch to the standard credential form before filling fields.

Can Playwright verification accept empty-state pages as valid renders?▼

Yes. Pages with no data render an app-empty-state component instead of a table. Assertions should accept either the data table (p-table) or the empty-state component as a successful render.

Related Skills

Explore More Software Engineering Skills→
rezosndrezosnd

repl_setup

Configure web apps to bind to 0.0.0.0:5000 for Replit preview.

Community
Intermediate
joelklabojoelklabo

sketch-devtools-qa

Diagnose Chrome DevTools errors and UX regressions in the upload-to-convert flow.

Community
Intermediate
GedMarcGedMarc
2

angular-awesome-testing

Write Jasmine and Karma tests for Angular wa-* directives and services.

Community
Intermediate
JuanMS20JuanMS20
1

e2e-testing

Automate end-to-end tests with Playwright, Cypress, or Selenium.

Community
Advanced