nilsnolde / valhalla-app

This is the demo web app running on https://valhalla.openstreetmap.de
https://valhalla.openstreetmap.de
MIT License
165 stars 93 forks source link

Add e2e tests #58

Open chrstnbwnkl opened 1 year ago

chrstnbwnkl commented 1 year ago

Right now, we're not testing. We could add some basic e2e tests with e.g. cypress.

aa98-45556443355666 commented 1 year ago

I want to work on this issue for GSOC 2023. Kindly assign to me.

nilsnolde commented 1 year ago

The application period opens in 4 weeks, we don't even know yet if this is going to happen or not.

It's always good to get a head start though, but may I suggest a smaller issue (this is fairly big and should be tackled during GSoC), e.g. https://github.com/gis-ops/valhalla-app/issues/50. That has a huge impact on UX but is not much work.

YashGupta018 commented 1 year ago

Good Afternoon Sir, I would like to work on in issue as GSoc'23 This is my first time as an open source contributor I did manage to add e2e, though I'm not sure it is completely functional or not, Sir Please check and reply back :) And Sorry I did something wrong!

1) Install Cypress npm install cypress --save-dev

2) Create a new Cypress test file in the "cypress/integration" directory, for example "example_spec.js"

3) Open the Cypress Test Runner by running npx cypress open

4)In the Test Runner, click on the "example_spec.js" file to run the tests.

5) Write your e2e tests in the "example_spec.js" file using the Cypress API. For example

describe('My First Test', () => {
  it('Visits the homepage', () => {
    cy.visit('https://example.com')
  })
  it('Searches for "Cypress"', () => {
    cy.get('input[name="q"]').type('Cypress')
    cy.get('button[type="submit"]').click()
    cy.url().should('include', 'search?q=Cypress')
    cy.get('h3').should('contain', 'Cypress')
  })
})

This test visits the homepage of "example.com" and searches for the term "Cypress" using the search input field and submit button. Then it asserts that the resulting page URL contains the search term and that the page contains a heading with the term "Cypress".

6) Save the "example_spec.js" file and run the tests in the Cypress Test Runner.

We can use the Cypress API to write more complex e2e tests for your application.

Sir is my approach correct, please reply back

nilsnolde commented 1 year ago

Sorry, this was accidentally labeled as "good first issue". But you should have read previous comments, which clearly say (this is fairly big and should be tackled during GSoC), so I don't feel too bad;)

Ghat0tkach commented 1 year ago

@nilsnolde as you said its a fairly big issue , may i start with implementing basic tests like visiting the website? As im complete novice in cypress , i'll try to learn bout it and do contribution while learning?

nilsnolde commented 1 year ago

that'd be very nice @Ghat0tkach thanks!

Ghat0tkach commented 1 year ago

@nilsnolde , when i was installing using npm , i found a lot of libraries which have been depreciated image shall i raise issue for them or is it okay?