enduro-trails/docs/work-items/ET-012/04b-ui-test-cases.md

type, work_item_id, title, version, status, created_at, updated_at, authors, related

type	work_item_id	title	version	status	created_at	updated_at	authors	related
ui-test-cases	ET-012	UI Test Cases: Публичные треки на z5-z7	1	draft	2026-06-04	2026-06-04	agent:analyst	ET-008 ET-009 ET-011

UI Test Cases — ET-012: Публичные треки на зумах z5-z7

Базовый URL: https://openclaw.mva154.duckdns.org/enduro/

ET-012 не добавляет новых UI-компонентов — только меняет нижний порог видимости слоя публичных треков с z8 до z5 и тонкие настройки толщины линий/халобокса для малых зумов. UI-тесты проверяют, что:

1. На z5, z6, z7 слой действительно появляется.
2. Hint обновлён или скрыт корректно.
3. Регрессий ET-008/009/011 нет.
4. На спутнике на z5 линии видны и halo не «глушит» подложку.
5. На мобильном viewport всё работает.

Селекторы (унаследованы из ET-008/009/011):

• #terrain-toggle — кнопка попапа слоёв.
• #public-tracks-cb — чекбокс «Публичные треки».
• #public-tracks-zoom-hint — hint «Зум 5+».
• #public-tracks-filters-btn — кнопка «Фильтры…» (видна при включённом слое).
• #sheet-gps-filters — bottom sheet фильтров.
• #gps-source-grid input[value='osm' | 'enduro_russia' | 'wikiloc'] — чекбоксы.
• #base-btn-satellite — кнопка спутника.
• .track-popup / .track-popup-download-btn — popup и кнопка скачивания.
• #map — карта.

Предусловие для всех тестов: в БД test-среды есть треки всех трёх источников (после E2E-PROD-01/02 из ET-009). Все TC выполняются Playwright'ом против test-среды; check-visual подтверждается оператором или визуальным diff-тулом.

Особенность ET-012 — каждый сценарий выставляет zoom программно, чтобы не зависеть от перетаскивания карты. Команда:

window._map.setZoom(N);
window._map.setCenter([37.6, 55.7]); // Москва, по умолчанию

выполняется через page.evaluate(...).

---

TC-UI-01-Z5 — На z=5 слой публичных треков виден

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. screenshot: "et012-01-z5-tracks-visible"
10. check-visual: "На карте при zoom=5 (виден кусок Восточной Европы / ЦФО) поверх подложки нарисованы линии публичных треков как минимум двух разных цветов (по источнику). Линии тонкие, но различимые на дисплее. Hint #public-tracks-zoom-hint скрыт. Чекбокс #public-tracks-cb включён."

---

TC-UI-02-Z6 — На z=6 слой виден, треков больше чем на z5

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(6); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. screenshot: "et012-02-z6-tracks-visible"
10. check-visual: "При zoom=6 (виден кусок Центральной России) на карте видно явно больше линий, чем на z5: появляются треки длиной 5-10 км, которые не прошли фильтр z5. Линии лучше различимы (толще). Hint скрыт."

---

TC-UI-03-Z7 — На z=7 слой виден, регрессия

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(7); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. screenshot: "et012-03-z7-tracks-visible"
10. check-visual: "При zoom=7 видны треки длиной от 2 км и выше (как было до ET-012). На карте — заметная сеть. Поведение должно соответствовать прежнему 'z=8 минус один уровень', но с min_length=2000 (т.е. чуть строже фильтр чем z8). Hint скрыт."

---

TC-UI-04-HINT-OFF — Hint «Зум 5+» скрыт при z=5

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 2000
7. evaluate: window._map.setZoom(5);
8. wait: 1500
9. screenshot: "et012-04-hint-off-z5"
10. check-visual: "Элемент #public-tracks-zoom-hint имеет display:none (не виден в попапе слоёв). Чекбокс «Публичные треки» включён. Никакой подсказки 'нужно увеличить зум' не показано."

---

TC-UI-05-HINT-ON — Hint «Зум 5+» виден при z=4

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 2000
7. evaluate: window._map.setZoom(4);
8. wait: 1500
9. screenshot: "et012-05-hint-on-z4"
10. check-visual: "В попапе слоёв (#terrain-popup) рядом с чекбоксом «Публичные треки» виден hint с текстом «Зум 5+». На карте линий публичных треков нет — vector-source не запрашивает тайлы при zoom < minzoom=5."

---

TC-UI-06-FILTER-Z6 — Фильтр источников работает на z6

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(6); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. screenshot: "et012-06a-z6-all-sources"
10. check-visual: "На z=6 видны треки разных цветов (нескольких источников)."
11. click: "#public-tracks-filters-btn"
12. wait: 800
13. click: "#gps-source-grid input[value='enduro_russia']"
14. wait: 1500
15. screenshot: "et012-06b-z6-no-enduro-russia"
16. check-visual: "Чекбокс EnduroRussia снят. На z=6 линии цвета EnduroRussia (характерный красноватый по дефолтной палитре) исчезли. Линии osm/wikiloc остались. Регрессия фильтра — поведение идентично z=8."

---

TC-UI-07-POPUP-Z6 — Popup трека открывается на z6

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(6); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. click: "#map"
10. wait: 1500
11. screenshot: "et012-07-popup-z6"
12. check-visual: "При клике в линию трека (или близко к ней) открылся popup .track-popup с названием, активностью, длиной, списком источников. Если трек из источника osm — внутри есть кнопка .track-popup-download-btn (ET-011 регрессия). Popup корректно позиционирован, не уходит за границы карты."

---

TC-UI-08-Z11-REGRESS — На z=11 слой по-прежнему виден (регрессия)

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(11); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. screenshot: "et012-08-z11-regress"
10. check-visual: "На zoom=11 слой публичных треков виден; на карте много линий разных цветов; поведение визуально идентично состоянию ДО ET-012 (тот же набор треков, та же толщина 1.5-1.75 px согласно interpolate-выражению)."

---

TC-UI-09-Z12-CUTOFF — На z=12 переход на GeoJSON

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(12); window._map.setCenter([37.6, 55.7]);
8. wait: 5000
9. screenshot: "et012-09-z12-geojson"
10. check-visual: "На zoom=12 публичные треки видны (через GeoJSON-source). В DevTools Network должен быть запрос /api/gps-tracks?bbox=... (а не tiles/12/...). Регрессия cutoff поведения не нарушена."

---

TC-UI-10-Z5-MOBILE — На мобильном при z=5 слой виден

• тип: ui
• viewport: mobile

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
8. wait: 5000
9. screenshot: "et012-10-z5-mobile"
10. check-visual: "На мобильном viewport (375×667) при zoom=5 видны линии публичных треков. Линии тонкие, но различимые (минимум 1 физический пиксель). Hint скрыт. Bottom sheet с настройками слоёв закрывается корректно после клика по карте."

---

TC-UI-11-Z5-SAT — На спутнике на z=5 halo читается, не глушит подложку

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. click: "#base-btn-satellite"
8. wait: 5000
9. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
10. wait: 5000
11. screenshot: "et012-11-z5-satellite-halo"
12. check-visual: "На спутниковой подложке при zoom=5 видны цветные линии треков с тонким белым halo (контур ~1.8 px). Halo делает линии читаемыми на тёмных участках космоснимка, но не превращается в 'пузырь' и не закрывает деталей подложки. Слой gps-tracks-halo-mvt-satellite имеет visibility:visible."

---

TC-UI-12-Z5-Q — Качественная проверка читаемости на z5

• тип: ui
• viewport: desktop
• условие: запускается после E2E-PROD-01 (БД содержит ≥ 200 треков)

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 4000
7. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
8. wait: 5000
9. screenshot: "et012-12-z5-readability"
10. check-visual: "На скриншоте видны 3+ различимых нити (линии длиной ≥ 20 px) в разных квадрантах кадра. Нет 'сплошной заливки' одной зоны (треки не сливаются в большое цветное пятно). Подложка карты остаётся читаемой. Качественная проверка — оператор смотрит и принимает либо отбраковывает. При отбраковке: ужесточить limit/min_length в build_gps_mvt (REQ-F-03)."

---

TC-UI-13-Z5-PAN — Панорамирование на z=5 без зависаний

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. evaluate: window._map.panBy([300, 0]);
10. wait: 2500
11. evaluate: window._map.panBy([0, 300]);
12. wait: 2500
13. evaluate: window._map.panBy([-300, 0]);
14. wait: 2500
15. screenshot: "et012-13-z5-pan-complete"
16. check-visual: "После трёх pan-шагов на z=5 карта показывает Восток ЦФО (или соседний регион). Тайлы соседних областей подгружены, нет 'белых дыр'. Тайл-LRU отрабатывает: возврат на исходную область (центр Москвы) — мгновенный (cache hit). Перфоманс субъективно гладкий, нет блокировок UI."

---

TC-UI-14-Z5-COLOR-ACTIVITY — Color-by-activity на z=5

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. click: "#terrain-toggle"
4. wait: 500
5. click: "#public-tracks-cb"
6. wait: 3000
7. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
8. wait: 4000
9. click: "#public-tracks-filters-btn"
10. wait: 800
11. click: "#gps-color-by-activity"
12. wait: 1500
13. screenshot: "et012-14-z5-color-by-activity"
14. check-visual: "На z=5 активен переключатель «По активности». Линии перекрашены по activity_type (enduro/moto/offroad/bicycle). Видно минимум 2 разных цвета. Регрессия — color-mode тоggle работает идентично z=8+."

---

TC-UI-15-DARK-Z5 — Тёмная тема на z=5

• тип: ui
• viewport: desktop

шаги:

1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.setItem('theme', 'dark'); location.reload();
4. wait: 5000
5. click: "#terrain-toggle"
6. wait: 500
7. click: "#public-tracks-cb"
8. wait: 3000
9. evaluate: window._map.setZoom(5); window._map.setCenter([37.6, 55.7]);
10. wait: 5000
11. screenshot: "et012-15-z5-dark"
12. check-visual: "При тёмной теме на z=5 линии публичных треков видны и читаются на тёмной подложке. Цвета линий не изменились (палитра задана в коде). Регрессия dark-theme."

---

Заметки по запуску

• Все TC можно автоматизировать в Playwright; check-visual — через expect(page).toHaveScreenshot(...) или визуальный baseline.
• Скриншоты складываются в docs/work-items/ET-012/screenshots/ и пришиваются к 13-test-report.md.
• При первой регрессии TC-UI-12-Z5-Q (нечитаемая карта на z5) возвращаемся к разработчику с просьбой ужесточить min_length_m/limit для z5 (REQ-F-03) — это норма калибровки, не баг ETLкета.