Handle variants when the same class appears multiple times in a selec…

…tor (#10397)

src/util/formatVariantSelector.js

@@ -218,7 +218,7 @@ export function finalizeSelector(current, formats, { context, candidate, base })
  parent.insertAfter(simpleSelector[simpleSelector.length - 1], simpleEnd)
 
  for (let child of formatNodes) {
- parent.insertBefore(simpleSelector[0], child)
+ parent.insertBefore(simpleSelector[0], child.clone())
  }
 
  node.remove()

tests/basic-usage.test.js

@@ -922,4 +922,31 @@ crosscheck(({ stable, oxide }) => {
  `)
  })
  })
+
+ it('should not crash when matching variants where utility classes are doubled up', () => {
+ let config = {
+ content: [
+ {
+ raw: '<div class="hover:foo"></div>',
+ },
+ ],
+ }
+
+ let input = css`
+ @tailwind utilities;
+ @layer utilities {
+ .foo.foo {
+ text-decoration-line: underline;
+ }
+ }
+ `
+
+ return run(input, config).then((result) => {
+ expect(result.css).toMatchFormattedCss(css`
+ .hover\:foo:hover.hover\:foo:hover {
+ text-decoration-line: underline;
+ }
+ `)
+ })
+ })
 })