test(*): global and root are written at the same time.

Author: refirst11

e2e/site/app/page.tsx

@@ -9,6 +9,16 @@ const css = cssx.create({
   },
 });
 
+cssx.global({
+  h1: {
+    color: 'cyan',
+  },
+});
+
+cssx.root({
+  '--color-skyblue': 'skyblue',
+});
+
 export default function Home() {
   return (
     <main>

e2e/site/component/style-create.tsx

@@ -11,12 +11,6 @@ const css = cssx.create({
   },
 });
 
-cssx.global({
-  h1: {
-    color: 'aqua',
-  },
-});
-
 export function E2ETest() {
   return (
     <div className={css.e2e} data-testid="e2e-test-div">

test/compiler-integration.test.ts

@@ -15,4 +15,8 @@ test('CSS compilation logs contain expected output', async () => {
   expect(stdout).toContain('color: pink;');
   expect(stdout).toContain('@media (max-width: 1024px)');
   expect(stdout).toContain('color: aqua;');
+  // It will also be compiled if global and root are written at the same time.
+  expect(stdout).toContain('Generating global static css');
+  expect(stdout).toContain('color: cyan');
+  expect(stdout).toContain('--color-skyblue: skyblue');
 }, 15000);