Keep selected stop visible on mobile
This commit is contained in:
parent
827435bd92
commit
98b5951cbb
2 changed files with 49 additions and 2 deletions
|
|
@ -243,3 +243,38 @@ def test_mobile_layout_opens_results_sheet(chromium_browser: Any, flask_url: str
|
|||
playwright_api.expect(page.locator("#sidebar")).to_have_class(re.compile("panel-open"))
|
||||
playwright_api.expect(page.get_by_label("Location or ATCO code")).to_be_visible()
|
||||
page.close()
|
||||
|
||||
|
||||
def test_mobile_selected_stop_stays_above_detail_sheet(
|
||||
chromium_browser: Any, flask_url: str
|
||||
) -> None:
|
||||
"""A shared stop is centred in the visible map area above the mobile sheet."""
|
||||
page = chromium_browser.new_page(viewport={"width": 390, "height": 844})
|
||||
stop = {
|
||||
"type": "node", "id": 485403178, "lat": 51.439385, "lon": -2.601798,
|
||||
"name": "West Street", "atco_code": "0100BRA10073", "indicator": None,
|
||||
"bearing": "SW", "transport_type": "Bus stop",
|
||||
"tags": {"highway": "bus_stop", "naptan:Bearing": "SW"},
|
||||
}
|
||||
page.route("**/api/stop/node/485403178", lambda route: route.fulfill(json={"stop": stop}))
|
||||
page.route("**/api/stop/node/485403178/routes", lambda route: route.fulfill(json={"routes": []}))
|
||||
page.route("**/api/stops?*", lambda route: route.fulfill(json={
|
||||
"kind": "location",
|
||||
"location": {"lat": stop["lat"], "lon": stop["lon"], "label": stop["name"]},
|
||||
"stops": [stop],
|
||||
}))
|
||||
page.route("**/api/stops/in-bounds?*", lambda route: route.fulfill(json={
|
||||
"kind": "map", "stops": [stop],
|
||||
}))
|
||||
page.goto(f"{flask_url}?node=485403178", wait_until="networkidle")
|
||||
playwright_api.expect(page.locator("#stop-name")).to_have_text("West Street")
|
||||
playwright_api.expect(page.locator(".selected-stop-marker")).to_be_visible()
|
||||
page.wait_for_timeout(400)
|
||||
position = page.evaluate("""() => {
|
||||
const point = map.latLngToContainerPoint(selectedMarkerHalo.getLatLng());
|
||||
const mapRect = document.getElementById('map').getBoundingClientRect();
|
||||
const sheetRect = document.getElementById('sidebar').getBoundingClientRect();
|
||||
return {markerY: point.y, visibleBottom: sheetRect.top - mapRect.top};
|
||||
}""")
|
||||
assert 0 < position["markerY"] < position["visibleBottom"]
|
||||
page.close()
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue