diff --git a/CHANGELOG.md b/CHANGELOG.md index 375288258a2d..36966fdfd681 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed - Discard candidates with an empty data type ([#19172](https://github.com/tailwindlabs/tailwindcss/pull/19172)) +- Fix canonicalization of arbitrary variants with attribute selectors ([#19176](https://github.com/tailwindlabs/tailwindcss/pull/19176)) ## [4.1.15] - 2025-10-20 diff --git a/packages/tailwindcss/src/canonicalize-candidates.test.ts b/packages/tailwindcss/src/canonicalize-candidates.test.ts index 1e76a7b7cfa4..bcf992a886ea 100644 --- a/packages/tailwindcss/src/canonicalize-candidates.test.ts +++ b/packages/tailwindcss/src/canonicalize-candidates.test.ts @@ -846,6 +846,10 @@ describe.each([['default'], ['with-variant'], ['important'], ['prefix']])('%s', ['[&_>_[data-visible]]:flex', '*:data-visible:flex'], ['[&>*]:flex', '*:flex'], ['[&_>_*]:flex', '*:flex'], + ['[&_>_[foo]]:flex', '*:[[foo]]:flex'], + ['[&_[foo]]:flex', '**:[[foo]]:flex'], + ['[&_>_[foo=bar]]:flex', '*:[[foo=bar]]:flex'], + ['[&_[foo=bar]]:flex', '**:[[foo=bar]]:flex'], ['[&_[data-visible]]:flex', '**:data-visible:flex'], ['[&_*]:flex', '**:flex'], diff --git a/packages/tailwindcss/src/canonicalize-candidates.ts b/packages/tailwindcss/src/canonicalize-candidates.ts index 996859c539cd..fd8b862490cf 100644 --- a/packages/tailwindcss/src/canonicalize-candidates.ts +++ b/packages/tailwindcss/src/canonicalize-candidates.ts @@ -1649,8 +1649,9 @@ function modernizeArbitraryValuesVariant( !isSingleSelector(target.nodes) || // [foo][bar] is considered a single selector but has multiple nodes target.nodes.length !== 1 - ) + ) { continue + } // Expecting a single attribute selector if (!isAttributeSelector(target.nodes[0])) continue @@ -1796,6 +1797,15 @@ function modernizeArbitraryValuesVariant( }, // aria-[foo~="true"], aria-[foo|="true"], … } satisfies Variant) } + + // Arbitrary attributes + else { + replaceObject(variant, { + kind: 'arbitrary', + selector: target.value, + relative: false, + } satisfies Variant) + } } if (prefixedVariant) {