From 9bb1f17593afd173be8409cdddf736b60cda630d Mon Sep 17 00:00:00 2001 From: Robin Malfait Date: Fri, 12 Jul 2024 16:32:02 +0200 Subject: [PATCH] ensure nested selectors are not modified when using `group-*` --- packages/tailwindcss/src/index.test.ts | 36 ++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/packages/tailwindcss/src/index.test.ts b/packages/tailwindcss/src/index.test.ts index a7ba81a7d..89927dd5e 100644 --- a/packages/tailwindcss/src/index.test.ts +++ b/packages/tailwindcss/src/index.test.ts @@ -1737,4 +1737,40 @@ describe('@variant', () => { `) }) }) + + test('combining multiple complex variants', () => { + let compiled = compile(css` + @variant one { + &.foo-1 { + &.bar-1 { + @slot; + } + } + } + + @variant two { + &.foo-2 { + &.bar-2 { + @slot; + } + } + } + + @layer utilities { + @tailwind utilities; + } + `).build(['group-one:two:underline', 'one:group-two:underline']) + + expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(` + "@layer utilities { + .one\\:group-two\\:underline.foo-1.bar-1:is(:where(.group).foo-2 *):is(:where(.group).bar-2 *) { + text-decoration-line: underline; + } + + .group-one\\:two\\:underline:is(:where(.group).foo-1 *):is(:where(.group).bar-1 *).foo-2.bar-2 { + text-decoration-line: underline; + } + }" + `) + }) })