Files
f7cloud_mobile/docs/app-map/reference/README.md
T

36 lines
2.9 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Эталонные веб-скриншоты 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` (тип `Д`).