[thetaPC]

Issue number: internal

---

What is the current behavior?

Pressing a hovered chip with a mouse keeps the hover background instead of the activated one, because chip.scss writes the activated rules before the focus and hover rules. In the ios and md themes, the background stays at the hover opacity (0.16) instead of the activated one (0.2). The ionic theme doesn't set separate hover or activated backgrounds, so it looks the same either way.

What is the new behavior?

• Chip states are written in the order focus, hover, activated, matching button and the recipe conventions, so the activated background wins when a chip is both hovered and pressed.
• Added a test that presses a hovered chip for each hue, fill and color, and expects the activated background.

Does this introduce a breaking change?

• Yes
• No

Other information

next has the same order, so this is a fix rather than a migration regression. Raised in the review of #31727.

To check by hand, use a mouse on the chip basic page in the ios theme, then hover a chip and hold the mouse button down. The background should darken past the hover color.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
ionic-framework	Ready	Preview	Nov 12, 2026 10:53pm UTC

[ShaneK]

Thanks for this! The reorder matches the focus, hover, activated order from the recipes doc, and the new test covers every hue, fill and color combo. Left one tiny optional nit, feel free to ignore it.