wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Ensure nested selectors are not modified when using group-* and peer-*

Browse source 
Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
This commit is contained in:
Jordan Pittman 2024-07-16 17:40:28 -04:00
parent 23e6d433a2
commit cf846a5ff6
1 changed files with 49 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

49
packages/tailwindcss/src/index.test.ts
View file

@ -1811,4 +1811,53 @@ 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',
'peer-one:two:underline',
'one:peer-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;
}
.one\\:peer-two\\:underline.foo-1.bar-1:is(:where(.peer).foo-2 ~ *):is(:where(.peer).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;
}
.peer-one\\:two\\:underline:is(:where(.peer).foo-1 ~ *):is(:where(.peer).bar-1 ~ *).foo-2.bar-2 {
text-decoration-line: underline;
}
}"
`)
})
})