JavaScript · Cypress

Government services with Cypress

A six-section application with autosaved drafts you can resume, split date-of-birth dropdowns, conditional fields, “same as present address”, document uploads, a verification code, appointment booking and ARN tracking.

App under test

🏛️ GovServe

URL: /apps/gov
Login: citizen@govserve.in / Gov@123
Login OTP: 5821
Form verification code: 7439
Uploads: PDF/JPG ≤ 2 MB · photo JPG ≤ 1 MB
Offices: weekdays only

Launch 🏛️ GovServe →📘 Project KT 📋 View all 18 test cases

Scenarios to automate

Work top to bottom — each one adds a new technique.

1
Citizen login + OTP
Beginner
Email + password, then OTP 5821. Opening a deep link such as /apps/gov/status signed out shows the login in place and returns to that page after sign-in.
2
Section validation
Beginner
section-next on an empty section shows section-errors plus an error-* per field.
3
Date dropdowns
Intermediate
31 Feb or a future date in dob-day/month/year shows error-dob.
4
Conditional field
Beginner
marital-status “Married” reveals spouse-name, which becomes required.
5
Copy address
Intermediate
same-address copies present into permanent fields and disables that fieldset.
6
Upload validation
Intermediate
Upload a .txt or >2 MB file to address-proof-file to see the type/size error; valid files show *-name.
7
Autosave & resume
Advanced
draft-status goes “Saving draft…” → “✓ Draft saved”; save-exit, then resume-<id> restores the section and values.
8
Review & edit
Intermediate
On the last step, edit-section-N jumps back; review-* rows reflect your answers.
9
Appointment & tracking
Advanced
Pick an office, a weekday and a free appointment-slot; then track the ARN on the status page.

Sample Cypress suite

A working starting point that finds elements every way Cypress can — by role, label, text, id, name, CSS, XPath and data-testid — so you practice them all. Pick your language, switch to data-testid only to compare, or try your own in the Locator Playground.

Language

Cypress runs inside the browser, so it only supports JavaScript and TypeScript — there is no Python, Java or C# version of Cypress. For those languages, see Selenium or Playwright.

govserve.cy.js

// Uses the getByTestId custom command from the Cypress setup (cypress/support/commands.js).
// Locators in this suite: cy.contains ×5 · #id ×11 · [name] ×10 · [aria-label] ×2 · getByTestId ×16
describe('GovServe — passport application', () => {
  it('applies for a passport and books an appointment', () => {
    cy.visit('/apps/gov');

    // Sign in first
    cy.get('#gs-login-id').type('citizen@govserve.in');
    cy.get('[name="gs-password"]').type('Gov@123');
    cy.contains('button', 'Continue').click();
    cy.getByTestId('gs-code').type('5821');
    cy.contains('button', 'Verify & continue').click();
    cy.getByTestId('start-application').click();
    cy.location('pathname').should('include', '/apps/gov/apply/');

    // 1. Personal
    cy.get('#given-name').type('Amir');
    cy.get('[name="surname"]').type('Khan');
    cy.get('[aria-label="Day"]').select('15');
    cy.get('[aria-label="Month"]').select('8');
    cy.get('#dob-year').select('1990');
    cy.contains('button', 'Male').click();
    cy.get('[name="birth-place"]').type('Pune');
    cy.getByTestId('marital-status').select('married');
    cy.get('#spouse-name').type('Sara Khan');
    cy.getByTestId('section-next').click();

    // 2. Address
    cy.get('[name="house"]').type('12B');
    cy.get('#street').type('Palm Residency, Baner');
    cy.get('[name="city"]').type('Pune');
    cy.getByTestId('state').select('Maharashtra');
    cy.get('#pincode').type('411045');
    cy.getByTestId('same-address').check();
    cy.getByTestId('section-next').click();

    // 3. Family, 4. Emergency contact
    cy.get('[name="father-name"]').type('Imran Khan');
    cy.get('#mother-name').type('Farah Khan');
    cy.getByTestId('section-next').click();
    cy.get('[name="emergency-name"]').type('Sara Khan');
    cy.get('#emergency-phone').type('9812345678');
    cy.get('[name="emergency-relation"]').select('spouse');
    cy.getByTestId('section-next').click();

    // 5. Documents
    cy.get('#proof-type').select('aadhaar');
    cy.get('#address-proof-file').selectFile('cypress/fixtures/address-proof.pdf');
    cy.getByTestId('photo-file').selectFile('cypress/fixtures/photo.jpg');
    cy.getByTestId('photo-file-name').should('contain', 'photo.jpg');
    cy.getByTestId('section-next').click();

    // 6. Review & submit
    cy.getByTestId('review-name').should('contain', 'Amir Khan');
    cy.get('#declaration').check();
    cy.get('[name="captcha-input"]').type('7439');
    cy.contains('button', 'Submit application').click();
    cy.getByTestId('arn').should('contain', 'ARN-26');
    cy.get('[name="office"]').select('psk-pune');
    cy.get('[data-testid="appointment-day"]:not([disabled])').first().click();
    cy.get('[data-testid="appointment-slot"][data-available="true"]').first().click();
    cy.contains('button', 'Confirm appointment').click();
    cy.getByTestId('appointment-receipt').should('be.visible');
    cy.getByTestId('receipt-name').should('contain', 'Amir Khan');
  });
});