Digital Shelf

Typing email + password in every test is slow and noisy. Cypress can skip the login screen completely by grabbing a token via API and placing it into localStorage before the app loads . This is a practical reference showing the before vs after , plus a reusable custom command. Why This Helps UI login usually costs ~8 seconds per test run (open page, fill fields, submit, wait UI). Token-based login can cut it to ~5 seconds because it avoids the whole form flow. Tests become cl

This post explains how Cypress custom commands work, when they make sense, and when they should be avoided. It is written as a practical reference rather than a theoretical guide. What Are Cypress Custom Commands? Custom commands are global Cypress commands that can be called from any test or spec file. Defined in cypress/support/commands.js Available via cy.commandName() just like built-in commands Basic syntax: They are useful for removing duplication when the same operati

Parametrized object methods are a key technique for building scalable and maintainable Cypress test suites. Instead of creating multiple methods for similar interactions, a single method can be reused by passing different parameters that control its behavior. This reference page demonstrates how parametrized methods can be applied in a Page Object Model (POM) setup, using form layouts and date picker components as examples. Example Test Using Parametrized Page Object Method

When automating UI tests, navigation menus that expand and collapse dynamically are a common source of flaky tests. If a menu group is already expanded, clicking it again may collapse it - hiding the submenu items and causing test failures. This reference explains a clean, reusable Cypress pattern for safely navigating collapsible menus by ensuring a menu group is expanded only when necessary . The Problem: Collapsible Menus Cause Flaky Tests Consider the following navigati

This page shows how Page Object Model looks in real Cypress code . Where Page Objects Live Keep all page objects in one place: Important Notes Page objects use .js Test (spec) files use .cy.js Page objects should never contain it() or describe() This separation makes the project easier to understand and maintain. Creating a Page Object File Each page object is a JavaScript class . Basic rules to follow: Class name starts with a capital letter File name matches the class name

The DOM represents the HTML structure of a page and can be inspected using developer tools available in most browsers. The DOM consists of HTML elements, which are defined by tags. Each HTML element has a tag name , such as <div> or <input>. Tags usually appear in pairs with an opening and closing tag, but some elements like <input> are self-closing. Within these tags, attributes are specified. Attributes consist of a name and a value , for example, type="email". Attributes