Repository: tailwindlabs/tailwindcss
Pull request #6797 (2021-12-29 22:31:57)

Improve `DEBUG` flag
This PR will improve the parsing of the DEBUG flag. 
Currently we only check if you provided a DEBUG flag and that you didn't provide the value `0`. This worked so far, but it's time to improve upon this.

There is the `debug` package which is used by many applications and includes some conventions: https://github.com/debug-js/debug#conventions

So now we will ensure that take care of the following cases:
| Value                   | Debug enabled |
| ----------------------- | ------------- |
| 'true'                  | true          |
| '1'                     | true          |
| 'false'                 | false         |
| '0'                     | false         |
| '\*'                    | true          |
| 'tailwind'              | true          |
| 'tailwind:\*'           | true          |
| 'tailwindcss'           | true          |
| 'tailwindcss:\*'        | true          |
| 'other,tailwind'        | true          |
| 'other,tailwind:\*'     | true          |
| 'other,tailwindcss'     | true          |
| 'other,tailwindcss:\*'  | true          |
| 'other,-tailwind'       | false         |
| 'other,-tailwind:\*'    | false         |
| 'other,-tailwindcss'    | false         |
| 'other,-tailwindcss:\*' | false         |
| '-tailwind'             | false         |
| '-tailwind:\*'          | false         |
| '-tailwindcss'          | false         |
| '-tailwindcss:\*'       | false         |

Added a bit of code but the good part is that this only runs once at the beginning so shouldn't be too bad.

Fixes: #6769


Patch:
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4ad9fa01..7392f68d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
-- Nothing yet!
+### Fixed
+
+- Improve `DEBUG` flag ([#6797](https://github.com/tailwindlabs/tailwindcss/pull/6797))
 
 ## [3.0.8] - 2021-12-28
 
diff --git a/src/lib/sharedState.js b/src/lib/sharedState.js
index fc1e278a..2ef1be25 100644
--- a/src/lib/sharedState.js
+++ b/src/lib/sharedState.js
@@ -1,10 +1,49 @@
 export const env = {
   TAILWIND_MODE: process.env.TAILWIND_MODE,
   NODE_ENV: process.env.NODE_ENV,
-  DEBUG: process.env.DEBUG !== undefined && process.env.DEBUG !== '0',
+  DEBUG: resolveDebug(process.env.DEBUG),
   TAILWIND_DISABLE_TOUCH: process.env.TAILWIND_DISABLE_TOUCH !== undefined,
   TAILWIND_TOUCH_DIR: process.env.TAILWIND_TOUCH_DIR,
 }
 export const contextMap = new Map()
 export const configContextMap = new Map()
 export const contextSourcesMap = new Map()
+
+export function resolveDebug(debug) {
+  if (debug === undefined) {
+    return false
+  }
+
+  // Environment variables are strings, so convert to boolean
+  if (debug === 'true' || debug === '1') {
+    return true
+  }
+
+  if (debug === 'false' || debug === '0') {
+    return false
+  }
+
+  // Keep the debug convention into account:
+  // DEBUG=* -> This enables all debug modes
+  // DEBUG=projectA,projectB,projectC -> This enables debug for projectA, projectB and projectC
+  // DEBUG=projectA:* -> This enables all debug modes for projectA (if you have sub-types)
+  // DEBUG=projectA,-projectB -> This enables debug for projectA and explicitly disables it for projectB
+
+  if (debug === '*') {
+    return true
+  }
+
+  let debuggers = debug.split(',').map((d) => d.split(':')[0])
+
+  // Ignoring tailwind / tailwindcss
+  if (debuggers.includes('-tailwindcss') || debuggers.includes('-tailwind')) {
+    return false
+  }
+
+  // Definitely including tailwind / tailwindcss
+  if (debuggers.includes('tailwindcss') || debuggers.includes('tailwind')) {
+    return true
+  }
+
+  return false
+}


Test patch:
diff --git a/tests/shared-state.test.js b/tests/shared-state.test.js
new file mode 100644
index 00000000..f4072353
--- /dev/null
+++ b/tests/shared-state.test.js
@@ -0,0 +1,28 @@
+import { resolveDebug } from '../src/lib/sharedState'
+
+it.each`
+  value                     | expected
+  ${'true'}                 | ${true}
+  ${'1'}                    | ${true}
+  ${'false'}                | ${false}
+  ${'0'}                    | ${false}
+  ${'*'}                    | ${true}
+  ${'tailwind'}             | ${true}
+  ${'tailwind:*'}           | ${true}
+  ${'tailwindcss'}          | ${true}
+  ${'tailwindcss:*'}        | ${true}
+  ${'other,tailwind'}       | ${true}
+  ${'other,tailwind:*'}     | ${true}
+  ${'other,tailwindcss'}    | ${true}
+  ${'other,tailwindcss:*'}  | ${true}
+  ${'other,-tailwind'}      | ${false}
+  ${'other,-tailwind:*'}    | ${false}
+  ${'other,-tailwindcss'}   | ${false}
+  ${'other,-tailwindcss:*'} | ${false}
+  ${'-tailwind'}            | ${false}
+  ${'-tailwind:*'}          | ${false}
+  ${'-tailwindcss'}         | ${false}
+  ${'-tailwindcss:*'}       | ${false}
+`('should resolve the debug ($value) flag correctly ($expected)', ({ value, expected }) => {
+  expect(resolveDebug(value)).toBe(expected)
+})