From 04c4de1997212d1cfd1045be4c32ff75dae19ec5 Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Thu, 25 May 2023 16:06:00 +0200 Subject: [PATCH] Deprecate `--no-autoprefixer` flag in the CLI (#11280) * enable `--no-autoprefixer` test * handle `--no-autoprefixer` using lightningcss * bump default chrome version for lightningcss plugin * handle `map` being nullable * add `--no-autoprefixer` test including nesting * set Chrome to version 111 as a default value * resolve the output message when resolving the promise * deprecate `--no-autoprefixer` for the CLI * update changelog --- CHANGELOG.md | 1 + integrations/execute.js | 2 +- .../tailwindcss-cli/tests/cli.test.js | 39 +++++++++++-------- src/cli/build/index.js | 4 ++ src/cli/build/plugin.js | 16 +++++--- src/cli/index.js | 1 + src/plugin.js | 2 +- 7 files changed, 41 insertions(+), 24 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 36ce4de0e..8585cad4f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -27,6 +27,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Reset padding for `` elements in preflight ([#11069](https://github.com/tailwindlabs/tailwindcss/pull/11069)) - [Oxide] Disable color opacity plugins by default in the `oxide` engine ([#10618](https://github.com/tailwindlabs/tailwindcss/pull/10618)) - [Oxide] Enable relative content paths for the `oxide` engine ([#10621](https://github.com/tailwindlabs/tailwindcss/pull/10621)) +- Deprecate `--no-autoprefixer` flag in the CLI ([#11280](https://github.com/tailwindlabs/tailwindcss/pull/11280)) ## [3.3.2] - 2023-04-25 diff --git a/integrations/execute.js b/integrations/execute.js index 6c5f20363..f6dda33a6 100644 --- a/integrations/execute.js +++ b/integrations/execute.js @@ -64,7 +64,7 @@ module.exports = function $(command, options = {}) { messages.splice(0, idx + 1) let actorIdx = actors.indexOf(next) actors.splice(actorIdx, 1) - next.resolve() + next.resolve(message) break } } diff --git a/integrations/tailwindcss-cli/tests/cli.test.js b/integrations/tailwindcss-cli/tests/cli.test.js index cf15425bb..0ae5e056f 100644 --- a/integrations/tailwindcss-cli/tests/cli.test.js +++ b/integrations/tailwindcss-cli/tests/cli.test.js @@ -96,27 +96,35 @@ describe('Build command', () => { expect(withoutMinify.length).toBeGreaterThan(withMinify.length) }) - // TODO: Handle --no-autoprefixer - test.skip('--no-autoprefixer', async () => { + // Deprecated + test('--no-autoprefixer (should produce a warning)', async () => { await writeInputFile('index.html', html`
`) + await writeInputFile( + 'index.css', + css` + @tailwind utilities; + ` + ) - await $(`${EXECUTABLE} --output ./dist/main.css`) - let withAutoprefixer = await readOutputFile('main.css') + let runningProcess = $( + `${EXECUTABLE} --input ./src/index.css --output ./dist/main.css --no-autoprefixer` + ) + let warning = runningProcess.onStderr((message) => message.includes('--no-autoprefixer')) + await runningProcess + expect(await warning).toMatchInlineSnapshot(` + "[deprecation] The --no-autoprefixer flag is deprecated and has no effect. + " + `) + let withoutAutoprefixer = await readOutputFile('main.css') - expect(withAutoprefixer).toIncludeCss(css` - .select-none { + // This contains --webkit-user-select which may be strange, but it is expected because we are + // not handling the `--no-autoprefixer` flag anymore at all. + expect(withoutAutoprefixer).toMatchInlineSnapshot(` + ".select-none { -webkit-user-select: none; user-select: none; } - `) - - await $(`${EXECUTABLE} --output ./dist/main.css --no-autoprefixer`) - let withoutAutoprefixer = await readOutputFile('main.css') - - expect(withoutAutoprefixer).toIncludeCss(css` - .select-none { - user-select: none; - } + " `) }) @@ -492,7 +500,6 @@ describe('Build command', () => { --postcss Load custom PostCSS configuration -m, --minify Minify the output -c, --config Path to a custom config file - --no-autoprefixer Disable autoprefixer -h, --help Display usage information `) ) diff --git a/src/cli/build/index.js b/src/cli/build/index.js index 62c020e59..a142a4a47 100644 --- a/src/cli/build/index.js +++ b/src/cli/build/index.js @@ -25,6 +25,10 @@ export async function build(args) { process.exit(9) } + if (args['--no-autoprefixer']) { + console.error('[deprecation] The --no-autoprefixer flag is deprecated and has no effect.') + } + // TODO: Reference the @config path here if exists let configPath = args['--config'] ? args['--config'] : resolveDefaultConfigPath() diff --git a/src/cli/build/plugin.js b/src/cli/build/plugin.js index ee30eb442..e83311937 100644 --- a/src/cli/build/plugin.js +++ b/src/cli/build/plugin.js @@ -26,14 +26,13 @@ import { validateConfig } from '../../util/validateConfig' import { handleImportAtRules } from '../../lib/handleImportAtRules' import { flagEnabled } from '../../featureFlags' -async function lightningcss(shouldMinify, result, options = {}) { - // TODO: handle --no-autoprefixer option if possible +async function lightningcss(result, { map = true, minify = true } = {}) { try { let transformed = lightning.transform({ filename: result.opts.from || 'input.css', code: Buffer.from(result.css, 'utf-8'), - minify: shouldMinify, - sourceMap: result.map === undefined ? options.map : !!result.map, + minify, + sourceMap: result.map === undefined ? map : !!result.map, inputSourceMap: result.map ? result.map.toString() : undefined, targets: lightning.browserslistToTargets(browserslist(pkg.browserslist)), drafts: { @@ -46,7 +45,7 @@ async function lightningcss(shouldMinify, result, options = {}) { map: result.map ? Object.assign(result.map, { toString() { - return transformed.map.toString() + return transformed.map?.toString() }, }) : result.map, @@ -342,7 +341,12 @@ export async function createProcessor(args, cliConfigPath) { return readInput() .then((css) => processor.process(css, options)) - .then((result) => lightningcss(!!args['--minify'], result, options)) + .then((result) => + lightningcss(result, { + ...options, + minify: !!args['--minify'], + }) + ) .then((result) => { if (!state.watcher) { return result diff --git a/src/cli/index.js b/src/cli/index.js index fc1497f62..66dda931c 100644 --- a/src/cli/index.js +++ b/src/cli/index.js @@ -70,6 +70,7 @@ let commands = { description: 'Path to a custom config file', }, '--no-autoprefixer': { + deprecated: true, type: Boolean, description: 'Disable autoprefixer', }, diff --git a/src/plugin.js b/src/plugin.js index bfcdc6583..4356add62 100644 --- a/src/plugin.js +++ b/src/plugin.js @@ -49,7 +49,7 @@ module.exports = function tailwindcss(configOrPath) { inputSourceMap: result.map ? result.map.toString() : undefined, targets: typeof process !== 'undefined' && process.env.JEST_WORKER_ID - ? { chrome: 106 << 16 } + ? { chrome: 111 << 16 } : lightningcss.browserslistToTargets( browserslist(require('../package.json').browserslist) ),