---
type: ui-test-cases
work_item_id: ET-013
title: "UI Test Cases: Перепады высот на z9-z11"
version: 1
status: draft
created_at: 2026-06-04
updated_at: 2026-06-04
authors:
  - "agent:analyst"
related:
  - "PH-6.terrain"
  - "ET-007"
---

# UI Test Cases — ET-013: Перепады высот на zoom z9-z11

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

ET-013 — frontend-калибровка: hillshade и TRI используют
zoom-aware paint, UI-минзум hillshade понижен с 10 до 9. UI-тесты
проверяют:

1. На z9 чекбокс «Тени рельефа» активен, hint скрыт, hillshade виден.
2. На z9-z11 перепады «бросаются в глаза» (качественно).
3. На z8 регрессии нет (TRI выглядит как было).
4. На z14 hillshade не «перегрет» (регрессия).
5. Тёмная тема и спутник совместимы.
6. Мобильный viewport работает.
7. Persistence (localStorage) переживает F5.

Селекторы (из текущего `index.html`):
- `#terrain-toggle` — кнопка попапа слоёв рельефа (правая панель).
- `#terrain-popup` — сам попап со списком чекбоксов.
- `#terrain-hillshade-cb` — чекбокс «Тени рельефа».
- `#terrain-hillshade-hint` — hint «Зум 9+» (ET-013) / «Зум 10+» (до ET-013).
- `#terrain-tri-cb` — чекбокс «Перепады».
- `#base-btn-satellite` — кнопка спутника.
- `#btn-theme` — переключатель тёмная/светлая.
- `#map` — карта.

Все тесты выставляют zoom программно через `page.evaluate`:
```js
window._map.setZoom(N);
window._map.setCenter([37.6, 54.5]);  // юг МО / Ока, холмистый район
```

Координата `[37.6, 54.5]` (юг Москвы / Кашира / Ока) выбрана как
«заведомо холмистая зона ЦФО» с явным TRI/hillshade.

Скриншоты складываются в `docs/work-items/ET-013/screenshots/`
и пришиваются к `13-test-report.md`. Для качественных AC-07/08/09
оператор сравнивает с baseline скриншотами «до ET-013» (тоже в
`screenshots/baseline/`).

---

### TC-UI-01-Z9 — На z=9 hillshade доступен и виден

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. evaluate: window._map.setZoom(9); window._map.setCenter([37.6, 54.5]);
8. wait: 3000
9. click: "#terrain-toggle"
10. wait: 800
11. screenshot: "et013-01-z9-popup"
12. check-visual: "В попапе #terrain-popup чекбокс «Тени рельефа» (#terrain-hillshade-cb) НЕ disabled, текст не серый. Hint #terrain-hillshade-hint имеет display:none (текст «Зум 9+» не виден). Чекбокс «Перепады» (#terrain-tri-cb) также доступен."
13. click: "#terrain-hillshade-cb"
14. click: "#terrain-tri-cb"
15. wait: 4000
16. screenshot: "et013-01-z9-tracks-visible"
17. check-visual: "На карте при zoom=9 виден район юга Москвы / Оки. Поверх подложки нарисованы тени рельефа (hillshade) — тёмные склоны заметны на холмах вдоль реки. TRI («Перепады») рисует цветные пятна шероховатых зон. Оба слоя читаются, рельеф выразительный."

---

### TC-UI-02-Z8-REGRESS — Регрессия z=8: TRI выглядит как до ET-013

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. wait: 800
9. click: "#terrain-tri-cb"
10. wait: 2000
11. evaluate: window._map.setZoom(8); window._map.setCenter([37.6, 54.5]);
12. wait: 4000
13. screenshot: "et013-02-z8-tri-regress"
14. check-visual: "На z=8 виден слой «Перепады» в опубликованном виде PH-6: opacity ~0.70, ресемпл «жёсткий» (граница 30-метровых клеток SRTM может быть видна, но это норма после ET-013). Слой hillshade выключен. Сравнение с baseline скриншотом 'before-ET-013-z8.png' — визуально близко, без явных регрессий."

---

### TC-UI-03-Z9-Q — Качественная читаемость перепадов на z=9

- тип: ui
- viewport: desktop
- условие: оба слоя включены

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. wait: 500
9. click: "#terrain-hillshade-cb"
10. click: "#terrain-tri-cb"
11. wait: 2000
12. evaluate: window._map.setZoom(9); window._map.setCenter([37.6, 54.5]);
13. wait: 5000
14. screenshot: "et013-03-z9-readable"
15. check-visual: "На z=9 рельеф читается явно: тени по склонам холмов, цветные пятна TRI выделяют шероховатые зоны (склоны вдоль Оки, овраги). Не должно быть впечатления 'плоской карты'. Оператор сравнивает с baseline 'before-ET-013-z9.png' и подтверждает: 'перепады стали выразительнее' или 'минимум не хуже z8'. При отказе — фиксировать в 13-test-report.md и итеративно корректировать stops в HILLSHADE_PAINT/TRI_PAINT."

---

### TC-UI-04-Z10-Q — Качественная читаемость на z=10

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#terrain-hillshade-cb"
9. click: "#terrain-tri-cb"
10. wait: 2000
11. evaluate: window._map.setZoom(10); window._map.setCenter([37.6, 54.5]);
12. wait: 5000
13. screenshot: "et013-04-z10-readable"
14. check-visual: "На z=10 в фокусе несколько холмов с явными склонами. Hillshade рисует тени с выраженным контрастом (raster-contrast 0.35 в paint-выражении). TRI выделяет шероховатости. Сравнение с baseline 'before-ET-013-z10.png' — стало явно выразительнее. Подложка под слоями ещё читается (opacity 0.60 + 0.85 не превращают карту в кашу)."

---

### TC-UI-05-Z11-Q — Качественная читаемость на z=11

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#terrain-hillshade-cb"
9. click: "#terrain-tri-cb"
10. wait: 2000
11. evaluate: window._map.setZoom(11); window._map.setCenter([37.6, 54.5]);
12. wait: 5000
13. screenshot: "et013-05-z11-readable"
14. check-visual: "На z=11 виден небольшой район (несколько км в кадре). Перепады «прорисованы», отдельные склоны различимы. Сравнение с baseline 'before-ET-013-z11.png' — выразительнее. Дороги/грунтовки/POI остаются читаемыми поверх рельефа (z-order: terrain ниже trails/POI, проверено по applyTerrainLayer)."

---

### TC-UI-06-Z14-REGRESS — Регрессия z=14: hillshade не перегрет

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#terrain-hillshade-cb"
9. wait: 2000
10. evaluate: window._map.setZoom(14); window._map.setCenter([37.6, 54.5]);
11. wait: 5000
12. screenshot: "et013-06-z14-regress"
13. check-visual: "На z=14 hillshade выглядит так, как до ET-013: лёгкая «плёнка» теней с opacity ≈ 0.40 и raster-contrast ≈ 0. Никакого перегретого контраста. Подложка отчётливо видна. Сравнение с baseline 'before-ET-013-z14.png' — без отличий."

---

### TC-UI-07-Z9-MOBILE — Hillshade на мобильном viewport на z=9

- тип: ui
- viewport: mobile

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. evaluate: window._map.setZoom(9); window._map.setCenter([37.6, 54.5]);
8. wait: 3000
9. click: "#terrain-toggle"
10. wait: 800
11. screenshot: "et013-07-z9-mobile-popup"
12. check-visual: "На мобильном viewport (375×667) попап рельефа открыт, чекбокс «Тени рельефа» доступен, hint скрыт. Чекбокс «Перепады» доступен. Layout не сломан."
13. click: "#terrain-hillshade-cb"
14. click: "#terrain-tri-cb"
15. wait: 4000
16. screenshot: "et013-07-z9-mobile-tracks"
17. check-visual: "На мобильном на z=9 видны тени рельефа и пятна TRI. Перепады читаются. Layout верхней/нижней панелей не перекрывает карту."

---

### TC-UI-08-Z10-SAT-Q — Спутник + hillshade на z=10

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#base-btn-satellite"
9. wait: 4000
10. click: "#terrain-hillshade-cb"
11. wait: 2000
12. evaluate: window._map.setZoom(10); window._map.setCenter([37.6, 54.5]);
13. wait: 5000
14. screenshot: "et013-08-z10-sat"
15. check-visual: "На спутниковой подложке поверх космоснимка видны тени hillshade. Подложка под ними различима — деревья, реки, поля по-прежнему читаются. Hillshade не превращает снимок в «серую плёнку». При отказе (слой глушит снимок) — открыть итерацию: либо снизить opacity на спутнике через отдельный layer-paint, либо документировать как known issue."

---

### TC-UI-09-Z10-DARK-Q — Тёмная тема + hillshade на z=10

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: localStorage.setItem('theme', 'dark'); location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#terrain-hillshade-cb"
9. click: "#terrain-tri-cb"
10. wait: 2000
11. evaluate: window._map.setZoom(10); window._map.setCenter([37.6, 54.5]);
12. wait: 5000
13. screenshot: "et013-09-z10-dark"
14. check-visual: "На тёмной теме при z=10 видны и hillshade, и TRI. Тени не сливаются с тёмной подложкой. Цвета TRI читаются. Если визуально слои «съедают карту» — фиксируется как известная проблема для будущей итерации (theme-specific paint, ADR-0001 в follow-up)."

---

### TC-UI-10-PERSIST — Состояние слоёв переживает F5

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#terrain-hillshade-cb"
9. click: "#terrain-tri-cb"
10. wait: 1500
11. evaluate: window._map.setZoom(10); window._map.setCenter([37.6, 54.5]);
12. wait: 4000
13. screenshot: "et013-10a-before-reload"
14. check-visual: "Оба слоя видны на z=10."
15. evaluate: location.reload();
16. wait: 6000
17. evaluate: window._map.setZoom(10); window._map.setCenter([37.6, 54.5]);
18. wait: 4000
19. screenshot: "et013-10b-after-reload"
20. check-visual: "После reload оба слоя автоматически восстановились (через restoreTerrainState). Чекбоксы в #terrain-popup всё ещё checked. localStorage 'terrain-hillshade'='1', 'terrain-tri'='1'."

---

### TC-UI-11-NETWORK-Q — Сетевой объём (M-10)

- тип: ui (network)
- viewport: desktop
- инструмент: DevTools Network

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. open: DevTools Network, filter "/terrain/"
8. clear network log
9. click: "#terrain-toggle"
10. click: "#terrain-hillshade-cb"
11. click: "#terrain-tri-cb"
12. evaluate: window._map.setZoom(8); window._map.setCenter([37.6, 54.5]);
13. wait: 3500
14. evaluate: window._map.setZoom(9);
15. wait: 3500
16. evaluate: window._map.setZoom(10);
17. wait: 3500
18. evaluate: window._map.setZoom(11);
19. wait: 3500
20. record: суммарный transferred size в Network
21. check-visual: "Сравнение с baseline 'before-ET-013-network-z8-z11.txt' (записанным до начала ET-013): рост ≤ 135%. Если выше — анализ: какие тайлы добавились, оправдано ли. Фиксация в 13-test-report.md."

---

### TC-UI-12-Z9-PAN — Панорамирование на z=9 без лагов

- тип: ui
- viewport: desktop

шаги:
1. navigate: https://openclaw.mva154.duckdns.org/enduro/
2. wait: 5000
3. evaluate: localStorage.clear();
4. wait: 500
5. evaluate: location.reload();
6. wait: 5000
7. click: "#terrain-toggle"
8. click: "#terrain-hillshade-cb"
9. click: "#terrain-tri-cb"
10. wait: 2000
11. evaluate: window._map.setZoom(9); window._map.setCenter([37.6, 54.5]);
12. wait: 5000
13. evaluate: window._map.panBy([400, 0]);
14. wait: 3000
15. evaluate: window._map.panBy([0, 400]);
16. wait: 3000
17. evaluate: window._map.panBy([-400, 0]);
18. wait: 3000
19. screenshot: "et013-12-z9-pan"
20. check-visual: "После трёх pan-шагов карта показывает соседние регионы. Тайлы догружены, нет 'белых дыр' в hillshade/TRI. Возврат к исходному центру — мгновенный (browser cache). UI не блокируется, нет визуальных лагов."

---

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

- TC-UI-03..05 (Q-критерии) — качественные. Оператор сравнивает
  скриншот с baseline («до ET-013»). Baseline записывается **до**
  начала разработки ET-013 и кладётся в
  `docs/work-items/ET-013/screenshots/baseline/`.
- TC-UI-08 (SAT-Q) и TC-UI-09 (DARK-Q) — допустимо «known issue»
  с фиксацией в `13-test-report.md`. Если визуальная регрессия
  обнаружена — открывается follow-up задача по theme/sat-specific paint.
- При отказе TC-UI-03/04/05 — корректировка stops в
  `HILLSHADE_PAINT`/`TRI_PAINT`, новый прогон. Это калибровка, а не баг.
- При отказе TC-UI-06 (z14 регрессия) — баг калибровки stops,
  должен быть исправлен.
- TC-UI-11 (NETWORK-Q) — pre/post замеры; baseline записывается
  до старта работ над ET-013.

### Координаты для тестов

| Координаты | Регион | Зачем |
|---|---|---|
| `[37.6, 54.5]` | юг МО / Кашира / Ока | холмистый, выраженный hillshade и TRI |
| `[37.6, 55.7]` | центр Москвы | плоский, контроль «город всё равно читается» (опционально) |
| `[38.6, 54.0]` | Тула | холмы юга ЦФО, альтернатива для AC-08 |

По умолчанию все TC используют `[37.6, 54.5]`.