Handle variants when the same class appears multiple times in a selector (#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;
+        }
+      `)
+    })
+  })
 })