Regenerate the gallery so a row carries its identity in the DOM

The smoke check reads a data attribute to confirm a deep link selected the row it asked
for. That attribute now exists in the built page, so the gate measures the contract it
was written against instead of reading undefined.
This commit is contained in:
doxa-maps-88655c70 2026-09-22 16:07:21 +00:00
parent 56dbb6770d
commit 0f5ffa28b2

View file

@ -57,7 +57,18 @@ code{font-family:ui-monospace,Menlo,monospace}
<nav id="nav" aria-label="Maps · sorted by capability 5 → 1" v-show="navOpen">
<div class="grp" v-for="grp in groups" :key="grp.cap">
<div class="tier"><span class="cap">CAP {{ grp.cap }}</span><span class="tl">{{ grp.label }}</span><span class="td">{{ grp.rows.length }}</span></div>
<button v-for="r in grp.rows" :key="r.key" type="button" class="row" :class="{ in: r.kind === 'instance' }"
<!-- data-k EXPOSES THE ROW IDENTITY TO THE DOM. A Vue :key is a RECONCILIATION HINT and is NOT
rendered as an attribute — a distinction that had smoke:gallery failing on a working page.
That gate reads row.dataset.k to confirm a deep link selected the row it asked for; with no
such attribute it read undefined and reported "deep link resolved to undefined".
MEASURED 2026-09-22: data-k appeared ZERO times in this generator and zero times in the
built page, while the gallery itself mounts its elements correctly — a false RED, which is
as corrosive as a false green because it gets the gate switched off.
Asserting on the rendered LABEL instead would be worse: it couples a machine check to
display text, so renaming a profile would break the gate. Identity belongs in the DOM.
NOTE: this markup lives inside a TEMPLATE LITERAL — no backticks anywhere in this comment,
or the literal ends here and the rest of the file is parsed as code. -->
<button v-for="r in grp.rows" :key="r.key" :data-k="r.key" type="button" class="row" :class="{ in: r.kind === 'instance' }"
:aria-current="String(activeKey === r.key)" @click="go(r.key)">
<span>{{ r.label }}</span><code>&lt;{{ r.tag }}&gt;</code>
</button>