Skip to main content

Employee UI Testing Guide

Summary​

Use safe, synthetic tests to verify the composite Employee page, its compatibility API behavior, and cutover parity.

Audience​

  • Frontend/backend developers and QA engineers

Prerequisites​

  • An approved isolated environment with synthetic tenant and employee records
  • A test identity with source-confirmed route/API access
  • Current Client HRMS and API builds
  • Browser accessibility and responsive-testing tools

Steps​

  1. Verify unauthenticated, unauthorized, and authenticated tenant route outcomes for both Employee paths.
  2. Load the directory and check loading, populated, and empty states.
  3. Exercise text search, each filter, status segmentation, pagination, and selection.
  4. Create a synthetic employee through every form step and test each client validation branch.
  5. Edit the record and confirm list/profile refresh behavior.
  6. Test department/designation narrowing, clear assignment, manager selection, and rejected invalid references.
  7. Verify profile Overview and Documents loading/empty/error behavior.
  8. Test activate/disable confirmation and API failure presentation.
  9. Exercise network/server failures without exposing response payloads.
  10. Test desktop, tablet, mobile, zoom, keyboard-only, and basic screen-reader flows.
  11. During gateway cutover testing, compare monolith and extracted-service response/identifier behavior before routing approval.

Validation or Expected Result​

Routes respect authentication/feature controls; accessible records only are listed; filters and pagination are stable; valid saves refresh the UI; invalid input is blocked or safely reported; and no personal test data appears in evidence.

The frontend package includes build/lint scripts and a Playwright dependency, but no test/spec files or test script were found. Automated UI coverage is Not implemented from the reviewed evidence. The backend smoke script covers monolith employee creation, self-scope, tenant isolation, and entitlement behavior but is not a browser UI test.

Troubleshooting​

If a UI check fails, separate route/session, frontend filtering, compatibility API, lookup, identifier, and gateway-routing causes. Use correlation-safe evidence and the dedicated troubleshooting section; do not edit production data.

Source References​

  • UI/salary-ui/apps/client-hrms-portal/src/App.tsx
  • UI/salary-ui/apps/client-hrms-portal/src/pages/Labor.tsx
  • UI/salary-ui/apps/client-hrms-portal/src/utils/ProtectedRoute.tsx
  • UI/salary-ui/package.json
  • scripts/verify-hr-suite.ps1

See Also​

Keywords​

  • UI testing
  • gateway parity
  • accessibility testing

Revision Information​

  • Status: Draft
  • Last reviewed: 2026-07-15
  • Review cycle: Quarterly