36 lines
2.9 KiB
Markdown
36 lines
2.9 KiB
Markdown
# Эталонные веб-скриншоты forbion (для Fd-сверки)
|
||
|
||
Здесь лежат **эталонные скриншоты мобильной веб-версии forbion** — с ними Roborazzi-рендеры
|
||
нативных экранов сравниваются попиксельно (метрика Fd, программа 1:1). Одна папка на приложение:
|
||
`docs/app-map/reference/<app>/<screen>.png`.
|
||
|
||
## Ширина — 360dp (Figma-фрейм)
|
||
Рендер и эталон — **360dp** (не 390!). В screenshot-тестах Roborazzi:
|
||
`@Config(sdk=[34], qualifiers="w360dp-h800dp-xxhdpi")`. Эталонный веб-скрин тоже снимать на
|
||
ширине **360 CSS-px**.
|
||
|
||
## Как снять мобильную вёрстку (важно!)
|
||
`resize_window` НЕ ужимает вьюпорт общего Chrome (отдаёт десктоп 1480px). Снимаем через
|
||
**same-origin iframe 360px** внутри страницы forbion ([[f7-mobile-web-iframe-technique]]):
|
||
инжектируешь `<iframe width=360 src="/index.php/apps/<app>/…">` в открытую страницу forbion
|
||
(Browser 1, сессия `cloude`), ждёшь загрузки, скриншотишь регион iframe. Мобильная тема
|
||
включается по ширине iframe (у него свой вьюпорт 360px).
|
||
|
||
## ⚠️ Приватность — НЕ светить реальные данные
|
||
`cloude` — реальный рабочий аккаунт: на экранах видны настоящие файлы/письма/договоры/контакты.
|
||
**В эталон НЕ коммитим реальные данные.** Снимаем:
|
||
- пустые состояния, ИЛИ
|
||
- свои тест-объекты `bmob-*` (mail/085), ИЛИ
|
||
- кадрируем так, чтобы в кадре был только UI-каркас (шапки/панели/кнопки/меню), без реального
|
||
контента; персональные имена/суммы/адреса замазать/обрезать.
|
||
Скрин с чужими реальными данными в git — недопустим.
|
||
|
||
## Что снимать (по карте `<app>.md`)
|
||
Каждый экран из карты + всплывающие меню (mail/087): список/деталь/форма/модалки/пустые
|
||
состояния/контекстные «⋯». Имя файла = слаг экрана (`list.png`, `editor.png`, `menu-message.png`).
|
||
|
||
## Кто заводит
|
||
Владелец приложения (`b-mob-<x>`) снимает эталоны СВОИХ экранов и коммитит сюда; лид — оболочку
|
||
(`shell/`). Затем — Roborazzi-тест нативного экрана → PNG → визуальное сравнение с этим эталоном,
|
||
расхождения в `<app>.diff.md` (тип `Д`).
|