Skip to main content

Featured Post

The AI-Native SDLC Playbook: Rethinking Software Development When Code Is No Longer the Bottleneck

AI coding agents like Claude Code can now write code faster than most engineering teams can plan, review, test, or ship it. That speed exposes a problem: our software development lifecycle was designed for a world where writing code was the expensive part. Anthropic's new free course, The AI-Native SDLC Playbook , is a practical guide to redesigning that lifecycle around agents without giving up human accountability. Here's what it covers and why it's worth your time. The problem: the bottleneck moved When agents speed up the build phase, the work doesn't disappear. It piles up somewhere else. The course lists three things that happen: Bottlenecks move to the stages around build: planning, review, and deployment. Manual review stops working. A security team sized for human output either builds a queue or lets code through without a proper review. Governance costs spike. Weekly or monthly exception committees can't keep up with how much agents produce. T...
Post a Comment
Cypress

Cypress Functions and Commands Explained

Cypress provides various functions and commands for writing automated tests effectively. Below is a categorized list of the most commonly used Cypress functions with explanations and examples.

1. Visiting and Navigating Pages

cy.visit(url)

    Navigates to a specific URL.


    cy.visit('https://example.com');
  • Can also pass options like authentication headers.

    cy.visit('https://example.com', { auth: { username: 'user', password: 'pass' } });

cy.go()

    Navigates forward or backward in browser history.

    cy.go('back'); // Go back one page
    cy.go('forward'); // Go forward one page
    cy.go(-1); // Equivalent to back
    cy.go(1); // Equivalent to forward

cy.reload()

    Reloads the current page.

    cy.reload();
    cy.reload({ force: true }); // Forces reload, bypassing cache

2. Selecting Elements

cy.get(selector)

Selects elements using a CSS selector.


    cy.get('#username'); // Selects an element with ID 'username'
    cy.get('.btn-primary'); // Selects an element with class 'btn-primary'
    cy.get('[data-testid="submit-button"]'); // Uses a test-specific attribute

cy.contains(text)

Finds elements containing specific text.


    cy.contains('Submit').click(); // Clicks a button containing 'Submit'
    cy.contains('Welcome, John').should('be.visible');

cy.find(selector)

Finds a child element inside a parent.


    cy.get('.form-container').find('input').type('test');

cy.within()

Runs commands inside a specific DOM element.


cy.get('.login-form').within(() => {
  cy.get('input[name="username"]').type('student');
  cy.get('input[name="password"]').type('Password123');
});

3. Interacting with Elements

cy.type(text)

Types text into an input field.


    cy.get('input[name="email"]').type('test@example.com');
    cy.get('input[name="password"]').type('MyPassword{enter}'); // Simulates pressing Enter key

cy.clear()

Clears the input field.

    cy.get('input[name="username"]').clear();

cy.click()

Clicks on an element.

    cy.get('#login-button').click();
    cy.get('#checkbox').click({ force: true }); // Clicks even if hidden

cy.check() / cy.uncheck()

Checks and unchecks checkboxes or radio buttons.


    cy.get('#accept-terms').check();    
    cy.get('#accept-terms').uncheck();

cy.select()

Selects a dropdown option.


    cy.get('select[name="country"]').select('USA');

4. Assertions (Validations)

cy.should()

Asserts conditions on elements.


    cy.get('.success-message').should('be.visible'); // Check visibility
    cy.get('input').should('have.value', 'test@example.com'); // Check input value
    cy.get('button').should('be.enabled'); // Check if button is enabled
    cy.get('.error-message').should('contain', 'Invalid login'); // Check text content

cy.expect()

General assertion function.


    expect(true).to.be.true;
    expect(5).to.equal(5);

cy.should('not.exist')

Checks if an element does NOT exist.


    cy.get('.modal').should('not.exist');

5. Handling Network Requests

cy.intercept(method, url)

Intercepts API calls and mocks responses.


    cy.intercept('GET', '/api/user', { fixture: 'user.json' }).as('getUser');
    cy.wait('@getUser').its('response.statusCode').should('eq', 200);

cy.wait(alias)

Waits for an intercepted API request to finish.


    cy.wait('@getUser');

6. Handling Cookies and Local Storage

cy.setCookie(name, value)

Sets a browser cookie.

    cy.setCookie('session_id', '123456');

cy.getCookie(name)

Gets a cookie value.


    cy.getCookie('session_id').should('have.property', 'value', '123456');

cy.clearCookies()

Clears all cookies.


    cy.clearCookies();

cy.setLocalStorage(key, value)

Sets a value in local storage.


    cy.window().then((win) => {
      win.localStorage.setItem('theme', 'dark');
    });

cy.getLocalStorage(key)

Gets a value from local storage.


    cy.window().then((win) => {
      expect(win.localStorage.getItem('theme')).to.equal('dark');
    });

7. Debugging & Logs

cy.pause()

Pauses test execution at a specific point.


    cy.get('#submit').click().pause();

cy.debug()

Prints debugging information.


    cy.get('input').debug();

cy.log(message)

Logs custom messages to the Cypress command log.


    cy.log('User is logged in successfully');

8. Running Tests in CI/CD

cy.screenshot()

Takes a screenshot of the current state.

    cy.screenshot('login-success');

cy.task()

Runs Node.js functions within Cypress.

    cy.task('log', 'This is a debug message');

9. Running Cypress Tests

Run Cypress in interactive mode:

npx cypress open


Run tests headlessly:

npx cypress run


Run specific test file:

npx cypress run --spec cypress/e2e/login.cy.js

Conclusion

Cypress provides a comprehensive API for testing web applications efficiently. By using its built-in commands for navigation, element selection, interactions, assertions, and debugging, you can write reliable automated tests.


Labels:

Comments

Post a Comment

Popular posts from this blog

Understanding SQL Query Execution Order

When writing SQL queries, understanding the execution order is crucial for writing efficient and optimized code. Many beginners assume that queries execute in the order they are written, but in reality, SQL follows a specific sequence of execution. SQL Execution Order SQL queries run in the following order: 1️⃣ FROM + JOIN 2️⃣ WHERE 3️⃣ GROUP BY 4️⃣ HAVING 5️⃣ SELECT (including window functions) 6️⃣ ORDER BY 7️⃣ LIMIT Let’s break down each step with examples. 1. FROM + JOIN (Data Retrieval) The SQL engine first retrieves data from the specified table(s) and applies any JOIN operations. 🔹 Example: SELECT employees.name, departments.department_name FROM employees JOIN departments ON employees.department_id = departments.id; Here, the JOIN happens before any filtering ( WHERE ) or grouping ( GROUP BY ). 2. WHERE (Filtering Data) Once data is retrieved, the WHERE clause filters rows before aggregation occurs. 🔹 Example: SELECT * FROM employees WHERE salary > 50000 ; Thi...
Post a Comment
Read more

Top 5 React.js Performance Optimization Techniques for 2025

React.js continues to dominate the front-end development landscape due to its flexibility, component-based architecture, and performance. However, as applications grow, performance issues can emerge, affecting user experience. Here are the top five performance optimization techniques every React developer should consider in 2024. 1. Use React.memo for Component Memoization React.memo is a higher-order component that prevents unnecessary re-renders by memoizing the result. It only re-renders when props change, improving performance for functional components that rely on the same data. import React from 'react';  const ExpensiveComponent = React.memo(({ data }) => {      console.log('Rendering ExpensiveComponent');      return <div>{data}</div>;  }); export default ExpensiveComponent; 2. Implement Code Splitting with React.lazy and Suspense Code splitting reduces the initial load time by splitting the code into smaller bundles. Re...
Post a Comment
Read more

Best Practices for Securing Personal and Business Data in 2025

In today’s digital landscape, cybersecurity is more critical than ever. With increasing cyber threats, data breaches, and privacy concerns, individuals and businesses must take proactive steps to secure their data. This guide outlines the most effective security practices for 2025. 1. Implement Strong Authentication Measures Passwords alone are no longer sufficient to protect sensitive accounts. Instead, consider: ✅ Multi-Factor Authentication (MFA): Require users to verify their identity using an additional factor, such as an SMS code, authenticator app, or biometric authentication. ✅ Passkeys & Password Managers: Use passkeys where available and store strong, unique passwords in a secure password manager. 2. Encrypt Sensitive Data Encryption ensures that even if data is stolen, it remains unreadable without the decryption key. 🔹 Use end-to-end encryption (E2EE) for messages and emails. 🔹 Encrypt stored data on cloud services, external drives, and local machines. 🔹 Consider ...
Post a Comment
Read more