CSS governance: styles.css entry-only split + contracts (succeeds #264) - #269
Merged
Conversation
- point contract tests at the real renderer CSS graph - keep styles.css entry-only and audit !important usage - split renderer CSS into surface files with guarded layering - add dead CSS checks and frontend CSS governance guidance
…anded CSS Follow-up to QuinnWan's styles.css split (PR #264). `readAllRendererCss()` now expands `@import` chains, so the styles blob includes maka-tokens.css — including the legitimate `--ease-out-strong: cubic-bezier(0.16, 1, 0.3, 1);` token declaration. The bare-curve assertion was tripping on the token file's own definition. Strip TOKEN_DECL from the merged styles blob (mirroring the same strip the test already does for the tokens-file branch) so only NON-declaration spellings count as violations. Verifies green: apps/desktop$ npx tsx --test src/main/__tests__/motion-token-converge-contract.test.ts
…anup contract PR #264's scope is CSS governance — moving styles.css → styles/*.css split, adding contract tests, and a dead-CSS script. The settings-roadmap-cleanup contract pins the Daily Review fallback copy ("当前版本仅本地数字聚合,定时生 成 / LLM 摘要尚未连接到后端。") which an unrelated edit had rewritten to "…仍以本地汇总为主;…", breaking the existing pin. Revert the copy to match the pinned vocabulary so the contract stays green without expanding this PR's footprint into copy edits.
jackwener
force-pushed
the
yuejing/pr264-fixup
branch
from
June 26, 2026 08:37
519e684 to
79a44fc
Compare
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.
Summary
Successor to #264 (QuinnWan/@somewan820's CSS governance rebase). Includes everything in #264 + 2 small fixup commits for issues that turned up running the full contract suite.
What this PR does
apps/desktop/src/renderer/styles.cssfrom a 14k-line monolith to a 66-line entry file (only@import,@source,@theme inline).apps/desktop/src/renderer/styles/*.css(base, sidebar, onboarding, module-pages, chat-header, chat-message, composer, daily-review, health-center, markdown-link, permission-center, reasoning-panel, theme-glass, tool-output, tool-stream) andstyles/settings/*.css(bot, connection, form, models, nav-sidebar, provider-editor, theme-preview).css-test-helpers.ts,contract-css-helpers.ts) so every renderer-CSS contract test reads the aggregated@importchain viareadAllRendererCss(), not a single file.renderer-styles-entry-contract.test.ts(entry-only invariant),renderer-important-audit-contract.test.ts(allowlisted!importantsites).scripts/check-dead-css.mjs+ baseline json (CI guard against dead-CSS count growing).docs/frontend-css-governance.md.Why succeed instead of merging #264
QuinnWan's rebase addressed both critical selector-state regressions I flagged in my first review (
[data-checked]for ChoiceCard,[data-pressed]for SettingsSegmented). But running the full contract suite on the rebased branch surfaced 2 more issues:motion-token-converge-contract.test.tsnow trips on the legitimate--ease-out-strong: cubic-bezier(...)declaration in maka-tokens.css, becausereadAllRendererCss()expands the @import chain. Fix: strip TOKEN_DECL from the merged blob before counting (commit1fd0b09f).settings-roadmap-cleanup-contract.test.tstrips on an unrelated Daily Review fallback copy edit (SettingsModal.tsx:1598) that doesn't belong in a CSS-governance PR. Fix: revert that one line (commit519e684e).After both fixes, all 431 contract tests pass on this branch.
Test plan
apps/desktop$ npx tsx --test src/main/__tests__/*-contract.test.ts→ 431/431 passnode scripts/check-dead-css.mjs --check→ within baseline ✓renderer-style-pruning-contract.test.tsretired-hooks list (17 entries) + orphan guard passsettings-theme-contract.test.tsChoiceCard + SettingsSegmented invariants passrenderer-styles-entry-contract.test.tsno rule blocks in styles.css passrenderer-style-layer-cascade-contract.test.tsunlayered overrides preservedCredit: large diff (~14.7k +/14.0k -) is @somewan820's work in #264 — base + 2 commits. My contribution here is the final 2 fixup commits + verification.
Closes #264 (intent-equivalent, with the additional fixes).