JavaScript · Cypress

Pharmacy with Cypress

Search medicines by name or salt, see cheaper generic substitutes, respect per-item quantity limits, and get blocked at checkout until you upload a prescription (or book a consult) for Rx items.

App under test

💊 MediKart

URL: /apps/pharmacy
Mobile: 9876543210
OTP: 445566
Rx upload: PDF/JPG/PNG ≤ 5 MB
Free delivery: ₹300+
Consult: ₹199

Launch 💊 MediKart →📘 Project KT 📋 View all 17 test cases

Scenarios to automate

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

1
Mobile + OTP login
Beginner
Passwordless sign-in: mk-login-id (mobile) → mk-login → mk-code (OTP) → mk-verify. A wrong OTP shows mk-code-error; an unknown mobile counts toward the 3-attempt lock.
2
Min-length autocomplete
Beginner
med-suggestions only appears after 2 characters; match by brand or salt.
3
Substitutes & savings
Intermediate
On Mox 500, saving-m3g shows “Save ₹50 (42%)”; add-substitute-* adds the generic.
4
Quantity limits
Intermediate
inc-<id> disables at the medicine's max (antibiotics: 2–3); add-med-* disables when maxed.
5
Rx gate
Advanced
With an Rx item, placing the order shows error-rx until rx-upload + prescription-file or rx-consult.
6
Upload validation
Intermediate
A .txt or >5 MB file shows an error under prescription-file; valid files show prescription-file-name.
7
Totals
Intermediate
med-delivery is ₹40 under ₹300 and FREE above; rx-consult adds ₹199 to med-total.
8
Filters
Beginner
med-category-* chips and filter-all/otc/rx narrow the med-grid.
9
Reorder
Beginner
reorder-<id> on the orders page refills the cart with the same lines.

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.

medikart.cy.js

// Uses the getByTestId custom command from the Cypress setup (cypress/support/commands.js).
// Locators in this suite: cy.contains ×4 · #id ×3 · [name] ×3 · [aria-label] ×2 · getByTestId ×17
describe('MediKart — pharmacy', () => {
  it('orders medicines with a prescription', () => {
    cy.visit('/apps/pharmacy');

    // Sign in first
    cy.get('#mk-login-id').type('9876543210');
    cy.contains('button', 'Continue').click();
    cy.get('[name="mk-code"]').type('445566');
    cy.getByTestId('mk-verify').click();
    cy.get('[aria-label="Search medicines"]').type('amox');
    cy.getByTestId('med-option-m3').click();
    cy.getByTestId('med-title').should('contain', 'Mox 500');
    cy.getByTestId('saving-m3g').should('contain', 'Save ₹50');
    cy.contains('button', 'Add instead').click();
    cy.getByTestId('cart-count').should('contain', '1');
    cy.getByTestId('nav-shop').click();
    cy.getByTestId('add-med-m1').click();
    cy.getByTestId('add-med-m1').click();
    cy.getByTestId('nav-cart').click();
    cy.getByTestId('rx-required').should('be.visible');
    cy.contains('button', 'Place order').click();
    cy.getByTestId('error-rx').should('be.visible');
    cy.getByTestId('rx-upload').click();
    cy.get('#prescription-file').selectFile('cypress/fixtures/prescription.pdf');
    cy.getByTestId('prescription-file-name').should('contain', 'prescription.pdf');
    cy.get('[name="delivery-slot"]').select('Tomorrow 8–11 am');
    cy.get('#med-phone').type('9876543210');
    cy.get('[name="med-address"]').type('12B Palm Residency, Baner, Pune');
    cy.getByTestId('med-total').should('contain', '₹178');
    cy.get('[aria-label="Refill reminder"]').click();
    cy.contains('button', 'Place order').click();
    cy.getByTestId('med-order-placed').should('be.visible');
    cy.getByTestId('med-order-id').should('contain', 'MK-');
    cy.getByTestId('refill-on').should('be.visible');
  });
});