0
0
Cypresstesting~15 mins

cy.visit() for page navigation in Cypress - Build an Automation Script

Choose your learning style9 modes available
Navigate to the homepage using cy.visit()
Preconditions (1)
Step 1: Open the browser
Step 2: Use cy.visit() to go to 'http://localhost:3000'
Step 3: Verify that the URL is exactly 'http://localhost:3000/'
Step 4: Verify that the page contains a visible header with text 'Welcome to Our Site'
✅ Expected Result: The browser navigates to the homepage URL and the page shows the header text 'Welcome to Our Site'
Automation Requirements - Cypress
Assertions Needed:
URL is 'http://localhost:3000/'
Header with text 'Welcome to Our Site' is visible
Best Practices:
Use cy.visit() for navigation
Use cy.url().should() for URL assertion
Use cy.contains() with .should('be.visible') for element visibility
Avoid hardcoded waits; rely on Cypress automatic waits
Automated Solution
Cypress
describe('Homepage Navigation Test', () => {
  it('should navigate to homepage and verify header', () => {
    cy.visit('http://localhost:3000');
    cy.url().should('eq', 'http://localhost:3000/');
    cy.contains('h1', 'Welcome to Our Site').should('be.visible');
  });
});

This test uses cy.visit() to open the homepage URL. Then it checks the URL with cy.url().should('eq', ...) to confirm navigation succeeded. Finally, it looks for an h1 header containing the exact text 'Welcome to Our Site' and asserts it is visible on the page. Cypress automatically waits for elements to appear, so no manual waits are needed.

Common Mistakes - 3 Pitfalls
Using cy.visit() with a relative URL without baseUrl configured
Using cy.wait() after cy.visit() to wait for page load
{'mistake': "Checking URL with cy.url().should('include', 'localhost:3000') instead of exact match", 'why_bad': 'Partial match may pass even if navigation is incomplete or wrong page loaded.', 'correct_approach': "Use exact match with cy.url().should('eq', 'http://localhost:3000/') for precise verification."}
Bonus Challenge

Now add data-driven testing to navigate to three different URLs and verify their headers

Show Hint