Files
houseplan-card/demo/smoke_space_create_display_defaults.mjs
Claude 91a008db9c feat(space): диалог «Пространство» по референсу — серия 1 из четырёх (#600)
§4 SPEC.md референса, четыре карточки: Basics (имя и масштаб в сетке 1fr/175,
подложка двумя choice-карточками, callout о пересчёте масштаба), Appearance
(строка-тумблер границ с иконкой и подписью, сегмент стиля стен с образцами
линии, плашка цвета с hex/прозрачностью/Reset, сегмент заливки с деталями
режима, компактный список «Видимые слои» с логикой «включено = видно» — К2),
Room cards (строка-тумблер названий, четыре плитки значений с отключением и
callout-ссылкой, слайдер размера с числом, концами и «Сбросить до 100%», образец
карточки внутри блока на тинте — Q2), Sun & light (сегмент фона, плашка цвета
фона, радио «свет через окна» в строку, север селектом с компасом 44 px и полем
градусов, строка-тумблер свечения).

Одна форма на два рантайма. `renderSpaceForm` в `editors/space-form.ts`
собирает тело и футер; редакторский вход (`space-settings-dialog.ts`) и
онбординг подают порт с тем, что у них различается, и сами рисуют
`<hp-dialog data-kind=…>` — контракт #489 требует литеральный kind. Копия
разметки онбординга на 300 строк удалена; локальные дубли CELL_CM_* и
strictNumber там же — тоже («одно число — один источник»).

К10 (решение владельца Q1): Save активен только при изменениях и без ошибок,
в футере «Есть несохранённые изменения» либо ссылка «Проверьте поля: N» к
первому ошибочному; «✕», Cancel и Escape с изменениями спрашивают через
`_confirmDanger`, без изменений закрывают сразу. Снимок делается при открытии
(`editors/space-form-state.ts`, WeakMap по хосту) — `SpaceDialogState` не
получил ни одного ключа. Валидация: имя, подложка без изображения, диапазон
температур, север 0–359 — с `aria-invalid` и текстом под полем.

Строки. 51 новый ключ живёт в ленивом словаре `i18n/settings` (приём
#423/#459), не в первом кадре: стартовый граф 291 260 при потолке 292 500.
Отдельный словарь, а не `support`, — иначе онбординг тянул бы весь словарь
редактора ради одной формы. 11 существующих ключей переименованы по Q6
(«Space name», «Appearance», «Room cards», «Draw it myself», «Zigbee signal
next to devices»…), 9 мёртвых удалены из четырёх локалей. `hp-color-opacity`
получил `hide-label`: подпись рисует плашка, `label` остаётся для title/aria и
`smoke_color_picker_consumers` проходит без правок (AC5).

Смоки. Переписаны осознанно (К6 снят), каждый — с пометкой #600 у правки:
smoke_hide_layers (компактные строки, инверсия К2 проверяется кликом),
smoke_ux_fixes (сегмент, строка-тумблер, поля °C, ширина 560 — Q7),
smoke_dialog_footer_width (560 для form-shell), smoke_temp_fill (два поля по
id), smoke_settings_dialog_cards (три сегмента), smoke_space_settings и
smoke_space_create_display_defaults и smoke_lazy_editor_chunk (choice-карточка
по смыслу, не по индексу — порядок §4.2 draw → file), smoke_space_scale_defaults
(поле с единицей). Новый фокусный свидетель demo/smoke_space_settings_form.mjs:
состав карточек и отсутствие старой разметки, оболочка 560 и один скроллер,
цели 44, запись каждого нового контрола в свой ключ, Save/dirty/вопрос при
закрытии, семь контрольных ширин (320…1920).

Мутанты: space-fill-segment-writes-a-neighbour-key,
space-save-enabled-without-changes, space-discard-without-asking,
space-layer-toggle-loses-inversion.

Контрактные тесты: `houseplan-source.mjs` дописывает общие модули диалогов к
логическому исходнику; коллектор i18n видит `help(...)` порта и `shelp(...)`
(заодно встал на учёт `radar.help`, проходивший мимо счётчика — 30 → 35).

Потолок ленивого редакторского графа 225 900 → 236 300 (замер 235 560) с
разбором в bundle-budget.mjs: словарь на четыре локали и подписи — большая
часть роста; промежуточно, итог в конце серий.

Гейты: typecheck, build, bundle:sync, npm test 2792 pass (красным был только
потолок — поднят с доводом), 10 смоков пространства зелёные,
smoke_color_picker_consumers без правок, mutation-gate --check.

Issue: #600
User-Visible: no
2026-09-20 10:28:51 +03:00

141 lines
6.3 KiB
JavaScript

import { launch, checkAll, finish } from './serve.mjs';
const { page, browser } = await launch();
const res = await page.evaluate(async () => {
const out = {};
const c = window.__card;
const sr = () => c.shadowRoot || c.renderRoot;
const state = () => ({
source: c._spaceDialog?.source,
showBorders: c._spaceDialog?.showBorders,
showNames: c._spaceDialog?.showNames,
displayTouched: c._spaceDialog?.displayTouched,
});
// #600 §4.2: подложка — две choice-карточки (draw → file), тумблеры —
// полные строки набора; выбираем по смыслу, а не по индексу.
const choose = async (source) => {
const wanted = c._t(source === 'file' ? 'space.source_file' : 'space.source_draw');
[...sr().querySelectorAll('hp-dialog input[name="plansrc"]')]
.find((radio) => radio.closest('label')?.textContent.includes(wanted)).click();
await c.updateComplete;
};
const toggle = async (key) => {
const label = [...sr().querySelectorAll('hp-dialog .hpf-toggle')]
.find((row) => row.querySelector('.hpf-toggle-title')?.textContent.includes(c._t(key)));
label.querySelector('input[type="checkbox"]').click();
await c.updateComplete;
};
c._openSpaceDialog('create'); await c.updateComplete;
out.freshFile = state();
await choose('draw');
out.untouchedDraw = state();
await choose('file');
out.untouchedFileAgain = state();
await choose('draw');
await toggle('space.show_borders');
out.mixedTouched = state();
await choose('file');
out.mixedFile = state();
await choose('draw');
out.mixedDrawAgain = state();
c._spaceDialog = { ...c._spaceDialog, title: 'Mixed display defaults' };
await c._saveSpaceDialog(); await c.updateComplete;
const mixed = c._serverCfg.spaces.find((s) => s.title === 'Mixed display defaults');
out.savedMixed = [mixed?.settings?.show_borders, mixed?.settings?.show_names];
out.savedMixedHasEmptyWallCatalog = Array.isArray(mixed?.wall_segments)
&& mixed.wall_segments.length === 0;
c._openSpaceDialog('edit', mixed.id); await c.updateComplete;
out.reopenedMixed = state();
await choose('file');
out.editSourcePreservesPair = state();
const beforeCancel = JSON.stringify(c._serverCfg);
c._spaceDialog = null; await c.updateComplete;
c._openSpaceDialog('create'); await c.updateComplete;
await choose('draw');
await toggle('space.show_names');
c._spaceDialog = null; await c.updateComplete;
out.cancelDidNotWrite = JSON.stringify(c._serverCfg) === beforeCancel;
c._openSpaceDialog('create'); await c.updateComplete;
out.freshAfterCancel = state();
c._spaceDialog = null;
c._importQueue = ['Floor one', 'Floor two'];
c._importTotal = 2;
c._openNextImport(); await c.updateComplete;
out.onboardingFirst = { title: c._spaceDialog.title, ...state() };
await choose('draw');
await toggle('space.show_borders');
c._skipImport(); await c.updateComplete;
out.onboardingSecond = { title: c._spaceDialog.title, ...state() };
c._importQueue = [];
c._importTotal = 0;
c._spaceDialog = null;
c._openSpaceDialog('create'); await c.updateComplete;
const existingPlan = c._serverCfg.spaces.find((s) => s.plan_url)?.plan_url;
c._spaceDialog = {
...c._spaceDialog, title: 'File display defaults', planUrl: existingPlan || '/local/houseplan/plan.svg',
};
await c._saveSpaceDialog(); await c.updateComplete;
const file = c._serverCfg.spaces.find((s) => s.title === 'File display defaults');
out.savedFileDefaults = [file?.settings?.show_borders, file?.settings?.show_names];
// #324: a server-rejected create must not survive merely because the dialog
// mutated the reactive config before config/set. Reproduce invalid_format,
// then let config/get return the last accepted document.
const serverTruth = structuredClone(c._serverCfg);
const baseCall = c.hass.callWS.bind(c.hass);
let rejectedCandidate = null;
let authoritativeReads = 0;
c.hass = { ...c.hass, callWS: async (message) => {
if (message.type === 'houseplan/config/set') {
rejectedCandidate = structuredClone(message.config);
const error = new Error('v8+ space requires wall_segments');
error.code = 'invalid_format';
throw error;
}
if (message.type === 'houseplan/config/get') {
authoritativeReads++;
return { config: structuredClone(serverTruth), rev: c._cfgRev, can_write: true };
}
return baseCall(message);
} };
c._openSpaceDialog('create'); await c.updateComplete;
await choose('draw');
c._spaceDialog = { ...c._spaceDialog, title: 'Rejected ghost' };
await c._saveSpaceDialog(); await c.updateComplete;
const rejectedSpace = rejectedCandidate?.spaces?.find((s) => s.title === 'Rejected ghost');
out.rejectedCandidateHasEmptyWallCatalog = Array.isArray(rejectedSpace?.wall_segments)
&& rejectedSpace.wall_segments.length === 0;
out.rejectedCreateReloadsServerTruth = authoritativeReads === 1
&& !c._serverCfg.spaces.some((s) => s.title === 'Rejected ghost');
out.rejectedCreateKeepsDialogForRetry = c._spaceDialog?.title === 'Rejected ghost'
&& c._spaceDialog.busy === false;
return out;
});
checkAll(res, {
freshFile: { source: 'file', showBorders: false, showNames: false, displayTouched: false },
untouchedDraw: { source: 'draw', showBorders: true, showNames: true, displayTouched: false },
untouchedFileAgain: { source: 'file', showBorders: false, showNames: false, displayTouched: false },
mixedTouched: { source: 'draw', showBorders: false, showNames: true, displayTouched: true },
mixedFile: { source: 'file', showBorders: false, showNames: true, displayTouched: true },
mixedDrawAgain: { source: 'draw', showBorders: false, showNames: true, displayTouched: true },
savedMixed: [false, true],
reopenedMixed: { source: 'draw', showBorders: false, showNames: true, displayTouched: true },
editSourcePreservesPair: { source: 'file', showBorders: false, showNames: true, displayTouched: true },
freshAfterCancel: { source: 'file', showBorders: false, showNames: false, displayTouched: false },
onboardingFirst: {
title: 'Floor one', source: 'file', showBorders: false, showNames: false, displayTouched: false,
},
onboardingSecond: {
title: 'Floor two', source: 'file', showBorders: false, showNames: false, displayTouched: false,
},
savedFileDefaults: [false, false],
});
await finish(browser, res);