Fix E2E select locator and add speed limit color mode

E2E fixes:
- Color mode select locator now uses option[value='highway'] filter
  instead of fragile page.locator("select").last()

Speed limit color mode:
- Extract maxspeed tags from BRouter tiledesc (with forward/backward
  direction handling following brouter-web's pattern)
- Color route and chart by speed limit: green ≤30, yellow ≤50,
  orange ≤70, red ≤100, dark red 100+ km/h
- Legend with speed thresholds, hover shows "X km/h"
- i18n: EN "Speed Limit" / DE "Tempolimit"
- Mock fixtures include maxspeed data

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ullrich Schäfer 2026-04-11 04:01:12 +02:00
parent 1e2f6beded
commit 4bcd6137de
No known key found for this signature in database
GPG key ID: A32FF691A0F752D9
9 changed files with 132 additions and 16 deletions

View file

@ -40,6 +40,10 @@ const MOCK_ROUTE_3WP = {
"residential", "residential", "cycleway", "cycleway", "path",
"path", "tertiary", "tertiary", "residential", "residential",
],
maxspeeds: [
"30", "30", "unknown", "unknown", "unknown",
"unknown", "50", "50", "30", "30",
],
};
/**
@ -76,6 +80,9 @@ const MOCK_ROUTE_2WP = {
highways: [
"secondary", "secondary", "cycleway", "cycleway", "residential", "residential",
],
maxspeeds: [
"50", "50", "unknown", "unknown", "30", "30",
],
};
/**

View file

@ -138,8 +138,9 @@ test.describe("Planner", () => {
await expect(page.getByText("Connected")).toBeVisible({ timeout: 15000 });
// Wait for elevation chart to render with the color mode selector
const select = page.locator("select").last();
await expect(select).toBeVisible({ timeout: 10000 });
await expect(page.locator("canvas")).toBeVisible({ timeout: 10000 });
const select = page.locator("select", { has: page.locator("option[value='highway']") });
await expect(select).toBeVisible({ timeout: 5000 });
await expect(select).toHaveValue("plain");
// Switch to elevation
@ -364,9 +365,10 @@ test.describe("Planner", () => {
await expect(page.locator(".leaflet-container")).toBeVisible({ timeout: 10000 });
await expect(page.getByText("Connected")).toBeVisible({ timeout: 15000 });
// Wait for elevation chart color mode selector
const select = page.locator("select").last();
await expect(select).toBeVisible({ timeout: 10000 });
// Wait for the elevation chart to render, then find the color mode select (has a "highway" option)
await expect(page.locator("canvas")).toBeVisible({ timeout: 10000 });
const select = page.locator("select", { has: page.locator("option[value='highway']") });
await expect(select).toBeVisible({ timeout: 5000 });
// Switch to highway (road type) mode
await select.selectOption("highway");
@ -395,8 +397,9 @@ test.describe("Planner", () => {
await expect(page.getByText("Connected")).toBeVisible({ timeout: 15000 });
// Switch to highway mode
const select = page.locator("select").last();
await expect(select).toBeVisible({ timeout: 10000 });
await expect(page.locator("canvas")).toBeVisible({ timeout: 10000 });
const select = page.locator("select", { has: page.locator("option[value='highway']") });
await expect(select).toBeVisible({ timeout: 5000 });
await select.selectOption("highway");
// Hover the canvas to trigger the hover label