Switch the results from list to map view
Easy30 pts~2 min
- Tabs
- View toggles
- Data attributes
Practice app · StayNest
A home-sharing marketplace: destination autocomplete, a two-month date-range calendar, a guests popover with steppers, results with a list/map toggle and a filters modal, listing pages with a photo gallery, a reserve card with a price breakdown, host profiles in a new tab, a wishlist that needs sign-in and a message-host form.
Your starter code already declares TEST_URL — never hardcode a host.
Objective
Open the Kyoto stays, switch from the list to the map view, and preview a stay by clicking its price pin.
Your task
- 1Open TEST_URL and open Kyoto from “Inspiration for your next trip” ([data-testid="destination-tile"][data-destination="kyoto"]).
- 2Assert the List tab (#view-list) is selected and 4 listing cards are shown.
- 3Click the Map tab (#view-map); assert #results-map shows 4 price pins ([data-testid="map-pin"]) and the URL contains layout=map.
- 4Click the $265 pin of Gion Machiya Townhouse ([data-testid="map-pin"][data-listing-id="kyoto-machiya"]).
- 5Assert #map-preview shows “Gion Machiya Townhouse”.
Acceptance criteria
- The Map tab is selected and the map shows 4 price pins.
- The URL records layout=map.
- The preview card shows Gion Machiya Townhouse.
- The test makes at least two assertions.
Fixtures
- guest@staynest.test
- Password
- Nest@2026
- Account name
- Jordan Lee
- Today
- Tuesday, 10 November 2026 (earlier days are disabled)
- Destinations
- Goa · Lisbon · Kyoto · Banff · Cape Town
- Service fee
- 14% of the nightly subtotal
- Guest limits
- Adults 1–16 (adults + children ≤ 16) · infants up to 5 · pets up to 5
- Host verification code
- Shown only on the host profile tab
Selenium WebDriver 4 · Selenium Challenges · StayNest