Replace __OXIDE__ at build time to prevent @tailwindcss/oxide lea…

…ks in the stable engine (tailwindlabs#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 <[email protected]>
tolgahanbeyazoglu · Apr 18, 2023 · 72bc318 · 72bc318
1 parent 9f86019
commit 72bc318
Show file tree

Hide file tree

Showing 23 changed files with 195 additions and 169 deletions.
diff --git a/.swcrc b/.swcrc
@@ -11,6 +11,11 @@
     "parser": {
       "syntax": "typescript",
       "tsx": false
+    },
+    "minify": {
+      "compress": {
+        "unused": true
+      }
     }
   }
 }
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Don’t move unknown pseudo-elements to the end of selectors ([#10943](https://github.com/tailwindlabs/tailwindcss/pull/10943), [#10962](https://github.com/tailwindlabs/tailwindcss/pull/10962))
 - Inherit gradient stop positions when using variants ([#11002](https://github.com/tailwindlabs/tailwindcss/pull/11002))
 - Honor default `to` position of gradient when using implicit transparent colors ([#11002](https://github.com/tailwindlabs/tailwindcss/pull/11002))
+- Replace `__OXIDE__` at build time to prevent `@tailwindcss/oxide` leaks in the stable engine ([#10988](https://github.com/tailwindlabs/tailwindcss/pull/10988))
 
 ## [3.3.1] - 2023-03-30
 

diff --git a/integrations/parcel/tests/integration.test.js b/integrations/parcel/tests/integration.test.js
@@ -74,7 +74,7 @@ describe('static build', () => {
       env: { NODE_ENV: 'production' },
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-primary {
@@ -85,7 +85,7 @@ describe('static build', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-primary {
@@ -138,7 +138,7 @@ describe('static build', () => {
       env: { NODE_ENV: 'production' },
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-primary {
@@ -149,7 +149,7 @@ describe('static build', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-primary {
@@ -202,7 +202,7 @@ describe('watcher', () => {
       await appendToInputFile('index.html', html`<div class="bg-red-500"></div>`)
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-red-500 {
@@ -219,7 +219,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-red-500 {
@@ -274,7 +274,7 @@ describe('watcher', () => {
       await appendToInputFile('glob/index.html', html`<div class="bg-red-500"></div>`)
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-red-500 {
@@ -291,7 +291,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .bg-red-500 {
@@ -445,7 +445,7 @@ describe('watcher', () => {
       )
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .btn {
@@ -461,7 +461,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile(/index\.\w+\.css$/)).toIncludeCss(
         css`
           .btn {

diff --git a/integrations/postcss-cli/tests/integration.test.js b/integrations/postcss-cli/tests/integration.test.js
@@ -61,7 +61,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 {
@@ -78,7 +78,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('main.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -128,7 +128,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 {
@@ -145,7 +145,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('main.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -284,7 +284,7 @@ describe('watcher', () => {
     )
     await runningProcess.onStderr(ready)
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile('main.css')).toIncludeCss(
         css`
           .btn {
@@ -303,7 +303,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('main.css')).toIncludeCss(
         css`
           /* prettier-ignore */

diff --git a/integrations/rollup-sass/tests/integration.test.js b/integrations/rollup-sass/tests/integration.test.js
@@ -61,7 +61,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('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -78,7 +78,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -128,7 +128,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('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -145,7 +145,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -282,7 +282,7 @@ describe('watcher', () => {
     )
     await runningProcess.onStderr(ready)
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .btn {
@@ -298,7 +298,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .btn {
@@ -377,7 +377,7 @@ describe('watcher', () => {
     )
     await runningProcess.onStderr(ready)
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .btn {
@@ -393,7 +393,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .btn {

diff --git a/integrations/rollup/tests/integration.test.js b/integrations/rollup/tests/integration.test.js
@@ -62,7 +62,7 @@ describe('static build', () => {
       env: { NODE_ENV: 'production' },
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-primary {
@@ -73,7 +73,7 @@ describe('static build', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-primary {
@@ -120,7 +120,7 @@ describe('static build', () => {
       env: { NODE_ENV: 'production' },
     })
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-primary {
@@ -131,7 +131,7 @@ describe('static build', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-primary {
@@ -175,7 +175,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('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -192,7 +192,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -242,7 +242,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('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -259,7 +259,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .bg-red-500 {
@@ -396,7 +396,7 @@ describe('watcher', () => {
     )
     await runningProcess.onStderr(ready)
 
-    if (!env.OXIDE) {
+    if (env.ENGINE === 'stable') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .btn {
@@ -415,7 +415,7 @@ describe('watcher', () => {
       )
     }
 
-    if (env.OXIDE) {
+    if (env.ENGINE === 'oxide') {
       expect(await readOutputFile('index.css')).toIncludeCss(
         css`
           .btn {