fix: make data-bone-animate work from the element that carries it (BON-17) - #45
Conversation
…N-17) The animation variants live in @scope blocks, and a scoped selector's implicit :scope prefix matches strict descendants only — so the attribute was a silent no-op on the marked bone itself and on the aria-busy element of an auto region. The scoped selectors now include the scope root via :is(:scope, :scope *), with browser regression tests for both stylesheets and updated docs. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (9)
Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review. 📝 WalkthroughWalkthrough
ChangesAnimation scope behavior
Estimated code review effort: 2 (Simple) | ~15 minutes Merge Risk: ⚪ Minimal · up to This localized CSS fix enables animations on the element carrying the attribute while preserving wrapper and nested behavior; no actionable merge-blocking risk remains after normal checks and review. 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
Full details: Description checkExplanation The description explains the issue, root cause, implementation, tests, documentation updates, and changeset. It provides the required What/Why and Testing information, although it uses equivalent headings instead of the exact template headings. Full details: Docstring CoverageExplanation Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 2 files. (7 skipped: 7 unsupported.)
✨ Finishing Touches 💡 1📝 Generate docstrings 💡
🧪 Generate unit tests (beta)
Comment |
1 participant
Fixes BON-17.
data-bone-animateonly worked from a wrapper. On the marked bone itself, or on thearia-busyelement of an auto region, it was a silent no-op: the shimmer kept running, and"shimmer"on a marked bone never started.Root cause
The animation variants live in
@scopeblocks. A scoped selector gets an implicit:scopeprefix with a descendant combinator, so its subject and ancestor compounds only match strict descendants of the scope root — never the root itself. Verified the semantics in Chromium with a throwaway browser test before changing the shipped CSS.Fix
bones.css: the animated subjects in the three scope blocks now carry:is(:scope, :scope *), so a bone that carries the attribute matches as the scope root.auto.css: the 21 leading[aria-busy="true"]compounds inside the scope blocks get the same treatment, so the attribute works on thearia-busyelement itself. The unscoped default and fallback rules are untouched.data-bone-animatesubtree still escapes the outer scope, so nested overrides keep working.One deliberate limit: for auto regions the attribute works on the
aria-busyelement or above. An unmarked leaf inside the region still cannot carry it, because itsaria-busyancestor sits above the scope root. The docs state this.Tests
New
tests/browser/animation-scope.test.tswith 9 browser tests. The 6 on-self cases failed before the fix; 3 more pin wrapper behavior and nested overrides. Full suite: 205/205,vp checkclean.The committed Linux visual baselines still pass locally: the bare-card fixture changes from a frozen gradient to solid base, which stays under the 1% pixelmatch threshold. If the visual job disagrees, the baselines need the usual regen pass.
Docs
Both READMEs,
styling.mdx, andexamples.mdxno longer claim the wrapper is required, and the stale comment inadaptive-colors.test.tsis gone. Patch changeset included.🤖 Generated with Claude Code
Summary by CodeRabbit
New Features
data-bone-animatenow works when applied directly to a bone or anaria-busyelement, as well as to ancestor elements.Documentation
Tests