Add glob property to dir-dependency messages (tailwindlabs#4539)

* add `glob` property to `dir-dependency` messages

* Add `glob` to `dir-dependency` messages

Author: bradlc

src/jit/lib/setupTrackingContext.js

@@ -2,8 +2,6 @@ import fs from 'fs'
 import path from 'path'
 
 import fastGlob from 'fast-glob'
-import isGlob from 'is-glob'
-import globParent from 'glob-parent'
 import LRU from 'quick-lru'
 import normalizePath from 'normalize-path'
 
@@ -17,6 +15,7 @@ import resolveConfigPath from '../../util/resolveConfigPath'
 import { env } from './sharedState'
 
 import { getContext, getFileModifiedMap } from './setupContextUtils'
+import parseDependency from '../../util/parseDependency'
 
 let configPathCache = new LRU({ maxSize: 100 })
 
@@ -167,17 +166,8 @@ export default function setupTrackingContext(configOrPath) {
         let fileModifiedMap = getFileModifiedMap(context)
 
         // Add template paths as postcss dependencies.
-        for (let maybeGlob of candidateFiles) {
-          if (isGlob(maybeGlob)) {
-            // rollup-plugin-postcss does not support dir-dependency messages
-            // but directories can be watched in the same way as files
-            registerDependency(
-              path.resolve(globParent(maybeGlob)),
-              env.ROLLUP_WATCH === 'true' ? 'dependency' : 'dir-dependency'
-            )
-          } else {
-            registerDependency(path.resolve(maybeGlob))
-          }
+        for (let fileOrGlob of candidateFiles) {
+          registerDependency(parseDependency(fileOrGlob))
         }
 
         for (let changedContent of resolvedChangedContent(
@@ -190,7 +180,7 @@ export default function setupTrackingContext(configOrPath) {
       }
 
       for (let file of configDependencies) {
-        registerDependency(file)
+        registerDependency({ type: 'dependency', file })
       }
 
       return context

src/jit/lib/setupWatchingContext.js

@@ -308,7 +308,7 @@ export default function setupWatchingContext(configOrPath) {
       let contextConfigDependencies = getConfigDependencies(context)
 
       for (let file of configDependencies) {
-        registerDependency(file)
+        registerDependency({ type: 'dependency', file })
       }
 
       context.disposables.push((oldContext) => {
@@ -338,7 +338,7 @@ export default function setupWatchingContext(configOrPath) {
       // to trigger rebuilds.
       let touchFile = getTouchFile(context)
       if (touchFile) {
-        registerDependency(touchFile)
+        registerDependency({ type: 'dependency', file: touchFile })
       }
 
       if (tailwindDirectives.size > 0) {

src/jit/processTailwindFeatures.js

@@ -8,20 +8,17 @@ import { createContext } from './lib/setupContextUtils'
 
 export default function processTailwindFeatures(setupContext) {
   return function (root, result) {
-    function registerDependency(fileName, type = 'dependency') {
-      result.messages.push({
-        type,
-        plugin: 'tailwindcss',
-        parent: result.opts.from,
-        [type === 'dir-dependency' ? 'dir' : 'file']: fileName,
-      })
-    }
-
     let tailwindDirectives = normalizeTailwindDirectives(root)
 
     let context = setupContext({
       tailwindDirectives,
-      registerDependency,
+      registerDependency(dependency) {
+        result.messages.push({
+          plugin: 'tailwindcss',
+          parent: result.opts.from,
+          ...dependency,
+        })
+      },
       createContext(tailwindConfig, changedContent) {
         return createContext(tailwindConfig, changedContent, tailwindDirectives, root)
       },

src/util/parseDependency.js

@@ -0,0 +1,45 @@
+import isGlob from 'is-glob'
+import globParent from 'glob-parent'
+import path from 'path'
+
+// Based on `glob-base`
+// https://github.com/micromatch/glob-base/blob/master/index.js
+function parseGlob(pattern) {
+  let glob = pattern
+  let base = globParent(pattern)
+
+  if (base !== '.') {
+    glob = pattern.substr(base.length)
+    if (glob.charAt(0) === '/') {
+      glob = glob.substr(1)
+    }
+  }
+
+  if (glob.substr(0, 2) === './') {
+    glob = glob.substr(2)
+  }
+  if (glob.charAt(0) === '/') {
+    glob = glob.substr(1)
+  }
+
+  return { base, glob }
+}
+
+export default function parseDependency(normalizedFileOrGlob) {
+  let message
+
+  if (isGlob(normalizedFileOrGlob)) {
+    let { base, glob } = parseGlob(normalizedFileOrGlob)
+    message = { type: 'dir-dependency', dir: path.resolve(base), glob }
+  } else {
+    message = { type: 'dependency', file: path.resolve(normalizedFileOrGlob) }
+  }
+
+  // rollup-plugin-postcss does not support dir-dependency messages
+  // but directories can be watched in the same way as files
+  if (message.type === 'dir-dependency' && process.env.ROLLUP_WATCH === 'true') {
+    message = { type: 'dependency', file: message.dir }
+  }
+
+  return message
+}