Warn about invalid globs in content

CHANGELOG.md

@@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
-- Nothing yet!
+### Added
+
+- Warn about invalid globs in `content` ([#6449](https://github.com/tailwindlabs/tailwindcss/pull/6449))
 
 ## [3.0.2] - 2021-12-13
 

src/util/log.js

@@ -12,6 +12,10 @@ function log(chalk, messages, key) {
   messages.forEach((message) => console.warn(chalk, '-', message))
 }
 
+export function dim(input) {
+  return chalk.dim(input)
+}
+
 export default {
   info(key, messages) {
     log(chalk.bold.cyan('info'), ...(Array.isArray(key) ? [key] : [messages, key]))

src/util/normalizeConfig.js

@@ -1,4 +1,4 @@
-import log from './log'
+import log, { dim } from './log'
 
 export function normalizeConfig(config) {
   // Quick structure validation
@@ -245,5 +245,18 @@ export function normalizeConfig(config) {
     })(),
   }
 
+  // Validate globs to prevent bogus globs.
+  // E.g.: `./src/*.{html}` is invalid, the `{html}` should just be `html`
+  for (let file of config.content.files) {
+    if (typeof file === 'string' && /{([^,]*?)}/g.test(file)) {
+      log.warn('invalid-glob-braces', [
+        `The glob pattern ${dim(file)} in your config is invalid.`,
+        `    Update it to ${dim(file.replace(/{([^,]*?)}/g, '$1'))} to silence this warning.`,
+        // TODO: Add https://tw.wtf/invalid-glob-braces
+      ])
+      break
+    }
+  }
+
   return config
 }

tests/normalize-config.test.js

@@ -1,4 +1,6 @@
+import { normalizeConfig } from '../src/util/normalizeConfig'
 import { run, css } from './util/run'
+import resolveConfig from '../src/public/resolve-config'
 
 it.each`
   config
@@ -95,3 +97,45 @@ it('should still be possible to use the "old" v2 config', () => {
     `)
   })
 })
+
+it('should keep content files with globs', () => {
+  let config = {
+    content: ['./example-folder/**/*.{html,js}'],
+  }
+
+  expect(normalizeConfig(resolveConfig(config)).content).toEqual({
+    files: ['./example-folder/**/*.{html,js}'],
+    extract: {},
+    transform: {},
+  })
+})
+
+it('should warn when we detect invalid globs with incorrect brace expansion', () => {
+  let log = require('../src/util/log')
+  let spy = jest.spyOn(log.default, 'warn')
+
+  let config = {
+    content: [
+      './{example-folder}/**/*.{html,js}',
+      './{example-folder}/**/*.{html}',
+      './example-folder/**/*.{html}',
+    ],
+  }
+
+  // No rewrite happens
+  expect(normalizeConfig(resolveConfig(config)).content).toEqual({
+    files: [
+      './{example-folder}/**/*.{html,js}',
+      './{example-folder}/**/*.{html}',
+      './example-folder/**/*.{html}',
+    ],
+    extract: {},
+    transform: {},
+  })
+
+  // But a warning should happen
+  expect(spy).toHaveBeenCalledTimes(2)
+  expect(spy.mock.calls.map((x) => x[0])).toEqual(['invalid-glob-braces', 'invalid-glob-braces'])
+
+  spy.mockClear()
+})