ensure incomputable signatures result in unique value

packages/@tailwindcss-upgrade/src/codemods/template/migrate-arbitrary-utilities.ts

@@ -22,7 +22,7 @@ const preComputedUtilities = new DefaultMap<DesignSystem, DefaultMap<string, str
   // Actual static utilities
   for (let root of ds.utilities.keys('static')) {
     let signature = signatures.get(root)
-    if (signature === null) continue
+    if (typeof signature !== 'string') continue
     lookup.get(signature).push(root)
   }
 
@@ -36,12 +36,12 @@ const preComputedUtilities = new DefaultMap<DesignSystem, DefaultMap<string, str
       for (let value of values) {
         let candidateString = value === null ? root : `${root}-${value}`
         let signature = signatures.get(candidateString)
-        if (signature !== null) lookup.get(signature).push(candidateString)
+        if (typeof signature === 'string') lookup.get(signature).push(candidateString)
 
         if (supportsNegative) {
           let negativeCandidateString = `-${candidateString}`
           let signature = signatures.get(negativeCandidateString)
-          if (signature !== null) lookup.get(signature).push(negativeCandidateString)
+          if (typeof signature === 'string') lookup.get(signature).push(negativeCandidateString)
         }
       }
 
@@ -57,12 +57,12 @@ const preComputedUtilities = new DefaultMap<DesignSystem, DefaultMap<string, str
           let candidateString =
             value === null ? `${root}/${modifier}` : `${root}-${value}/${modifier}`
           let signature = signatures.get(candidateString)
-          if (signature !== null) lookup.get(signature).push(candidateString)
+          if (typeof signature === 'string') lookup.get(signature).push(candidateString)
 
           if (supportsNegative) {
             let negativeCandidateString = `-${candidateString}`
             let signature = signatures.get(negativeCandidateString)
-            if (signature !== null) lookup.get(signature).push(negativeCandidateString)
+            if (typeof signature === 'string') lookup.get(signature).push(negativeCandidateString)
           }
         }
       }
@@ -142,7 +142,7 @@ export function migrateArbitraryUtilities(
 
     // Compute the signature for the target candidate
     let targetSignature = signatures.get(targetCandidateString)
-    if (targetSignature === null) continue
+    if (typeof targetSignature !== 'string') continue
 
     // Try a few options to find a suitable replacement utility
     for (let replacementCandidate of tryReplacements(targetSignature, targetCandidate)) {
@@ -200,7 +200,7 @@ export function migrateArbitraryUtilities(
       let targetSignatureWithoutModifier = signatures.get(
         printCandidate(designSystem, candidateWithoutModifier),
       )
-      if (targetSignatureWithoutModifier !== null) {
+      if (typeof targetSignatureWithoutModifier === 'string') {
         for (let replacementCandidate of tryReplacements(
           targetSignatureWithoutModifier,
           candidateWithoutModifier,

packages/@tailwindcss-upgrade/src/codemods/template/migrate-arbitrary-variants.ts

@@ -16,7 +16,7 @@ const variantsLookup = new DefaultMap<DesignSystem, DefaultMap<string, string[]>
     for (let [root, variant] of designSystem.variants.entries()) {
       if (variant.kind === 'static') {
         let signature = signatures.get(root)
-        if (signature === null) continue
+        if (typeof signature !== 'string') continue
         lookup.get(signature).push(root)
       }
     }
@@ -30,6 +30,9 @@ export function migrateArbitraryVariants(
   _userConfig: Config | null,
   rawCandidate: string,
 ): string {
+  let signatures = computeVariantSignature.get(designSystem)
+  let variants = variantsLookup.get(designSystem)
+
   for (let readonlyCandidate of designSystem.parseCandidate(rawCandidate)) {
     // We are only interested in the variants
     if (readonlyCandidate.variants.length <= 0) return rawCandidate
@@ -42,10 +45,10 @@ export function migrateArbitraryVariants(
       if (variant.kind === 'compound') continue
 
       let targetString = printVariant(variant)
-      let targetSignature = computeVariantSignature.get(designSystem).get(targetString)
-      if (!targetSignature) continue
+      let targetSignature = signatures.get(targetString)
+      if (typeof targetSignature !== 'string') continue
 
-      let foundVariants = variantsLookup.get(designSystem).get(targetSignature)
+      let foundVariants = variants.get(targetSignature)
       if (foundVariants.length !== 1) continue
 
       let foundVariant = foundVariants[0]

packages/@tailwindcss-upgrade/src/codemods/template/migrate-optimize-modifier.test.ts

@@ -40,6 +40,9 @@ describe.each([['default'], ['with-variant'], ['important'], ['prefix']])('%s',
     // Drop unnecessary modifiers
     ['bg-red-500/[100%]', 'bg-red-500'],
     ['bg-red-500/100', 'bg-red-500'],
+
+    // Keep modifiers on classes that don't _really_ exist
+    ['group/name', 'group/name'],
   ])(testName, async (candidate, expected) => {
     if (strategy === 'with-variant') {
       candidate = `focus:${candidate}`

packages/@tailwindcss-upgrade/src/codemods/template/signatures.ts

@@ -9,8 +9,8 @@ import { printArbitraryValue } from './candidates'
 
 // Given a utility, compute a signature that represents the utility. The
 // signature will be a normalised form of the generated CSS for the utility, or
-// null if the utility is not valid. The class in the selector will be replaced
-// with the `.x` selector.
+// a unique symbol if the utility is not valid. The class in the selector will
+// be replaced with the `.x` selector.
 //
 // This function should only be passed the base utility so `flex`, `hover:flex`
 // and `focus:flex` will all use just `flex`. Variants are handled separately.
@@ -25,9 +25,9 @@ import { printArbitraryValue } from './candidates'
 // These produce the same signature, therefore they represent the same utility.
 export const computeUtilitySignature = new DefaultMap<
   DesignSystem,
-  DefaultMap<string, string | null>
+  DefaultMap<string, string | Symbol>
 >((designSystem) => {
-  return new DefaultMap<string, string | null>((utility) => {
+  return new DefaultMap<string, string | Symbol>((utility) => {
     try {
       // Ensure the prefix is added to the utility if it is not already present.
       utility =
@@ -181,15 +181,17 @@ export const computeUtilitySignature = new DefaultMap<
       let signature = toCss(ast)
       return signature
     } catch {
-      return null
+      // A unique symbol is returned to ensure that 2 signatures resulting in
+      // `null` are not considered equal.
+      return Symbol()
     }
   })
 })
 
 // Given a variant, compute a signature that represents the variant. The
 // signature will be a normalised form of the generated CSS for the variant, or
-// null if the variant is not valid. The class in the selector will be replaced
-// with `.x`.
+// a unique symbol if the variant is not valid. The class in the selector will
+// be replaced with `.x`.
 //
 // E.g.:
 //
@@ -201,9 +203,9 @@ export const computeUtilitySignature = new DefaultMap<
 // These produce the same signature, therefore they represent the same variant.
 export const computeVariantSignature = new DefaultMap<
   DesignSystem,
-  DefaultMap<string, string | null>
+  DefaultMap<string, string | Symbol>
 >((designSystem) => {
-  return new DefaultMap<string, string | null>((variant) => {
+  return new DefaultMap<string, string | Symbol>((variant) => {
     try {
       // Ensure the prefix is added to the utility if it is not already present.
       variant =
@@ -238,7 +240,9 @@ export const computeVariantSignature = new DefaultMap<
       let signature = toCss(ast)
       return signature
     } catch {
-      return null
+      // A unique symbol is returned to ensure that 2 signatures resulting in
+      // `null` are not considered equal.
+      return Symbol()
     }
   })
 })