Replace __OXIDE__ at build time to prevent @tailwindcss/oxide leaks in the stable engine (#10988)
* replace `env.OXIDE` with global `__OXIDE__` This will allow us to replace the `__OXIDE__` at build time, and fully remove the branches from the final code so that there is not even any reference to `@tailwindcss/oxide` on the stable engine. * update changelog * use `env.ENGINE` in integration tests * drop oxide branching for the PostCSS plugin for now This is currently a redirect to the same file, so doesn't hurt. * Enable better dead-code elimination * Update CLI tests Fix indentation * Fix indentation --------- Co-authored-by: Jordan Pittman <jordan@cryptica.me>
This commit is contained in:
Robin Malfait
GitHub
parent
9f860197c9
commit
72bc31867b
23 changed files with 193 additions and 167 deletions
|
|
@ -19,6 +19,7 @@ let {
|
|||
})
|
||||
|
||||
let EXECUTABLE = 'node ../../lib/cli.js'
|
||||
let testStable = env.ENGINE === 'stable' ? test : test.skip
|
||||
|
||||
function dedent(input) {
|
||||
let lines = input.split('\n')
|
||||
|
|
@ -97,7 +98,7 @@ describe('Build command', () => {
|
|||
expect(withoutMinify.length).toBeGreaterThan(withMinify.length)
|
||||
})
|
||||
|
||||
test('--no-autoprefixer', async () => {
|
||||
testStable('--no-autoprefixer', async () => {
|
||||
await writeInputFile('index.html', html`<div class="select-none"></div>`)
|
||||
|
||||
await $(`${EXECUTABLE} --output ./dist/main.css`)
|
||||
|
|
@ -183,7 +184,7 @@ describe('Build command', () => {
|
|||
)
|
||||
})
|
||||
|
||||
test('--postcss (postcss.config.js)', async () => {
|
||||
testStable('--postcss (postcss.config.js)', async () => {
|
||||
await writeInputFile('index.html', html`<div class="font-bold"></div>`)
|
||||
|
||||
let customConfig = javascript`
|
||||
|
|
@ -216,7 +217,7 @@ describe('Build command', () => {
|
|||
|
||||
await $(`${EXECUTABLE} --output ./dist/main.css --postcss`)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.font-bold-after {
|
||||
|
|
@ -235,7 +236,7 @@ describe('Build command', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.font-bold-after {
|
||||
|
|
@ -254,7 +255,7 @@ describe('Build command', () => {
|
|||
}
|
||||
})
|
||||
|
||||
test('--postcss (custom.postcss.config.js)', async () => {
|
||||
testStable('--postcss (custom.postcss.config.js)', async () => {
|
||||
await writeInputFile('index.html', html`<div class="font-bold"></div>`)
|
||||
|
||||
let customConfig = javascript`
|
||||
|
|
@ -287,7 +288,7 @@ describe('Build command', () => {
|
|||
|
||||
await $(`${EXECUTABLE} --output ./dist/main.css --postcss ./custom.postcss.config.js`)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.font-bold-after {
|
||||
|
|
@ -306,7 +307,7 @@ describe('Build command', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.font-bold-after {
|
||||
|
|
@ -325,7 +326,7 @@ describe('Build command', () => {
|
|||
}
|
||||
})
|
||||
|
||||
test('--postcss supports process options', async () => {
|
||||
testStable('--postcss supports process options', async () => {
|
||||
await writeInputFile('index.html', html`<div class="font-bold"></div>`)
|
||||
|
||||
let customConfig = javascript`
|
||||
|
|
@ -359,7 +360,7 @@ describe('Build command', () => {
|
|||
expect(contents).toContain(`/*# sourceMappingURL`)
|
||||
})
|
||||
|
||||
test('--postcss supports process options with custom config', async () => {
|
||||
testStable('--postcss supports process options with custom config', async () => {
|
||||
await writeInputFile('index.html', html`<div class="font-bold"></div>`)
|
||||
|
||||
let customConfig = javascript`
|
||||
|
|
@ -480,7 +481,7 @@ describe('Build command', () => {
|
|||
return runningProcess.stop()
|
||||
})
|
||||
|
||||
test('postcss-import is included when using a custom postcss configuration', async () => {
|
||||
testStable('postcss-import is included when using a custom postcss configuration', async () => {
|
||||
cleanupFile('src/test.css')
|
||||
|
||||
await writeInputFile('index.html', html`<div class="md:something-cool"></div>`)
|
||||
|
|
@ -508,26 +509,47 @@ describe('Build command', () => {
|
|||
test('--help', async () => {
|
||||
let { combined } = await $(`${EXECUTABLE} --help`)
|
||||
|
||||
expect(dedent(combined)).toEqual(
|
||||
dedent(`
|
||||
tailwindcss v${version}
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(dedent(combined)).toEqual(
|
||||
dedent(`
|
||||
tailwindcss v${version}
|
||||
|
||||
Usage:
|
||||
tailwindcss build [options]
|
||||
Usage:
|
||||
tailwindcss build [options]
|
||||
|
||||
Options:
|
||||
-i, --input Input file
|
||||
-o, --output Output file
|
||||
-w, --watch Watch for changes and rebuild as needed
|
||||
-p, --poll Use polling instead of filesystem events when watching
|
||||
--content Content paths to use for removing unused classes
|
||||
--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
|
||||
`)
|
||||
)
|
||||
Options:
|
||||
-i, --input Input file
|
||||
-o, --output Output file
|
||||
-w, --watch Watch for changes and rebuild as needed
|
||||
-p, --poll Use polling instead of filesystem events when watching
|
||||
--content Content paths to use for removing unused classes
|
||||
-m, --minify Minify the output
|
||||
-c, --config Path to a custom config file
|
||||
-h, --help Display usage information
|
||||
`)
|
||||
)
|
||||
} else if (env.ENGINE === 'stable') {
|
||||
expect(dedent(combined)).toEqual(
|
||||
dedent(`
|
||||
tailwindcss v${version}
|
||||
|
||||
Usage:
|
||||
tailwindcss build [options]
|
||||
|
||||
Options:
|
||||
-i, --input Input file
|
||||
-o, --output Output file
|
||||
-w, --watch Watch for changes and rebuild as needed
|
||||
-p, --poll Use polling instead of filesystem events when watching
|
||||
--content Content paths to use for removing unused classes
|
||||
--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
|
||||
`)
|
||||
)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
|
@ -589,7 +611,7 @@ describe('Init command', () => {
|
|||
expect((await readOutputFile('../full.config.js')).split('\n').length).toBeGreaterThan(50)
|
||||
})
|
||||
|
||||
test('--postcss', async () => {
|
||||
testStable('--postcss', async () => {
|
||||
expect(await fileExists('postcss.config.js')).toBe(true)
|
||||
await removeFile('postcss.config.js')
|
||||
expect(await fileExists('postcss.config.js')).toBe(false)
|
||||
|
|
@ -609,21 +631,38 @@ describe('Init command', () => {
|
|||
test('--help', async () => {
|
||||
let { combined } = await $(`${EXECUTABLE} init --help`)
|
||||
|
||||
expect(dedent(combined)).toEqual(
|
||||
dedent(`
|
||||
tailwindcss v${version}
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(dedent(combined)).toEqual(
|
||||
dedent(`
|
||||
tailwindcss v${version}
|
||||
|
||||
Usage:
|
||||
tailwindcss init [options]
|
||||
Usage:
|
||||
tailwindcss init [options]
|
||||
|
||||
Options:
|
||||
--esm Initialize configuration file as ESM
|
||||
--ts Initialize configuration file as TypeScript
|
||||
-p, --postcss Initialize a \`postcss.config.js\` file
|
||||
-f, --full Include the default values for all options in the generated configuration file
|
||||
-h, --help Display usage information
|
||||
`)
|
||||
)
|
||||
Options:
|
||||
--esm Initialize configuration file as ESM
|
||||
--ts Initialize configuration file as TypeScript
|
||||
-f, --full Include the default values for all options in the generated configuration file
|
||||
-h, --help Display usage information
|
||||
`)
|
||||
)
|
||||
} else if (env.ENGINE === 'stable') {
|
||||
expect(dedent(combined)).toEqual(
|
||||
dedent(`
|
||||
tailwindcss v${version}
|
||||
|
||||
Usage:
|
||||
tailwindcss init [options]
|
||||
|
||||
Options:
|
||||
--esm Initialize configuration file as ESM
|
||||
--ts Initialize configuration file as TypeScript
|
||||
-p, --postcss Initialize a \`postcss.config.js\` file
|
||||
-f, --full Include the default values for all options in the generated configuration file
|
||||
-h, --help Display usage information
|
||||
`)
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
test('ESM config is created by default in an ESM project', async () => {
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ describe('static build', () => {
|
|||
env: { NODE_ENV: 'production' },
|
||||
})
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -92,7 +92,7 @@ describe('static build', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -145,7 +145,7 @@ describe('static build', () => {
|
|||
env: { NODE_ENV: 'production' },
|
||||
})
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-primary {
|
||||
|
|
@ -156,7 +156,7 @@ describe('static build', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-primary {
|
||||
|
|
@ -203,7 +203,7 @@ describe('static build', () => {
|
|||
env: { NODE_ENV: 'production' },
|
||||
})
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-primary {
|
||||
|
|
@ -214,7 +214,7 @@ describe('static build', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-primary {
|
||||
|
|
@ -262,7 +262,7 @@ describe('static build', () => {
|
|||
env: { NODE_ENV: 'production' },
|
||||
})
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -273,7 +273,7 @@ describe('static build', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -329,7 +329,7 @@ describe('static build', () => {
|
|||
env: { NODE_ENV: 'production' },
|
||||
})
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -340,7 +340,7 @@ describe('static build', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -375,7 +375,7 @@ describe('static build', () => {
|
|||
env: { NODE_ENV: 'production' },
|
||||
})
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -386,7 +386,7 @@ describe('static build', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -430,7 +430,7 @@ describe('watcher', () => {
|
|||
await appendToInputFile('index.html', html`<div class="bg-red-500"></div>`)
|
||||
await runningProcess.onStderr(ready)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -447,7 +447,7 @@ describe('watcher', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -497,7 +497,7 @@ describe('watcher', () => {
|
|||
await appendToInputFile('glob/index.html', html`<div class="bg-red-500"></div>`)
|
||||
await runningProcess.onStderr(ready)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -514,7 +514,7 @@ describe('watcher', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-red-500 {
|
||||
|
|
@ -703,7 +703,7 @@ describe('watcher', () => {
|
|||
)
|
||||
await runningProcess.onStderr(ready)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.btn {
|
||||
|
|
@ -722,7 +722,7 @@ describe('watcher', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.btn {
|
||||
|
|
@ -800,7 +800,7 @@ describe('watcher', () => {
|
|||
let runningProcess = $('node ../../lib/cli.js -i ./src/index.css -o ./dist/main.css -w')
|
||||
await runningProcess.onStderr(ready)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -811,7 +811,7 @@ describe('watcher', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -832,7 +832,7 @@ describe('watcher', () => {
|
|||
)
|
||||
await runningProcess.onStderr(ready)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -843,7 +843,7 @@ describe('watcher', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -876,7 +876,7 @@ describe('watcher', () => {
|
|||
)
|
||||
await runningProcess.onStderr(ready)
|
||||
|
||||
if (!env.OXIDE) {
|
||||
if (env.ENGINE === 'stable') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
@ -887,7 +887,7 @@ describe('watcher', () => {
|
|||
)
|
||||
}
|
||||
|
||||
if (env.OXIDE) {
|
||||
if (env.ENGINE === 'oxide') {
|
||||
expect(await readOutputFile('main.css')).toIncludeCss(
|
||||
css`
|
||||
.bg-yellow {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue