feat(minify): add and drop CSS vendor prefixes for the browserslist target - #21602

test/CssSyntax.unittest.js (2)

4316-4320: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Hoist the triplicated minify helper.

The three new describe blocks each define a byte-identical helper. Define it once above them and share it.

Also applies to: 4436-4440, 4518-4522

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@test/CssSyntax.unittest.js` around lines 4316 - 4320, Hoist the identical
minify helper from the three describe blocks into a single shared definition
above them in the test module. Remove each local duplicate and have all three
blocks reuse the shared minify function, preserving its existing SourceProcessor
configuration and return behavior.

---

4462-4468: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

No test covers the prefixed-first rule order, which is the order authors write.

Both rule-level removal tests place the unprefixed rule first. _prefixAtRule and _prefixQualifiedRule remove a prefixed rule only when seen.has(signature) already holds (lines 5980 and 6094), so removal depends on the unprefixed twin being printed first. The streaming printer cannot look ahead, and the comment at line 5959 states this constraint.

Prefix fallbacks are conventionally authored prefixed-first, so the untested order is the common input, and in it no removal happens. Declarations are unaffected: present is built from all declarations before the loop at lines 9225-9229, so declaration removal is order-independent.

Add a case that pins the prefixed-first behavior. That documents the limitation and catches a future change to it.

💚 Pin the documented order dependency

+	it("keeps a prefixed at-rule written before its unprefixed twin — streaming cannot look ahead", () => {
+		expect(
+			minify("`@-webkit-keyframes` s{to{opacity:1}}`@keyframes` s{to{opacity:1}}", [
+				"chrome 120"
+			])
+		).toBe("`@-webkit-keyframes` s{to{opacity:1}}`@keyframes` s{to{opacity:1}}");
+	});

As per path instructions: "Cover every changed line and branch with tests, preferably through integration cases."

Also applies to: 4548-4554

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@test/CssSyntax.unittest.js` around lines 4462 - 4468, Add test coverage for
prefixed-first ordering in the rule-level at-rule removal tests near the
existing prefixed/unprefixed cases: place the prefixed `@-webkit-keyframes` rule
before its unprefixed `@keyframes` twin and assert the current streaming behavior,
preserving the documented order dependency. Apply the same coverage to the
corresponding test around the alternate referenced range, without changing
implementation behavior.

Source: Path instructions

tooling/generate-css-data.js (4)

3570-3587: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

The comment claims a standard-status filter that collectPrefixTable does not implement.

The comment states "Standard entries only — a construct BCD marks non-standard is a vendor's own, not a spelling of a standard one." No code reads a status field. collectPrefixTable skips only names starting with __, and collectPrefixes filters by prefix spelling and engine, never by standard status.

The behavior differs from the claim. A construct BCD lists with prefix-only support and no unprefixed entry gets unprefixedFrom === null, so target becomes Infinity at line 3528 and the entry is emitted with an always-needed window. The minifier then adds a prefixed copy beside any authored occurrence of that base name.

Either read the BCD status and skip non-standard entries, or correct the comment to describe the actual filter.

As per coding guidelines: "comments must add non-obvious information and must not narrate or restate code."

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tooling/generate-css-data.js` around lines 3570 - 3587, Update the comment
above collectPrefixTable to accurately describe its actual behavior: it excludes
internal names beginning with "__" and includes entries for which
collectPrefixes returns data, without claiming a standard-status filter. Keep
the implementation unchanged unless needed to make the revised comment precise.

Source: Coding guidelines

---

3444-3446: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Trim the new comment blocks to two lines.

Four of the new comment blocks run three to five lines: 3444-3446, 3463-3467, 3484-3487, and 3503-3507. Each states useful non-obvious reasoning, so the content should stay — move the detail into the adjacent JSDoc block, which has no length limit, and keep the leading comment to two lines.

As per coding guidelines: "Keep comments as short as possible, generally one line and no more than two short lines."

Also applies to: 3463-3467, 3484-3487, 3503-3507

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tooling/generate-css-data.js` around lines 3444 - 3446, Shorten the new
leading comment blocks near the BCD browser-id mapping and the corresponding
blocks at the other referenced locations to no more than two lines. Preserve
their non-obvious reasoning by moving the excess detail into each adjacent JSDoc
block.

Source: Coding guidelines

---

2534-2547: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Use JSON.stringify for the interpolated names, matching the other literal helpers.

prefixLiteral interpolates name, prefix, and browser directly into "…" with no escaping. Every other literal helper in this file goes through JSON.stringify for the same job — see the POSITION_X_KEYWORDS emission at line 3848 and the FAMILY_LONGHANDS emission at line 3727.

The values are CSS identifiers today, so no quote or backslash reaches the output. The inconsistency is what makes this worth changing: a future BCD key with an unexpected character would emit broken JavaScript into lib/css/data.js rather than failing in the generator.

♻️ Match the file's escaping convention

 const prefixLiteral = (table) =>
 	`new Map([${table
 		.map(([name, prefixes]) => {
 			const body = prefixes
 				.map(([prefix, browsers]) => {
 					const list = browsers
-						.map(([browser, from, to]) => `["${browser}", ${from}, ${to}]`)
+						.map(
+							([browser, from, to]) =>
+								`[${JSON.stringify(browser)}, ${from}, ${to}]`
+						)
 						.join(", ");
-					return `["${prefix}", [${list}]]`;
+					return `[${JSON.stringify(prefix)}, [${list}]]`;
 				})
 				.join(", ");
-			return `["${name}", [${body}]]`;
+			return `[${JSON.stringify(name)}, [${body}]]`;
 		})
 		.join(", ")}])`;

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tooling/generate-css-data.js` around lines 2534 - 2547, Update the
prefixLiteral helper so the interpolated name, prefix, and browser values are
serialized with JSON.stringify instead of manual double-quoted interpolation.
Match the escaping convention used by the other literal helpers while preserving
the generated Map structure and numeric from/to values.

---

3463-3482: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚖️ Poor tradeoff

Derive the engine-to-prefix mapping from BCD's release engine field.

BROWSER_PREFIXES hand-types 13 browser entries. BCD publishes the engine for every release at bcd.browsers[id].releases[version].engine — "Blink", "Gecko", "WebKit", "Presto", "EdgeHTML", "Trident". A table of 6 engines to prefixes, joined against that field, replaces the 13 browser rows and covers the dual listings for edge and opera from the data instead of from the comment.

BCD_TO_BROWSERSLIST at lines 3447-3461 is a different case. No published dataset links BCD ids to browserslist names, and the comment states why BCD-only engines are absent, so the hand-typed map is justified there.

As per path instructions: "Generators must derive tables from published datasets (mdn-data, color-name, vendored webref) rather than hand-typing name lists; a SUPPLEMENT entry needs a stated reason it cannot be derived."

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tooling/generate-css-data.js` around lines 3463 - 3482, Replace the
hand-typed browser entries in BROWSER_PREFIXES with a six-engine-to-prefix
mapping derived from BCD release metadata. Build the browser prefix lookup by
joining each bcd.browsers[id].releases[version].engine value to the
corresponding engine prefixes, preserving the published engine-specific prefixes
and allowing EdgeHTML/Trident and Presto cases to emerge from the data. Leave
BCD_TO_BROWSERSLIST unchanged.

Source: Path instructions

lib/css/syntax.js (1)

5948-5954: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

_neededPrefixes returns null for two opposite meanings, and _prefixRemovable reads the wrong one as removable.

_neededPrefixes returns null when no target needs a prefix (line 5927) and also when browsers is absent (line 5893). At line 5953 _prefixRemovable treats null as removable. So a caller reaching _prefixRemovable without a browser list would strip author prefixes with no target information — silently wrong output CSS.

Every current caller is gated. The declaration path checks environment.browsers at lines 9218-9222. The rule paths run only when _seenPrefixRules !== null, which requires the same check at lines 4665-4671. So this is not reachable today.

The overload is what makes it fragile: the gate lives in the callers, not in the function that depends on it. An explicit check inside _prefixRemovable makes the requirement local.

♻️ Make the precondition local

 const _prefixRemovable = (table, base, prefix, tag, writer) => {
+	const environment = /** `@type` {CssEnvironment | undefined} */ (
+		writer.options.environment
+	);
+	// No target list means no basis to judge a prefix dead; keep it.
+	if (!environment || !environment.browsers) return false;
 	const prefixes = table.get(base);
 	if (prefixes === undefined) return false;

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@lib/css/syntax.js` around lines 5948 - 5954, Update _prefixRemovable to
explicitly require an available browser list before treating a prefix as
removable; when the required browser information is absent, return false.
Preserve the existing _neededPrefixes handling for cases where browser data
exists, including removing prefixes only when its result confirms the prefix is
unnecessary.

test/configCases/css/minimize-vendor-prefixes/webpack.config.js (1)

5-8: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Shorten the configuration comment to two lines.

The comment spans four lines. Keep the non-obvious reason for the Browserslist target and stable versions.

Suggested revision

-	// A browserslist target so the default minimizer wiring resolves its browser
-	// list and hands it to `cssMinify` — the whole option flow, not the
-	// serializer alone. Exact versions in `.browserslistrc` keep the snapshot
-	// stable as caniuse updates.
+	// A browserslist target lets the default minimizer resolve browser targets.
+	// Exact versions keep the snapshot stable as caniuse updates.

As per coding guidelines, comments under {lib,hot,tooling,test}/**/*.{js,mjs} must be as short as possible and no more than two short lines. As per path instructions, comments under test/** follow the same limit.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@test/configCases/css/minimize-vendor-prefixes/webpack.config.js` around lines
5 - 8, Shorten the comment above the Browserslist target to no more than two
short lines while preserving both points: the target exercises the default
minimizer-to-cssMinify option flow, and exact versions keep snapshots stable as
caniuse updates.

Sources: Coding guidelines, Path instructions

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

tooling/generate-css-data.js (1)

3524-3526: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Shorten the new comments. Both comments use three lines and repeat behavior expressed by the adjacent code. Keep only the non-obvious reason in no more than two short lines.

• tooling/generate-css-data.js#L3524-L3526: reduce the BCD ordering explanation to one or two short lines.
• lib/css/syntax.js#L5832-L5834: reduce the memo-key explanation to one or two short lines.

As per coding guidelines: "Keep comments as short as possible, generally one line and no more than two short lines; comments must add non-obvious information and must not narrate or restate code."

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tooling/generate-css-data.js` around lines 3524 - 3526, Shorten the comments
at tooling/generate-css-data.js lines 3524-3526 and lib/css/syntax.js lines
5832-5834 to one or two short lines each, retaining only the non-obvious BCD
ordering and memo-key rationale; remove wording that repeats adjacent code
behavior.

Source: Coding guidelines