From 1d72dc269956bbdac96c33172bddf831b4f682ec Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Fri, 18 Jun 2021 16:01:38 -0400
Subject: [PATCH] Error when dash is used as custom separator (#4704)

---
 src/jit/processTailwindFeatures.js |  6 ++++++
 tests/jit/custom-separator.test.js | 18 ++++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/src/jit/processTailwindFeatures.js b/src/jit/processTailwindFeatures.js
index 1a60f6986bc9..c8bd8eab87b5 100644
--- a/src/jit/processTailwindFeatures.js
+++ b/src/jit/processTailwindFeatures.js
@@ -35,6 +35,12 @@ export default function processTailwindFeatures(setupContext) {
       },
     })(root, result)
 
+    if (context.tailwindConfig.separator === '-') {
+      throw new Error(
+        "The '-' character cannot be used as a custom separator in JIT mode due to parsing ambiguity. Please use another character like '_' instead."
+      )
+    }
+
     expandTailwindAtRules(context)(root, result)
     expandApplyAtRules(context)(root, result)
     evaluateTailwindFunctions(context)(root, result)
diff --git a/tests/jit/custom-separator.test.js b/tests/jit/custom-separator.test.js
index 3cd86d8e568d..74c6e205a562 100644
--- a/tests/jit/custom-separator.test.js
+++ b/tests/jit/custom-separator.test.js
@@ -29,3 +29,21 @@ test('custom separator', () => {
     expect(result.css).toMatchFormattedCss(expected)
   })
 })
+
+test('dash is not supported', () => {
+  let config = {
+    darkMode: 'class',
+    mode: 'jit',
+    purge: [{ raw: 'lg-hover-font-bold' }],
+    separator: '-',
+    corePlugins: {},
+    theme: {},
+    plugins: [],
+  }
+
+  let css = `@tailwind utilities`
+
+  return expect(run(css, config)).rejects.toThrowError(
+    "The '-' character cannot be used as a custom separator in JIT mode due to parsing ambiguity. Please use another character like '_' instead."
+  )
+})