Repository navigation
fix(marketplace): render the tool-row switch with official 0.78.1's recipes - #29
Merged
Merged
Conversation
The plugin detail page's per-tool rows render upstream 0.18's shared switch, whose checked track is the grey --sand-fill-control-checked and whose knob is upstream's own. Official 0.78.1 renders the same control with its own Switch: an accent-primary track and a luminous knob. These guards pin the port's contract for that control before the port changes it. The switch's own recipes are written out in the test rather than read from the port, so a port that swapped official's recipes for upstream's cannot satisfy itself. The guard evaluates the port's own component and reads what it renders: the button's attribute set, the track's recipe and the knob's. A second guard reads the label the port writes into the chunk, because upstream's extra-i18n pass localizes only the Enable half of it and the enabled branch therefore reads "Disable <name>" inside a Chinese page. The token guard reads the union of upstream 0.18's stylesheet and this repository's official CSS companions, so it bites on a runner that carries no upstream payload at all, and it proves that every token the switch's recipes read is declared in both the light and the dark .sand-plugins-dialog block with official's own values. Co-authored-by: Mavis <mavis@local>
…ecipes
Official 0.78.1's plugin detail page draws each tool row's on/off switch
with its own Switch: the checked track is the accent primary and the knob is
the luminous surface. Upstream 0.18 draws the same control with its shared
switch, whose checked track is the grey `--sand-fill-control-checked`, so the
rebuild rendered a grey switch where official renders a blue one.
The detail view patch now swaps the one tool-row switch call site for an
injected component that carries official's own class strings. The class strings
are byte-exact against official's own switch recipe table in
`index.eager-app-D1juOWZp.js` (`SD` and its knob recipes `xD`) and against
the class attribute on the running official app's live switch. The injected
component reproduces official's DOM exactly — the same five attributes on the
button and the same `aria-hidden` span — and official's class string is passed
straight through rather than through the chunk's `k()` helper, which would
prepend a marker class and break the byte-for-byte match.
Five official rules that upstream 0.18's stylesheet does not declare are lifted
verbatim into the detail companion: the track's 0.5px inset rim, the track's
minimum width and maximum height, the knob's drop shadow and the knob's
checked offset.
The dialog's token scope now declares the five tokens the switch reads and
upstream 0.18 does not declare: `--sand-border-quaternary-translucent`,
`--sand-shadow-control`, `--sand-bg-accent-primary-hover`,
`--sand-bg-accent-primary-disabled` and `--sand-bg-secondary-disabled`.
Without the first two the track's rim and the knob's shadow resolve to
invalid values at computed-value time; without the third the track loses its
background while the pointer is over it. Their values are official's own.
The tool row's label is aligned with official's too: official builds it from
the locale ids `y5UgU8` ("Disable {0}" / "停用 {0}") and `FZtBeR`
("Enable {0}" / "启用 {0}"), and the rebuild only had the "Enable" half
translated.
Co-authored-by: Mavis <mavis@local>
Documents the switch wave end to end: the defect as it was measured on the two apps side by side, why upstream 0.18's shared switch could not carry official's recipe, the four class strings and where each of them comes from, the five official CSS rules that had to be lifted, the five tokens the dialog scope was missing and why each one changes what is rendered, the tool row's label, the two commits and the deployment record. Co-authored-by: Mavis <mavis@local>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The defect
Official 0.78.1's plugin detail page draws each tool row's on/off switch with its own Switch: the checked track is the accent primary, the knob is the luminous surface. Upstream 0.18 draws the same control with its shared switch, whose checked track is the grey
--sand-fill-control-checked, so this build rendered a grey switch where official renders a blue one.Measured over CDP on the two apps running side by side, Gmail detail page open, 工具 list expanded:
rgb(17, 109, 210)rgb(90, 90, 90)rgba(245, 245, 245, 0.04) 0 0 0 .5px inset0.5px solid--sand-border-subtlergb(245, 245, 245)rgb(252, 252, 252)inset-inline-start: 2pxoff,12pxonleft: 1.5px+translate(10px)Both sides rendered
role="switch",aria-checked="true", a 26×16 track and a 12×12 knob — only the recipes differed.The fix
SD+ knob recipesxDinindex.eager-app-D1juOWZp.js) and against the class attribute on the running official app's live switch.aria-hiddenspan — and official's class string is passed straight through rather than through the chunk'sk()helper, which would prepend a marker class.--sand-border-quaternary-translucent,--sand-shadow-control,--sand-bg-accent-primary-hover,--sand-bg-accent-primary-disabled,--sand-bg-secondary-disabled. Without the first two the track's rim and the knob's shadow are invalid at computed-value time; without the third the track loses its background on hover. All values are official's own.aria-labelis aligned with official's locale idsy5UgU8("Disable {0}" / "停用 {0}") andFZtBeR("Enable {0}" / "启用 {0}"); this build only had the "Enable" half translated.Upstream 0.18's shared switch is left alone on purpose. This build's only
[role="switch"]in the whole app is the detail page's tool row, so the detail call site is the whole blast radius.The commits
32e6ba3b4c18f2a8f98bbVerification
app.asarsha256e921d4e4b085f3a8ccd32c78a63009e7c642dc219d6eb42dd86dded12607da9c, equal on both sides"(RLocT("quote-bug chunks: 0ec247f09f4a69bf1fc4ee671933d6adadb99b400f34750bb1f410d366326402f)The switch was deliberately not clicked, because that toggles a tool's permission mode on the installed plugin. The wiring was checked without clicking: React's own props on the deployed button carry an
onClickwhose source is()=>onToggle(!on), upstream's contract for the same control, and theonToggleandisCheckedprops the port passes are byte-identical to upstream's.🤖 Generated with Claude Code