Add forced-color-adjust utilities (#11931)

* Add forced-colors-adjust utilities

* Update forcedColorsAdjust.test.js

* use `toMatchSnapshot` instead of `toMatchFormattedCss`

More info: #12170

* rename `forced-colors-adjust` -> `forced-color-adjust`

Dropped the `s` in `colors`.

* update changelog

* fix typo

* use full `forced-color-adjust-auto` and `forced-color-adjust-none` names

---------

Co-authored-by: Robin Malfait <[email protected]>

Author: lukewarlow

CHANGELOG.md

@@ -29,6 +29,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add `size-*` utilities ([#12287](https://github.com/tailwindlabs/tailwindcss/pull/12287))
 - Add utilities for CSS subgrid ([#12298](https://github.com/tailwindlabs/tailwindcss/pull/12298))
 - Add spacing scale to `min-w-*`, `min-h-*`, and `max-w-*` utilities ([#12300](https://github.com/tailwindlabs/tailwindcss/pull/12300))
+- Add `forced-color-adjust` utilities ([#11931](https://github.com/tailwindlabs/tailwindcss/pull/11931))
 - [Oxide] New Rust template parsing engine ([#10252](https://github.com/tailwindlabs/tailwindcss/pull/10252))
 - [Oxide] Support `@import "tailwindcss"` using top-level `index.css` file ([#11205](https://github.com/tailwindlabs/tailwindcss/pull/11205), ([#11260](https://github.com/tailwindlabs/tailwindcss/pull/11260)))
 - [Oxide] Use `lightningcss` for nesting and vendor prefixes in PostCSS plugin ([#10399](https://github.com/tailwindlabs/tailwindcss/pull/10399))

src/corePlugins.js

@@ -2877,4 +2877,10 @@ export let corePlugins = {
   content: createUtilityPlugin('content', [
     ['content', ['--tw-content', ['content', 'var(--tw-content)']]],
   ]),
+  forcedColorAdjust: ({ addUtilities }) => {
+    addUtilities({
+      '.forced-color-adjust-auto': { 'forced-color-adjust': 'auto' },
+      '.forced-color-adjust-none': { 'forced-color-adjust': 'none' },
+    })
+  },
 }

tests/plugins/__snapshots__/forcedColorAdjust.test.js.snap

@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should test the 'forcedColorAdjust' plugin 1`] = `
+"
+.forced-color-adjust-auto {
+  forced-color-adjust: auto;
+}
+
+.forced-color-adjust-none {
+  forced-color-adjust: none;
+}
+"
+`;

tests/plugins/forcedColorAdjust.test.js

@@ -0,0 +1,3 @@
+import { quickPluginTest } from '../util/run'
+
+quickPluginTest('forcedColorAdjust').toMatchSnapshot()