Skip to content

Latest commit

 

History

History
122 lines (74 loc) · 2.88 KB

E2E-TESTS.md

File metadata and controls

122 lines (74 loc) · 2.88 KB

E2E Browser Tests

🧠You will learn

✅ How to test a web application with functional browser tests (aka E2E tests)

⚙️ Setup

Check if you have an app running on http://localhost:3000/. If so, you are ready.

If not, then

Open a terminal

cd web-testing-2022/
npm start

Open application at http://localhost:3000/

❓Let's define Our Test Strategy

Software under test

Test strategy

  • ❓What is the most basic test that we can code for our application?
  • ❓What other tests can we code?

Cypress Overview

"Fast, easy and reliable testing for anything that runs in a browser."(Cypress.io)

In new terminal, without stopping the web app

npx cypress open

💡 Tests live in cypress/e2e folder

🏋️‍♀️ Code a Cypress test to make sure that our app opens.

  1. In your IDE open cypress/e2e/exercise.cy.js
  2. Follow instructions to implement it('loads') test

🏋️‍♀️Code a test to ensure that the link will go to the correct location

  1. In your IDE open cypress/e2e/exercise.spec.js
  2. Follow instructions to implement it('link goes to ultimateqa') test

🏋️‍♀️Write a functional ui test to validate that the link opens in a new tab

  • Follow instructions in this test it('should open link in new tab')

❓What are some challenges of functional UI tests?


Click here to see answer.
  1. Need a browser
  2. Need a server
  3. Need to deal with network issues
  4. Test will be slower
  5. Need an extra dependency (Cypress)
  6. Need to learn extra dependency API

❓Can we test the same thing more efficiently❓


Click here to see answer.

Using component tests


❓What risks remain in our web app?

📝Summary

✅ E2E UI testing with Cypress allows us to do functional testing of the web app

✅ We can test a link by checking the href attribute

✅ We can test that a url opens a new tab with target='_blank'

⏭️ Let's continue to expand our coverage

🧠Expand your knowledge

Coding and testing web applications tutorial