diff --git a/test/__snapshots__/variants.js.snap b/test/__snapshots__/variants.js.snap
index 0fd52a2..6bc3980 100644
--- a/test/__snapshots__/variants.js.snap
+++ b/test/__snapshots__/variants.js.snap
@@ -39,8 +39,8 @@ exports[`variants > negative 1`] = `
 exports[`variants > pseudo 1`] = `
 "/* layer: default */
 .focus\\\\:border:focus{border-width:1px;}
-.before\\\\:p-32::before{padding:3.2rem;}
 .group:hover .group-hover\\\\:p-16{padding:1.6rem;}
+.before\\\\:p-32::before{padding:3.2rem;}
 .group\\\\/llama:hover .group-hover\\\\/llama\\\\:m-32{margin:3.2rem;}
 .last\\\\:mb-0:last-child{margin-bottom:0rem;}"
 `;
diff --git a/test/background.js b/test/background.js
index 9080d7c..df01e25 100644
--- a/test/background.js
+++ b/test/background.js
@@ -57,19 +57,19 @@ test('bg arbitrary', async ({ uno }) => {
     `bg-[url('/img/hero-pattern.svg')]`,
     `bg-[url("/img/hero-pattern.svg")]`,
     `bg-[var(--w-color)]`,
-    `before:bg-[url(var(--w-form-check-mark))]`,
     `bg-[--w-color]`,
     `peer-checked:before:bg-[url('data:image/svg+xml,%3Csvg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M4 8L7 11L12.5 5" stroke="%2371717A" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E')]`,
-    `bg-[url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")]`];
+    `bg-[url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")]`,
+    `before:bg-[url(var(--w-form-check-mark))]`];
   const { css } = await uno.generate(classes);
   expect(css).toMatchInlineSnapshot(`
     "/* layer: default */
-    .before\\\\:bg-\\\\[url\\\\(var\\\\(--w-form-check-mark\\\\)\\\\)\\\\]::before{background-image:var(--w-form-check-mark);}
     .bg-\\\\[--w-color\\\\],
     .bg-\\\\[var\\\\(--w-color\\\\)\\\\]{background-color:var(--w-color);}
     .bg-\\\\[url\\\\(\\\\'\\\\/img\\\\/hero-pattern\\\\.svg\\\\'\\\\)\\\\]{background-image:url('/img/hero-pattern.svg');}
     .bg-\\\\[url\\\\(\\\\\\"\\\\/img\\\\/hero-pattern\\\\.svg\\\\\\"\\\\)\\\\]{background-image:url(\\"/img/hero-pattern.svg\\");}
     .bg-\\\\[url\\\\(\\\\\\"data\\\\:image\\\\/svg\\\\+xml\\\\,\\\\%3csvg\\\\ xmlns\\\\=\\\\'http\\\\:\\\\/\\\\/www\\\\.w3\\\\.org\\\\/2000\\\\/svg\\\\'\\\\ viewBox\\\\=\\\\'0\\\\ 0\\\\ 16\\\\ 16\\\\'\\\\ fill\\\\=\\\\'white\\\\'\\\\%3e\\\\%3cpath\\\\ d\\\\=\\\\'M12\\\\.207\\\\ 4\\\\.793a1\\\\ 1\\\\ 0\\\\ 010\\\\ 1\\\\.414l-5\\\\ 5a1\\\\ 1\\\\ 0\\\\ 01-1\\\\.414\\\\ 0l-2-2a1\\\\ 1\\\\ 0\\\\ 011\\\\.414-1\\\\.414L6\\\\.5\\\\ 9\\\\.086l4\\\\.293-4\\\\.293a1\\\\ 1\\\\ 0\\\\ 011\\\\.414\\\\ 0z\\\\'\\\\/\\\\%3e\\\\%3c\\\\/svg\\\\%3e\\\\\\"\\\\)\\\\]{background-image:url(\\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e\\");}
-    .peer:checked~.peer-checked\\\\:before\\\\:bg-\\\\[url\\\\(\\\\'data\\\\:image\\\\/svg\\\\+xml\\\\,\\\\%3Csvg\\\\ width\\\\=\\\\\\"16\\\\\\"\\\\ height\\\\=\\\\\\"16\\\\\\"\\\\ viewBox\\\\=\\\\\\"0\\\\ 0\\\\ 16\\\\ 16\\\\\\"\\\\ fill\\\\=\\\\\\"none\\\\\\"\\\\ xmlns\\\\=\\\\\\"http\\\\:\\\\/\\\\/www\\\\.w3\\\\.org\\\\/2000\\\\/svg\\\\\\"\\\\%3E\\\\%3Cpath\\\\ d\\\\=\\\\\\"M4\\\\ 8L7\\\\ 11L12\\\\.5\\\\ 5\\\\\\"\\\\ stroke\\\\=\\\\\\"\\\\%2371717A\\\\\\"\\\\ stroke-width\\\\=\\\\\\"1\\\\.5\\\\\\"\\\\ stroke-linecap\\\\=\\\\\\"round\\\\\\"\\\\ stroke-linejoin\\\\=\\\\\\"round\\\\\\"\\\\/\\\\%3E\\\\%3C\\\\/svg\\\\%3E\\\\'\\\\)\\\\]::before{background-image:url('data:image/svg+xml,%3Csvg width=\\"16\\" height=\\"16\\" viewBox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\"%3E%3Cpath d=\\"M4 8L7 11L12.5 5\\" stroke=\\"%2371717A\\" stroke-width=\\"1.5\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\"/%3E%3C/svg%3E');}"
+    .peer:checked~.peer-checked\\\\:before\\\\:bg-\\\\[url\\\\(\\\\'data\\\\:image\\\\/svg\\\\+xml\\\\,\\\\%3Csvg\\\\ width\\\\=\\\\\\"16\\\\\\"\\\\ height\\\\=\\\\\\"16\\\\\\"\\\\ viewBox\\\\=\\\\\\"0\\\\ 0\\\\ 16\\\\ 16\\\\\\"\\\\ fill\\\\=\\\\\\"none\\\\\\"\\\\ xmlns\\\\=\\\\\\"http\\\\:\\\\/\\\\/www\\\\.w3\\\\.org\\\\/2000\\\\/svg\\\\\\"\\\\%3E\\\\%3Cpath\\\\ d\\\\=\\\\\\"M4\\\\ 8L7\\\\ 11L12\\\\.5\\\\ 5\\\\\\"\\\\ stroke\\\\=\\\\\\"\\\\%2371717A\\\\\\"\\\\ stroke-width\\\\=\\\\\\"1\\\\.5\\\\\\"\\\\ stroke-linecap\\\\=\\\\\\"round\\\\\\"\\\\ stroke-linejoin\\\\=\\\\\\"round\\\\\\"\\\\/\\\\%3E\\\\%3C\\\\/svg\\\\%3E\\\\'\\\\)\\\\]::before{background-image:url('data:image/svg+xml,%3Csvg width=\\"16\\" height=\\"16\\" viewBox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\"%3E%3Cpath d=\\"M4 8L7 11L12.5 5\\" stroke=\\"%2371717A\\" stroke-width=\\"1.5\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\"/%3E%3C/svg%3E');}
+    .before\\\\:bg-\\\\[url\\\\(var\\\\(--w-form-check-mark\\\\)\\\\)\\\\]::before{background-image:var(--w-form-check-mark);}"
   `);
 });
diff --git a/test/general.js b/test/general.js
index 501dad8..f57b37c 100644
--- a/test/general.js
+++ b/test/general.js
@@ -31,7 +31,7 @@ test(`autocomplete doesn't throw`, async ({ uno }) => {
 });
 
 test(`the HTML parser is sane`, async ({ uno }) => {
-  const { css } = await uno.generate(`<div class="before:content-['before-stuff'] sm:grid"></div>`);
+  const { css } = await uno.generate([`before:content-['before-stuff']`, 'sm:grid']);
   expect(css).toMatchInlineSnapshot(`
     "/* layer: default */
     .before\\\\:content-\\\\[\\\\'before-stuff\\\\'\\\\]::before{content:'before-stuff';}