mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-10 06:24:35 +09:00
Oleg Isonen
b2d62b2e49
## Summary Restore custom state selectors that target descendants of the selected instance, including `:hover .button` and `:hover > .icon`. The CSS engine already generated these selectors correctly. #5886 unintentionally rejected them while hardening MCP style inputs against selectors that can escape instance scope. ## Technical choices - Parse exactly one selector with `css-tree`. - Require the selector to begin with a pseudo-class, pseudo-element, or attribute state anchored to the selected instance. - Allow only descendant and direct-child combinators after that anchor. - Continue rejecting selector lists, unanchored type/class/ID selectors, sibling combinators, unknown pseudo-selectors, and pseudo-elements used as ancestors. - Document CSS variables as the preferred parent-child interaction pattern; use descendant selectors when selector-based targeting is specifically required. ## Todo - [x] Restore scoped descendant and direct-child selectors. - [x] Preserve instance-scope protections. - [x] Cover real authoring inputs and generated CSS. - [x] Demonstrate new tests fail without the restored behavior and scope guards. - [x] Verify the reported workflow through the local CLI/MCP and generated preview. - [x] Review documentation impact and update the authoritative Builder docs. - [x] Verify generated API contracts remain current. ## Verification - `pnpm --filter @webstudio-is/css-data test` — 4,623 passed, 1 skipped - `pnpm --filter @webstudio-is/css-data typecheck` - `pnpm --filter @webstudio-is/project-build exec vitest run src/runtime/styles.test.ts src/runtime/audit.test.ts` — 198 passed - `pnpm --filter @webstudio-is/project-build typecheck` - `pnpm lint` - `pnpm check:generated-api` - Documentation targets and anchors verified - Local MCP disposable-fixture workflow: - Discovered `insert-fragment` and `update-styles` through MCP metadata. - Inserted a card with a descendant `<button class="button">`. - Dry-run and committed `state: ":hover .button"`; `get-styles` returned the persisted state. - MCP preview generated `.chjrfuf:hover .button` while the card used the `chjrfuf` instance class, proving the selector remained instance-anchored. - Preview screenshot completed and returned HTTP 200. - Agent evaluations were not run because the suite has no custom-selector coverage ## Known limitation Sibling combinators remain unsupported because they can select elements outside the selected instance. Selector lists remain unsupported because later list entries can escape the generated instance prefix. Closes #6175
CSS Data
Generated configs and collections from mdn-data into consumable form.