Skip to content

Fix: Firefox Categorical Bin Animation Flash#720

Draft
buckhalt wants to merge 2 commits intonextfrom
fix/firefox-cat-bin-flash
Draft

Fix: Firefox Categorical Bin Animation Flash#720
buckhalt wants to merge 2 commits intonextfrom
fix/firefox-cat-bin-flash

Conversation

@buckhalt
Copy link
Copy Markdown
Member

On Firefox, Categorical Bins flashed a square shaped tint behind the circle during scale animations. The fill now uses clip path so that the fill stays inside the circle during animation.

Example:
Screenshot 2026-04-22 at 9 18 18 AM

Can be reproduced by opening the Categorical Bin storybook on Firefox.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented Apr 22, 2026

@github-actions
Copy link
Copy Markdown

✅ E2E tests — success

📊 View report

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Fixes a Firefox-specific rendering artifact where the background tint of collapsed Categorical Bins flashes as a square during scale/layout animations by introducing circular clipping on the bin element.

Changes:

  • Add clipPath: 'circle(50%)' to the collapsed Categorical Bin item styling to keep the fill clipped to a circle during animation.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@github-actions
Copy link
Copy Markdown

❌ E2E tests — failure

📊 View report

@github-actions
Copy link
Copy Markdown

✅ E2E tests — success

📊 View report

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants