Cypress is a JavaScript-based end-to-end testing framework that runs directly in the browser. Unlike Selenium, it operates within the same execution loop as the application, providing faster execution, automatic waits, and better debugging capabilities. Selenium supports multiple programming languages and browsers, whereas Cypress primarily supports JavaScript and Chromium-based browsers.

Cypress is best suited for:

• End-to-end tests
• Integration tests
• Component tests
• API testing
• Regression testing

Cypress automatically waits for elements to appear, actions to complete, or assertions to pass before moving to the next step in the test. It eliminates the need for explicit waits like sleep().

• Only supports JavaScript and TypeScript.
• Limited to Chromium-based browsers for now.
• Cannot handle multi-tab interactions directly.
• No direct support for mobile app testing.

Use Cypress commands like cy.get() with dynamic selectors or regex.

Combine CSS or XPath to locate elements with unique attributes.

Introduce assertions to validate that the element is visible before interacting.

Example:

cy.get('button').contains('Submit').click();

Fixtures in Cypress are used to store test data in JSON or other formats. They help separate test data from test scripts. You can load fixtures with cy.fixture().

Example:

cy.fixture('data.json').then((data) => {
  cy.get('input[name="username"]').type(data.username);
});

Use the cy.request() command to make API calls and chain assertions to verify the response.

Example:

cy.request('GET', '/api/users').then((response) => {
  expect(response.status).to.eq(200);
  expect(response.body).to.have.property('data');
});

Cypress automatically retries failed commands until the default timeout (4 seconds) is reached. You can configure the timeout with the defaultCommandTimeout option in the cypress.config.js file.

Cypress provides built-in commands like cy.setCookie(), cy.getCookie(), and cy.clearCookies() to manage cookies.

Example:

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

Yes, Cypress can test file uploads using the cypress-file-upload plugin.

Example:

cy.get('input[type="file"]').attachFile('example.png');

• Use cy.pause() to halt execution at a specific point.
• Add cy.debug() to inspect the DOM.
• Use the Cypress Test Runner’s interactive console for debugging.
• Use the debugger statement within your code.

Run the following command:

npx cypress run --headless

• Create separate folders for e2e, fixtures, support, and plugins.
• Use describe and it blocks for modularity.
• Reuse commands by defining them in the commands.js file.
• Keep test data in fixtures.

cy.wrap() allows you to work with non-Cypress objects like promises or jQuery elements.

Example:

const myPromise = Promise.resolve('Hello');
cy.wrap(myPromise).then((value) => {
  expect(value).to.eq('Hello');
});

You can authenticate using API calls, cookies, or UI interactions.

Example (using API login):

cy.request('POST', '/api/login', { username: 'user', password: 'pass' }).then((resp) => {
  cy.setCookie('auth_token', resp.body.token);
});

Custom commands simplify reusable code by defining them in the commands.js file.

Example:

Cypress.Commands.add('login', (username, password) => {
  cy.get('#username').type(username);
  cy.get('#password').type(password);
  cy.get('button[type="submit"]').click();
});

Use the .only method:

it.only('runs this test', () => {
  // test code
});

Or run via CLI:

npx cypress run --spec "cypress/e2e/test.spec.js"

Use Cypress retries:

Add this in cypress.config.js:

retries: { runMode: 2, openMode: 0 }

Improve test stability by using assertions like .should().

Avoid hard-coded waits.

• Screenshots:
• cy.screenshot('screenshot_name');
• Videos are automatically recorded during npx cypress run unless disabled in the configuration.

• Add Cypress to the CI/CD pipeline by including the npx cypress run command in your pipeline configuration file (e.g., Jenkinsfile, .gitlab-ci.yml, etc.).
• Use the Cypress Dashboard for parallel execution and result visualization.

Example GitHub Actions workflow:

jobs:

cypress-run:

runs-on: ubuntu-latest

steps:

- uses: actions/checkout@v2

- name: Install dependencies

run: npm install

- name: Run Cypress tests

run: npx cypress run