dsh-ui-repair
An early, conservative compatibility layer for visual problems in
DeepSeek Harness plugin
interfaces. It measures rendered DOM, reports narrowly defined layout
anomalies, and can apply reversible scoped CSS without editing another
plugin's source or package files.
Full specification ·
DSH integration investigation
Installation
Install the published npm package by name:
dsh plugin --profile web add @yadsh/dsh-ui-repair
To remove the plugin:
dsh plugin --profile web remove @yadsh/dsh-ui-repair
Restart the DeepSeek Harness host if bundle hot reload does not pick up the newly installed plugin or browser client.
Current proof of concept
This first implementation slice includes:
- an installable Host package and classic DSH browser bundle;
- semantic repair roots instead of coupling to hashed CSS-module classes;
R001 repeated-row icon alignment diagnostics;R002 repeated-row icon size consistency diagnostics;R003/R004 repeated-row horizontal and vertical diagnostics;R005/R006 unexpected horizontal and vertical overflow diagnostics;R007 clipped-content diagnostics;R008 flex-shrink and R009 missing-min-width diagnostics;R010 icon-to-label gap and R011 repeated-row padding diagnostics;R012 clipped text and R013 outside-parent diagnostics;observe, suggest, and conservative auto runtime modes;- persistent Host settings and a configuration card on the Plugins page;
- persistent selector/plugin/rule ignore policies;
- allowlisted CSS writes scoped by per-repair data attributes;
- animation-frame layout stabilization, verification, and rollback;
- in-memory repair history;
- bounded initial scans and mutation/resize-triggered targeted rescans;
- automatic restoration of every owned DOM attribute and style tag on unload.
The default mode is observe. Configuration is persisted by the Host under the
dsh-ui-repair namespace, which is the profile entry id the browser card reads
through ctx.configForms. Generic overflow is reported but not mutated.
An overflow target must opt in with data-dsh-ui-repair-scroll before the
current auto mode can treat it as a safe scroll owner.
Repair roots
The scanner recognizes these stable boundaries:
[data-dsh-ui-repair-root]
[data-dsh-plugin-root]
[data-plugin-root]
li.dsh-plugin-card
[role="dialog"][aria-modal="true"]
Plugin authors can make a fixture or owned surface unambiguous:
<section data-dsh-ui-repair-root="example-plugin">
<div data-dsh-ui-repair-scroll>...</div>
</section>
Repeated row groups may use data-dsh-ui-repair-row-group, with optional
data-dsh-ui-repair-row and data-dsh-ui-repair-icon markers when their
native semantics are not button, a, li, svg, or img.
data-dsh-ui-repair-row-height explicitly permits normalizing an anomalous
row height; without it, R004 remains diagnosis-only.
Potentially ambiguous layout ownership remains diagnosis-only unless the
surface opts in. data-dsh-ui-repair-scroll-x marks a safe horizontal scroll
owner, data-dsh-ui-repair-no-shrink marks a flex item that must preserve its
intrinsic width, and data-dsh-ui-repair-min-width-zero marks a flex/grid item
that may shrink below its content width.
Spacing repairs require data-dsh-ui-repair-gap or
data-dsh-ui-repair-padding on the anomalous row. Text wrapping requires
data-dsh-ui-repair-text-wrap; containment repairs require
data-dsh-ui-repair-contain. Without these ownership markers, R010-R013 are
reported but remain diagnosis-only.
Browser API
The browser module provides ctx.uiRepair for cooperating client plugins:
const report = await ctx.uiRepair.scan()
ctx.uiRepair.setMode('suggest')
await ctx.uiRepair.apply(report.issues[0].id)
ctx.uiRepair.getHistory()
ctx.uiRepair.rollbackAll()
All repairs are temporary in this proof of concept. Unloading the plugin calls
rollbackAll() and removes its observer, generated styles, and marker
attributes.
Settings
The card opens from this bundle's row on the Host's Plugins page and exposes
activation, mode, normal and risky confidence thresholds, startup, mutation, and
resize scanning, manual scan/apply/ignore/rollback actions, session health
counters, and persistent ignored selectors. Risky overflow/clipping repairs can
never be configured below 98% confidence. The row answers every state of its
namespace: while the Host has no settings for this session the card says so and
keeps the scan panel and the rollback action, rather than leaving the section
blank or drawing its defaults as the saved policy — the Plugins page stays
reachable from a browser the settings directory is intentionally closed to.
Development
pnpm --filter @yadsh/dsh-ui-repair check
The current tests cover detection without mutation, scoped vertical and
horizontal overflow repair, sticky-content safety refusal, icon and row
alignment/size outliers, flex constraints, plugin attribution, ResizeObserver,
gap/padding consistency, text overflow, parent containment, manual suggestions,
verification, rollback, client lifecycle, and browser bundle identity.
Not implemented yet
The specification's persistent repair recipes, plugin-version revalidation,
full per-plugin health view, screenshot verification, vision-toolkit
integration, and the remaining P0/P1/P2 rules are intentionally deferred. The
proof of concept establishes the lifecycle, measurement, configuration,
scoping, and rollback seams they will use.
License
MIT. This is an independent community project and is not
affiliated with or endorsed by DeepSeek.
