How to visit an HTML page that is on my computer with Cypress

Learn how to test an HTML page that is only in your local environment

Today's “Pinch of cypress” is inspired by a question from Rafael Barbosa.

Thanks for the question, Rafael!

With Cypress, if you want to test a page that is only available on your computer, that is, it is not available via the internet, you can use the relative path of the page in the cy.visit() command.

Let's look at an example of an application that simulates Twitter.

// cypress/integration/sampleTwitterApp.spec.js

describe('Tweets', () => {
  beforeEach(() => cy.visit('../../Tweets/index.html'))

  it('tweet using a custom command', () => {
    cy.get('.tweet')
      .its('length')
      .then(numberOfTweetsBefore => {
        const newTweet = 'Yay, custom commands with Cypress!'

        cy.tweet(newTweet);

        cy.get('.tweet')
          .its('length')
          .should('be.gt', numberOfTweetsBefore);
        cy.get('.tweet')
          .last()
          .should('contain', newTweet);
      });
  });
});

As you can see, instead of passing an URL to the cy.visit() command, I am passing the relative path ../../Tweets/index.html, and my test behaves as if I were visiting a page on the web. 😄

For more information, visit the official docs.

Short post, but hopefully useful.

👋 See you next time!

---

Any thoughts about the series?

I'm looking forward to hearing your feedback!

---

This post was originally published in Portuguese on the Talking About Testing blog.

---

Want to go deeper?

I built the Cypress Simulator — a hands-on course designed to take you from your first test to a full end-to-end testing workflow with confidence.

You'll learn how to test real user interactions, catch accessibility issues early, and run your tests automatically in CI/CD pipelines — through 20 interactive lessons, coding challenges, and quizzes.

Enroll in Cypress Simulator →