Add Cypress test for foraging site display on desktop

[icycoldveins]

Pull Request

Change Summary

Add automated Cypress test for displaying foraging sites on desktop, ensuring this functionality works consistently throughout future development.

Change Reason

As part of improving test coverage for the PHLASK application, we need automated tests for all resource types. This PR adds the missing test for foraging site display functionality.

Changes

• Implement should successfully display a foraging site test in cypress/e2e/desktop/siteInfo.cy.js
• Add foraging test data entries to public/testData.json (2 sample foraging locations)
• Test performs the following actions:
  • Clicks on the "Resources" button on the bottom toolbar
  • Clicks on the "Foraging" button on the resources modal
  • Clicks on one of the foraging markers that appear on the map
  • Confirms that the window shows the correct location name
• Foraging test data includes proper structure with:
  • forage_type arrays (FRUIT, LEAVES, NUT, BARK, FLOWERS)
  • Optional tags arrays (IN_SEASON, COMMUNITY_GARDEN, MEDICINAL)

Video Recording

foraging.js.mp4

Related Issue: #484

[marcbachan]

Test looks good, the pattern match for the title element instead of exact match is a nice touch.

I had some issues running the tests, but later realized it was because a) my location is far enough from the city to not have some elements, and b) the default to Center City when location is off causes the tests to fail.

I manually adjusted the location like this and got it to work:

  // mock geolocation to West Phila
  cy.window().then((win) => {
    cy.stub(win.navigator.geolocation, 'getCurrentPosition').callsFake((success) => {
      success({
        coords: {
          latitude: 39.962250, 
          longitude: -75.211028, 
          accuracy: 10
        }
      });
    });
  });

We may want to consider anchoring the tests to specific coordinates (more elegantly than I did) to align to the test data regardless of the location of the person running the test?

[icycoldveins]

right that was a limitation I ran into as well lol

[icycoldveins]

I guess where im located theres plenty of resources

[icycoldveins]

I wonder if it would make sense to mock the location for the tests to be like centey city area ish

[icycoldveins]

should probably update the rests of my open prs as well then

[marcbachan]

I wonder if it would make sense to mock the location for the tests to be like centey city area ish

I have location turned off and the app appears to default to City Hall, but tests failed there too. I think it's a mix of some of the tests looking for specific resources like data-cy-1 for a water site that won't render in the viewport (it's in University City), and others looking for the Test Organization text attached to a resource that also is out west.

So either we

• anchor the test location to a point where the test data will always be in view, or
• we move those test data coordinates to Center City and adjust the test to ignore location so it always runs with the default location

[icycoldveins]

Good point

[marcbachan]

Adding commentary from @gcardonag - there is a line in package.json: "start:cypress": "VITE_CYPRESS_TEST=true yarn start", that's intended to test right around Center City and fetch specific test data points.

While we can fetch any available site that renders, we should still anchor the tests to specific points so as to not be dependent on the database.

[icycoldveins]

@marcbachan I made a recent commit, not sure if it addressed what we talked about last time because I forgot, but basically I added a location mock prior to the test run to have it be centered around center city

[icycoldveins]

@gcardonag lmk if the tests makes sense. Im thinking if anyone else wants to do the other display tests ill just stop with just the foraging site test