JavaScript · Cypress

Healthcare with Cypress

Pick a specialty, filter doctors, choose a day (Sundays closed) and a free time slot, fill new or existing patient details, then reschedule or cancel.

App under test

🩺 MediCare+

URL: /apps/clinic
Existing patient: P-1001
Video consult: 20% off
Closed: Sundays

Launch 🩺 MediCare+ →📘 Project KT 📋 View all 15 test cases

Scenarios to automate

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

1
Specialty & filters
Beginner
Toggle specialty-*, combine filter-gender, filter-fee and filter-available-today; assert doctor-count.
2
Sort order
Intermediate
sort-doctors “Lowest fee” must order doctor-fee values ascending.
3
Disabled dates
Intermediate
Sunday chips in appointment-day are disabled; pick the first enabled day with :not([disabled]).
4
Booked slots
Intermediate
Slots with data-available="false" are disabled; choose a free one and check slot-summary.
5
Existing patient lookup
Intermediate
patient-existing + P-1001 shows patient-found; any other ID shows patient-not-found.
6
Conditional insurance fields
Beginner
has-insurance reveals insurance-provider and policy-number, both validated.
7
Reschedule
Advanced
Move an appointment in reschedule-modal and assert appointment-slot changed.
8
Cancel
Advanced
cancel-appt-<id> → confirm-cancel-appointment sets appointment-status to Cancelled.

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.

medicare-plus.cy.js

// Uses the getByTestId custom command from the Cypress setup (cypress/support/commands.js).
// Locators in this suite: cy.contains ×2 · #id ×5 · [name] ×2 · getByTestId ×9
describe('MediCare+ — doctor appointments', () => {
  it('books a video consultation', () => {
    cy.visit('/apps/clinic');
    cy.getByTestId('specialty-cardiology').click();
    cy.getByTestId('doctor-count').should('contain', '2 doctors');
    cy.getByTestId('book-doctor').eq(0).click();
    cy.getByTestId('doctor-title').should('contain', 'Ananya Rao');
    cy.getByTestId('type-video').click();

    // First open day (Sundays are disabled), then the first free slot
    cy.get('[data-testid="appointment-day"]:not([disabled])').first().click();
    cy.get('[data-testid="slot"][data-available="true"]').first().click();
    cy.getByTestId('slot-summary').should('contain', 'Video');
    cy.contains('button', 'Continue').click();
    cy.getByTestId('patient-new').click();
    cy.get('#patient-name').type('Amir Khan');
    cy.get('[name="patient-age"]').type('36');
    cy.get('#patient-gender').select('male');
    cy.get('[name="patient-phone"]').type('9876543210');
    cy.get('#patient-email').type('amir@example.com');
    cy.get('#symptoms').type('Occasional chest discomfort after exercise');
    cy.get('#consent').check();
    cy.contains('button', 'Confirm appointment').click();
    cy.getByTestId('appointment-confirmed').should('be.visible');
    cy.getByTestId('appointment-id').should('contain', 'APT-');
    cy.getByTestId('appointment-type').should('contain', 'Video consult');
  });
});