From e60c65594c5846bcdb1a9576cf3c4be68e320c84 Mon Sep 17 00:00:00 2001
From: Hernan Alvarado <hernanvid123@gmail.com>
Date: Wed, 23 Oct 2024 13:37:54 -0500
Subject: [PATCH 1/3] chore: clean up `scroll-utilities` tests

---
 .../tailwindcss-utilities/test/index.test.ts  | 66 +++++++++----------
 1 file changed, 32 insertions(+), 34 deletions(-)

diff --git a/packages/tailwindcss-utilities/test/index.test.ts b/packages/tailwindcss-utilities/test/index.test.ts
index fc40669..98edcea 100644
--- a/packages/tailwindcss-utilities/test/index.test.ts
+++ b/packages/tailwindcss-utilities/test/index.test.ts
@@ -5,39 +5,37 @@ import plugin from "../src"
 const generateClasses = extractClasses(plugin)
 
 describe("scroll utilities", () => {
-    test.concurrent("generate the css for scroll utilities", async ({ expect }) => {
-        const html = `<div class="scroll:w-2"></div>`
-        const css = await generateClasses(html)
-        expect(css).toMatch(".scroll\\:w-2::-webkit-scrollbar{width:0.5rem}")
-    })
-
-    test.concurrent("generate the css for scroll utilities with custom width", async ({ expect }) => {
-        const html = `<div class="scroll:w-[10px]"></div>`
-        const css = await generateClasses(html)
-        expect(css).toMatch(".scroll\\:w-\\[10px\\]::-webkit-scrollbar{width:10px}")
-    })
-
-    test.concurrent("generate the css for scroll thumb utilities", async ({ expect }) => {
-        const html = `<div class="thumb:my-4"></div>`
-        const css = await generateClasses(html)
-        expect(css).toMatch(".thumb\\:my-4::-webkit-scrollbar-thumb{margin-top:1rem;margin-bottom:1rem}")
-    })
-
-    test.concurrent("generate the css for scroll thumb utilities with custom margin", async ({ expect }) => {
-        const html = `<div class="thumb:my-[8px]"></div>`
-        const css = await generateClasses(html)
-        expect(css).toMatch(".thumb\\:my-\\[8px\\]::-webkit-scrollbar-thumb{margin-top:8px;margin-bottom:8px}")
-    })
-
-    test.concurrent("generate the css for scroll track utilities", async ({ expect }) => {
-        const html = `<div class="track:border"></div>`
-        const css = await generateClasses(html)
-        expect(css).toMatch(".track\\:border::-webkit-scrollbar-track{border-width:1px}")
-    })
-
-    test.concurrent("generate the css for scroll track utilities with custom border width", async ({ expect }) => {
-        const html = `<div class="track:border-[3px]"></div>`
-        const css = await generateClasses(html)
-        expect(css).toMatch(".track\\:border-\\[3px\\]::-webkit-scrollbar-track{border-width:3px}")
+    const testCases = [
+        {
+            input: `<div class="scroll:w-2"></div>`,
+            output: ".scroll\\:w-2::-webkit-scrollbar{width:0.5rem}",
+        },
+        {
+            input: `<div class="scroll:w-[10px]"></div>`,
+            output: ".scroll\\:w-\\[10px\\]::-webkit-scrollbar{width:10px}",
+        },
+        {
+            input: `<div class="thumb:my-4"></div>`,
+            output: ".thumb\\:my-4::-webkit-scrollbar-thumb{margin-top:1rem;margin-bottom:1rem}",
+        },
+        {
+            input: `<div class="thumb:my-[8px]"></div>`,
+            output: ".thumb\\:my-\\[8px\\]::-webkit-scrollbar-thumb{margin-top:8px;margin-bottom:8px}",
+        },
+        {
+            input: `<div class="track:border"></div>`,
+            output: ".track\\:border::-webkit-scrollbar-track{border-width:1px}",
+        },
+        {
+            input: `<div class="track:border-[3px]"></div>`,
+            output: ".track\\:border-\\[3px\\]::-webkit-scrollbar-track{border-width:3px}",
+        },
+    ]
+    testCases.forEach(({ input, output }) => {
+        const extract = input.match(/class="([^"]*)"/)?.[1]
+        test.concurrent(`generate the css for ${extract}`, async ({ expect }) => {
+            const css = await generateClasses(input)
+            expect(css).toMatch(output)
+        })
     })
 })

From 6a21b76e93d6b0ea47f309d576be0cd7605d3ed1 Mon Sep 17 00:00:00 2001
From: Hernan Alvarado <hernanvid123@gmail.com>
Date: Wed, 23 Oct 2024 13:43:50 -0500
Subject: [PATCH 2/3] test: add tests for `min-width` utilities

---
 .../tailwindcss-utilities/test/index.test.ts  | 32 +++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/packages/tailwindcss-utilities/test/index.test.ts b/packages/tailwindcss-utilities/test/index.test.ts
index 98edcea..9a7aed5 100644
--- a/packages/tailwindcss-utilities/test/index.test.ts
+++ b/packages/tailwindcss-utilities/test/index.test.ts
@@ -39,3 +39,35 @@ describe("scroll utilities", () => {
         })
     })
 })
+
+describe("min-width utilities", () => {
+    const testCases = [
+        {
+            input: `<div class="min-w-sm"></div>`,
+            output: ".min-w-sm{min-width:640px}",
+        },
+        {
+            input: `<div class="min-w-md"></div>`,
+            output: ".min-w-md{min-width:768px}",
+        },
+        {
+            input: `<div class="min-w-lg"></div>`,
+            output: ".min-w-lg{min-width:1024px}",
+        },
+        {
+            input: `<div class="min-w-xl"></div>`,
+            output: ".min-w-xl{min-width:1280px}",
+        },
+        {
+            input: `<div class="min-w-2xl"></div>`,
+            output: ".min-w-2xl{min-width:1526px}",
+        },
+    ]
+    testCases.forEach(({ input, output }) => {
+        const extract = input.match(/class="([^"]*)"/)?.[1]
+        test.concurrent(`generate the css for ${extract}`, async ({ expect }) => {
+            const css = await generateClasses(input)
+            expect(css).toMatch(output)
+        })
+    })
+})

From 70fd34350b1bff7cf7e130461ed6438d8adcd589 Mon Sep 17 00:00:00 2001
From: Hernan Alvarado <hernanvid123@gmail.com>
Date: Thu, 24 Oct 2024 08:56:44 -0500
Subject: [PATCH 3/3] test: add tests for `pseudo-classes-utilities`

---
 .../tailwindcss-utilities/test/index.test.ts  | 25 +++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/packages/tailwindcss-utilities/test/index.test.ts b/packages/tailwindcss-utilities/test/index.test.ts
index 9a7aed5..e4dc629 100644
--- a/packages/tailwindcss-utilities/test/index.test.ts
+++ b/packages/tailwindcss-utilities/test/index.test.ts
@@ -71,3 +71,28 @@ describe("min-width utilities", () => {
         })
     })
 })
+
+describe("psuedo classes utilities", () => {
+    const testCases = [
+        {
+            input: `<div class="where-[div]:w-10"></div>`,
+            output: ".where-\\[div\\]\\:w-10:where(div){width:2.5rem}",
+        },
+        {
+            input: `<div class="is-[div]:w-10"></div>`,
+            output: ".is-\\[div\\]\\:w-10:is(div){width:2.5rem}",
+        },
+        {
+            input: `<div class="w-10 not-[ul]:w-1.5"></div>`,
+            output: "w-10{width:2.5rem}.not-\\[ul\\]\\:w-1\\.5:not(ul){width:0.375rem}",
+        },
+    ]
+    testCases.forEach(({ input, output }) => {
+        const extract = input.match(/class="([^"]*)"/)?.[1]
+        test.concurrent(`generate the css for ${extract}`, async ({ expect }) => {
+            const css = await generateClasses(input)
+            console.log(css)
+            expect(css).toMatch(output)
+        })
+    })
+})