Change Chrome target to 111 (#15389)

Resolves #15387

This PR changes the Chrome target to 111. We initially picked 120
because of the unnecessary `:dir()` down-leveling but we that was maybe
a bit too recent as it was causing some necessary prefixes to not be
generated (e.g. `-webkit-background-clip`).

This PR changes it to 111 which we require for the `color-mix()`
function. To work around the `:dir()` down-leveling we also disable the
`DirSelector` lightningcss feature which is used to control this
behavior:
https://sourcegraph.com/github.com/parcel-bundler/lightningcss/-/blob/src/selector.rs?L1964-1965

Author: philipp-spiess

CHANGELOG.md

@@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fix missing `shadow-none` suggestion in IntelliSense ([#15342](https://github.com/tailwindlabs/tailwindcss/pull/15342))
 - Optimize AST before printing for IntelliSense ([#15347](https://github.com/tailwindlabs/tailwindcss/pull/15347))
 - Improve debug logs to get better insights ([#15303](https://github.com/tailwindlabs/tailwindcss/pull/15303))
+- Generate vendor prefixes for Chrome features trialed between 111 and 119. ([#15389](https://github.com/tailwindlabs/tailwindcss/pull/15389))
 
 ### Changed
 

packages/@tailwindcss-cli/src/commands/build/index.ts

@@ -445,12 +445,12 @@ function optimizeCss(
         deepSelectorCombinator: true,
       },
       include: Features.Nesting,
-      exclude: Features.LogicalProperties,
+      exclude: Features.LogicalProperties | Features.DirSelector,
       targets: {
         safari: (16 << 16) | (4 << 8),
         ios_saf: (16 << 16) | (4 << 8),
         firefox: 128 << 16,
-        chrome: 120 << 16,
+        chrome: 111 << 16,
       },
       errorRecovery: true,
     }).code

packages/@tailwindcss-postcss/src/index.ts

@@ -317,12 +317,12 @@ function optimizeCss(
         deepSelectorCombinator: true,
       },
       include: LightningCssFeatures.Nesting,
-      exclude: LightningCssFeatures.LogicalProperties,
+      exclude: LightningCssFeatures.LogicalProperties | LightningCssFeatures.DirSelector,
       targets: {
         safari: (16 << 16) | (4 << 8),
         ios_saf: (16 << 16) | (4 << 8),
         firefox: 128 << 16,
-        chrome: 120 << 16,
+        chrome: 111 << 16,
       },
       errorRecovery: true,
     }).code

packages/@tailwindcss-vite/src/index.ts

@@ -375,12 +375,12 @@ function optimizeCss(
         deepSelectorCombinator: true,
       },
       include: LightningCssFeatures.Nesting,
-      exclude: LightningCssFeatures.LogicalProperties,
+      exclude: LightningCssFeatures.LogicalProperties | LightningCssFeatures.DirSelector,
       targets: {
         safari: (16 << 16) | (4 << 8),
         ios_saf: (16 << 16) | (4 << 8),
         firefox: 128 << 16,
-        chrome: 120 << 16,
+        chrome: 111 << 16,
       },
       errorRecovery: true,
     }).code

packages/tailwindcss/src/test-utils/run.ts

@@ -28,12 +28,12 @@ export function optimizeCss(
         deepSelectorCombinator: true,
       },
       include: Features.Nesting,
-      exclude: Features.LogicalProperties,
+      exclude: Features.LogicalProperties | Features.DirSelector,
       targets: {
         safari: (16 << 16) | (4 << 8),
         ios_saf: (16 << 16) | (4 << 8),
         firefox: 128 << 16,
-        chrome: 120 << 16,
+        chrome: 111 << 16,
       },
       errorRecovery: true,
     }).code

packages/tailwindcss/src/utilities.test.ts

@@ -11825,6 +11825,7 @@ test('bg-clip', async () => {
       }
 
       .bg-clip-text {
+        -webkit-background-clip: text;
         background-clip: text;
       }"
     `)