rwsdk 0.1.27 → 0.2.0-alpha.0

package/dist/lib/smokeTests/browser.d.mts

@@ -1,5 +1,7 @@
 import { SmokeTestOptions, SmokeTestResult } from "./types.mjs";
 import type { Page, Browser } from "puppeteer-core";
+export declare function checkUrlStyles(page: Page, expectedColor: "red" | "green"): Promise<void>;
+export declare function checkClientModuleStyles(page: Page, expectedColor: "blue" | "green"): Promise<void>;
 /**
  * Launch a browser instance
  */
@@ -11,14 +13,14 @@ export declare function getBrowserPath(testOptions?: SmokeTestOptions): Promise<
 /**
  * Check a URL by performing smoke tests and realtime upgrade
  */
-export declare function checkUrl(url: string, artifactDir: string, browserPath?: string, headless?: boolean, bail?: boolean, skipClient?: boolean, environment?: string, realtime?: boolean, targetDir?: string, skipHmr?: boolean): Promise<void>;
+export declare function checkUrl(url: string, artifactDir: string, browserPath?: string, headless?: boolean, bail?: boolean, skipClient?: boolean, environment?: string, realtime?: boolean, targetDir?: string, skipHmr?: boolean, skipStyleTests?: boolean): Promise<void>;
 /**
  * Check smoke test status for a specific URL
  */
 export declare function checkUrlSmoke(page: Page, url: string, isRealtime: boolean, bail: boolean | undefined, skipClient: boolean | undefined, environment: string | undefined, timestampState: {
     initialServerValue: number;
     clientUpdatedValue: number | null;
-}, targetDir?: string, skipHmr?: boolean): Promise<void>;
+}, targetDir?: string, skipHmr?: boolean, skipStyleTests?: boolean): Promise<void>;
 /**
  * Check server-side smoke test status
  */

package/dist/lib/smokeTests/browser.mjs

@@ -11,6 +11,77 @@ import { $ } from "../$.mjs";
 import { fail } from "./utils.mjs";
 import { reportSmokeTestResult } from "./reporting.mjs";
 import { updateTestStatus } from "./state.mjs";
+import * as fs from "fs/promises";
+import { template as urlStylesTemplate } from "./templates/smokeTestUrlStyles.css.template";
+import { template as clientStylesTemplate } from "./templates/smokeTestClientStyles.module.css.template";
+export async function checkUrlStyles(page, expectedColor) {
+    const selector = '[data-testid="smoke-test-url-styles"]';
+    log(`Checking for element with selector: ${selector}`);
+    const element = await page.waitForSelector(selector);
+    if (!element) {
+        throw new Error(`URL styles element not found with selector: ${selector}`);
+    }
+    const expectedRgb = expectedColor === "red" ? "rgb(255, 0, 0)" : "rgb(0, 128, 0)";
+    log(`Waiting for URL styles to apply with expected color: ${expectedRgb}`);
+    try {
+        // Wait for the background color to match the expected value with a timeout
+        await page.waitForFunction((expectedRgb) => {
+            const element = document.querySelector('[data-testid="smoke-test-url-styles"]');
+            if (!element)
+                return false;
+            const backgroundColor = window.getComputedStyle(element).backgroundColor;
+            return backgroundColor === expectedRgb;
+        }, { timeout: 10000 }, // 10 second timeout
+        expectedRgb);
+        // Get the final background color for logging
+        const backgroundColor = await page.evaluate(() => window.getComputedStyle(document.querySelector('[data-testid="smoke-test-url-styles"]')).backgroundColor);
+        log(`URL-based stylesheet check passed: background color is ${backgroundColor}`);
+    }
+    catch (error) {
+        // Get the actual background color for better error reporting
+        const actualBackgroundColor = await page.evaluate(() => {
+            const element = document.querySelector('[data-testid="smoke-test-url-styles"]');
+            return element
+                ? window.getComputedStyle(element).backgroundColor
+                : "element not found";
+        });
+        throw new Error(`URL-based stylesheet check failed: expected background color ${expectedRgb}, but got ${actualBackgroundColor} (timeout after 10 seconds)`);
+    }
+}
+export async function checkClientModuleStyles(page, expectedColor) {
+    const selector = '[data-testid="smoke-test-client-styles"]';
+    log(`Checking for element with selector: ${selector}`);
+    const element = await page.waitForSelector(selector);
+    if (!element) {
+        throw new Error(`Client module styles element not found with selector: ${selector}`);
+    }
+    const expectedRgb = expectedColor === "blue" ? "rgb(0, 0, 255)" : "rgb(0, 128, 0)";
+    log(`Waiting for client module styles to apply with expected color: ${expectedRgb}`);
+    try {
+        // Wait for the background color to match the expected value with a timeout
+        await page.waitForFunction((expectedRgb) => {
+            const element = document.querySelector('[data-testid="smoke-test-client-styles"]');
+            if (!element)
+                return false;
+            const backgroundColor = window.getComputedStyle(element).backgroundColor;
+            return backgroundColor === expectedRgb;
+        }, { timeout: 10000 }, // 10 second timeout
+        expectedRgb);
+        // Get the final background color for logging
+        const backgroundColor = await page.evaluate(() => window.getComputedStyle(document.querySelector('[data-testid="smoke-test-client-styles"]')).backgroundColor);
+        log(`Client module stylesheet check passed: background color is ${backgroundColor}`);
+    }
+    catch (error) {
+        // Get the actual background color for better error reporting
+        const actualBackgroundColor = await page.evaluate(() => {
+            const element = document.querySelector('[data-testid="smoke-test-client-styles"]');
+            return element
+                ? window.getComputedStyle(element).backgroundColor
+                : "element not found";
+        });
+        throw new Error(`Client module stylesheet check failed: expected background color ${expectedRgb}, but got ${actualBackgroundColor} (timeout after 10 seconds)`);
+    }
+}
 /**
  * Launch a browser instance
  */
@@ -113,7 +184,7 @@ export async function getBrowserPath(testOptions) {
 /**
  * Check a URL by performing smoke tests and realtime upgrade
  */
-export async function checkUrl(url, artifactDir, browserPath, headless = true, bail = false, skipClient = false, environment = "Development", realtime = false, targetDir, skipHmr = false) {
+export async function checkUrl(url, artifactDir, browserPath, headless = true, bail = false, skipClient = false, environment = "Development", realtime = false, targetDir, skipHmr = false, skipStyleTests = false) {
     console.log(`🔍 Testing URL: ${url}`);
     log("Launching browser");
     let browser;
@@ -146,7 +217,7 @@ export async function checkUrl(url, artifactDir, browserPath, headless = true, b
             // Skip upgradeToRealtime and just run the realtime tests directly
             try {
                 log("Performing realtime-only smoke test");
-                await checkUrlSmoke(page, url, true, bail, skipClient, environment, timestampState, targetDir, skipHmr);
+                await realtimeOnlyFlow(page, url, artifactDir, bail, skipClient, environment, targetDir, skipHmr, skipStyleTests);
                 // Take a screenshot of the realtime test
                 await takeScreenshot(page, url, artifactDir, `${environment.toLowerCase()}-realtime-passed`);
             }
@@ -170,7 +241,7 @@ export async function checkUrl(url, artifactDir, browserPath, headless = true, b
             log("Performing initial smoke test");
             let initialTestStatus = "passed";
             try {
-                await checkUrlSmoke(page, url, false, bail, skipClient, environment, timestampState, targetDir, skipHmr);
+                await checkUrlSmoke(page, url, false, bail, skipClient, environment, timestampState, targetDir, skipHmr, skipStyleTests);
             }
             catch (error) {
                 hasFailures = true;
@@ -193,7 +264,7 @@ export async function checkUrl(url, artifactDir, browserPath, headless = true, b
             try {
                 await upgradeToRealtime(page, environment, bail);
                 log("Performing post-upgrade smoke test");
-                await checkUrlSmoke(page, url, true, bail, skipClient, environment, timestampState, targetDir, skipHmr);
+                await checkUrlSmoke(page, url, true, bail, skipClient, environment, timestampState, targetDir, skipHmr, skipStyleTests);
             }
             catch (error) {
                 hasFailures = true;
@@ -242,7 +313,7 @@ export async function checkUrl(url, artifactDir, browserPath, headless = true, b
 /**
  * Check smoke test status for a specific URL
  */
-export async function checkUrlSmoke(page, url, isRealtime, bail = false, skipClient = false, environment = "Development", timestampState, targetDir, skipHmr = false) {
+export async function checkUrlSmoke(page, url, isRealtime, bail = false, skipClient = false, environment = "Development", timestampState, targetDir, skipHmr = false, skipStyleTests = false) {
     const phase = isRealtime ? "Post-upgrade" : "Initial";
     console.log(`🔍 Testing ${phase} smoke tests at ${url}`);
     // Parse the base URL and path to properly handle smoke test queries
@@ -271,6 +342,7 @@ export async function checkUrlSmoke(page, url, isRealtime, bail = false, skipCli
     let clientTestError = null;
     let serverRenderCheckError = null;
     let hmrTestError = null;
+    let stylesheetTestError = null;
     // Step 1: Run initial server-side smoke test to check the server state
     log("Running initial server-side smoke test");
     let initialServerResult;
@@ -324,6 +396,52 @@ export async function checkUrlSmoke(page, url, isRealtime, bail = false, skipCli
         }
         return;
     }
+    // Step 1.5: Run stylesheet checks
+    if (!skipStyleTests) {
+        const env = environment === "Development" ? "dev" : "production";
+        const urlStylesKey = isRealtime ? "realtimeUrlStyles" : "initialUrlStyles";
+        const clientModuleStylesKey = isRealtime
+            ? "realtimeClientModuleStyles"
+            : "initialClientModuleStyles";
+        try {
+            await checkUrlStyles(page, "red");
+            updateTestStatus(env, urlStylesKey, "PASSED");
+            log(`${phase} URL styles check passed`);
+        }
+        catch (error) {
+            hasFailures = true;
+            updateTestStatus(env, urlStylesKey, "FAILED");
+            stylesheetTestError =
+                error instanceof Error ? error : new Error(String(error));
+            log("Error during URL styles check: %O", error);
+            console.error(`❌ URL styles check failed: ${error instanceof Error ? error.message : String(error)}`);
+            if (bail) {
+                throw error;
+            }
+        }
+        try {
+            await checkClientModuleStyles(page, "blue");
+            updateTestStatus(env, clientModuleStylesKey, "PASSED");
+            log(`${phase} client module styles check passed`);
+        }
+        catch (error) {
+            hasFailures = true;
+            updateTestStatus(env, clientModuleStylesKey, "FAILED");
+            if (!stylesheetTestError) {
+                stylesheetTestError =
+                    error instanceof Error ? error : new Error(String(error));
+            }
+            log("Error during client module styles check: %O", error);
+            console.error(`❌ Client module styles check failed: ${error instanceof Error ? error.message : String(error)}`);
+            if (bail) {
+                throw error;
+            }
+        }
+    }
+    else {
+        log("Skipping stylesheet checks as requested");
+        console.log("⏩ Skipping stylesheet checks as requested");
+    }
     // Step 2: Run client-side smoke test to update the server timestamp
     log("Running client-side smoke test");
     let clientResult;
@@ -387,6 +505,14 @@ export async function checkUrlSmoke(page, url, isRealtime, bail = false, skipCli
             // Test client component HMR if client tests aren't skipped
             if (!skipClient) {
                 await testClientComponentHmr(page, targetDir, phase, environment, bail);
+                // Test style HMR if style tests aren't skipped
+                if (!skipStyleTests) {
+                    await testStyleHMR(page, targetDir);
+                }
+                else {
+                    log("Skipping style HMR test as requested");
+                    console.log("⏩ Skipping style HMR test as requested");
+                }
             }
         }
         catch (error) {
@@ -432,6 +558,9 @@ export async function checkUrlSmoke(page, url, isRealtime, bail = false, skipCli
         if (hmrTestError) {
             errors.push(`HMR test: ${hmrTestError.message}`);
         }
+        if (stylesheetTestError) {
+            errors.push(`Stylesheet test: ${stylesheetTestError.message}`);
+        }
         throw new Error(`Multiple test failures: ${errors.join(", ")}`);
     }
     log("URL smoke test completed successfully");
@@ -761,7 +890,7 @@ export async function checkServerUp(baseUrl, customPath = "/", retries = RETRIES
 /**
  * Perform only the realtime upgrade and tests without doing initial checks
  */
-async function realtimeOnlyFlow(page, url, artifactDir, bail, skipClient, environment, targetDir, skipHmr = false) {
+async function realtimeOnlyFlow(page, url, artifactDir, bail, skipClient, environment, targetDir, skipHmr = false, skipStyleTests = false) {
     let hasFailures = false;
     let realtimeError = null;
     // Create timestamp state for the realtime-only flow
@@ -771,7 +900,7 @@ async function realtimeOnlyFlow(page, url, artifactDir, bail, skipClient, enviro
     };
     try {
         log("Performing realtime-only smoke test");
-        await checkUrlSmoke(page, url, true, bail, skipClient, environment, timestampState, targetDir, skipHmr);
+        await checkUrlSmoke(page, url, true, bail, skipClient, environment, timestampState, targetDir, skipHmr, skipStyleTests);
         // Take a screenshot of the realtime test
         await takeScreenshot(page, url, artifactDir, `${environment.toLowerCase()}-realtime-passed`);
     }
@@ -1039,3 +1168,26 @@ export async function testClientComponentHmr(page, targetDir, phase = "", enviro
         return false;
     }
 }
+async function testStyleHMR(page, targetDir) {
+    log("Running style HMR tests");
+    console.log("🎨 Testing style HMR...");
+    // --- HMR Test for URL-based Stylesheet ---
+    const urlStylePath = join(targetDir, "src", "app", "smokeTestUrlStyles.css");
+    const updatedUrlStyle = urlStylesTemplate.replace("rgb(255, 0, 0)", "rgb(0, 128, 0)");
+    await fs.writeFile(urlStylePath, updatedUrlStyle);
+    // --- HMR Test for Client Module Stylesheet ---
+    const clientStylePath = join(targetDir, "src", "app", "components", "smokeTestClientStyles.module.css");
+    const updatedClientStyle = clientStylesTemplate.replace("rgb(0, 0, 255)", "rgb(0, 128, 0)");
+    await fs.writeFile(clientStylePath, updatedClientStyle);
+    // Allow time for HMR to kick in
+    await new Promise((resolve) => setTimeout(resolve, 5000));
+    // Check URL-based stylesheet HMR
+    await checkUrlStyles(page, "green");
+    // Check client-module stylesheet HMR
+    await checkClientModuleStyles(page, "green");
+    // Restore original styles
+    await fs.writeFile(urlStylePath, urlStylesTemplate);
+    await fs.writeFile(clientStylePath, clientStylesTemplate);
+    log("Style HMR tests completed successfully");
+    console.log("✅ Style HMR tests passed");
+}

package/dist/lib/smokeTests/codeUpdates.d.mts

@@ -2,6 +2,7 @@
  * Creates the smoke test components in the target project directory
  */
 export declare function createSmokeTestComponents(targetDir: string, skipClient?: boolean): Promise<void>;
+export declare function createSmokeTestStylesheets(targetDir: string): Promise<void>;
 /**
  * Modifies the worker.tsx and wrangler.jsonc files to add realtime support
  */

package/dist/lib/smokeTests/codeUpdates.mjs

@@ -4,6 +4,8 @@ import { log } from "./constants.mjs";
 import { getSmokeTestFunctionsTemplate } from "./templates/smokeTestFunctions.template";
 import { getSmokeTestTemplate } from "./templates/SmokeTest.template";
 import { getSmokeTestClientTemplate } from "./templates/SmokeTestClient.template";
+import { template as smokeTestUrlStylesCssTemplate } from "./templates/smokeTestUrlStyles.css.template";
+import { template as smokeTestClientStylesCssTemplate } from "./templates/smokeTestClientStyles.module.css.template";
 import MagicString from "magic-string";
 import { parse as parseJsonc } from "jsonc-parser";
 /**
@@ -28,6 +30,8 @@ export async function createSmokeTestComponents(targetDir, skipClient = false) {
     await fs.writeFile(smokeTestFunctionsPath, smokeTestFunctionsContent);
     log("Writing SmokeTest component file");
     await fs.writeFile(smokeTestPath, smokeTestContent);
+    // Create smoke test stylesheet files
+    await createSmokeTestStylesheets(targetDir);
     // Only create client component if not skipping client-side tests
     if (!skipClient) {
         // Create SmokeTestClient.tsx
@@ -49,10 +53,53 @@ export async function createSmokeTestComponents(targetDir, skipClient = false) {
     console.log(`- ${smokeTestPath}`);
     if (!skipClient) {
         console.log(`- ${join(componentsDir, "__SmokeTestClient.tsx")}`);
+        console.log(`- ${join(componentsDir, "smokeTestClientStyles.module.css")}`);
     }
     else {
         console.log("- Client component skipped (--skip-client was specified)");
     }
+    console.log(`- ${join(targetDir, "src", "app", "smokeTestUrlStyles.css")}`);
+}
+export async function createSmokeTestStylesheets(targetDir) {
+    log("Creating smoke test stylesheets in project...");
+    // Create directories if they don't exist
+    const componentsDir = join(targetDir, "src", "app", "components");
+    const appDir = join(targetDir, "src", "app");
+    await fs.mkdir(componentsDir, { recursive: true });
+    await fs.mkdir(appDir, { recursive: true });
+    // Create smoke_tests_client_styles.module.css
+    const clientStylesPath = join(componentsDir, "smokeTestClientStyles.module.css");
+    log("Creating smokeTestClientStyles.module.css at: %s", clientStylesPath);
+    await fs.writeFile(clientStylesPath, smokeTestClientStylesCssTemplate);
+    // Create smoke_tests_url_styles.css
+    const urlStylesPath = join(appDir, "smokeTestUrlStyles.css");
+    log("Creating smokeTestUrlStyles.css at: %s", urlStylesPath);
+    await fs.writeFile(urlStylesPath, smokeTestUrlStylesCssTemplate);
+    // Modify Document.tsx to include the URL stylesheet using CSS URL import
+    const documentPath = join(appDir, "Document.tsx");
+    log("Modifying Document.tsx to include URL stylesheet at: %s", documentPath);
+    try {
+        const documentContent = await fs.readFile(documentPath, "utf-8");
+        const s = new MagicString(documentContent);
+        // Add the CSS URL import at the top of the file
+        const importMatch = documentContent.match(/^(import\s+.*?;\s*\n)*/m);
+        const insertPosition = importMatch ? importMatch[0].length : 0;
+        s.appendLeft(insertPosition, 'import smokeTestUrlStyles from "./smokeTestUrlStyles.css?url";\n');
+        // Add the link tag in the head using the imported variable
+        const headTagEnd = documentContent.indexOf("</head>");
+        if (headTagEnd !== -1) {
+            s.appendLeft(headTagEnd, '      <link rel="stylesheet" href={smokeTestUrlStyles} />\n');
+            await fs.writeFile(documentPath, s.toString(), "utf-8");
+            log("Successfully modified Document.tsx with CSS URL import pattern");
+        }
+        else {
+            log("Could not find </head> tag in Document.tsx");
+        }
+    }
+    catch (e) {
+        log("Could not modify Document.tsx: %s", e);
+    }
+    log("Smoke test stylesheets created successfully");
 }
 /**
  * Modifies the worker.tsx and wrangler.jsonc files to add realtime support

package/dist/lib/smokeTests/development.d.mts

@@ -8,4 +8,4 @@ export declare function runDevServer(cwd?: string): Promise<{
 /**
  * Runs tests against the development server
  */
-export declare function runDevTest(url: string, artifactDir: string, customPath?: string, browserPath?: string, headless?: boolean, bail?: boolean, skipClient?: boolean, realtime?: boolean, skipHmr?: boolean): Promise<void>;
+export declare function runDevTest(url: string, artifactDir: string, customPath?: string, browserPath?: string, headless?: boolean, bail?: boolean, skipClient?: boolean, realtime?: boolean, skipHmr?: boolean, skipStyleTests?: boolean): Promise<void>;

package/dist/lib/smokeTests/development.mjs

@@ -1,7 +1,7 @@
 import { setTimeout } from "node:timers/promises";
 import { log, RETRIES } from "./constants.mjs";
 import { $ } from "../$.mjs";
-import { checkUrl, checkServerUp } from "./browser.mjs";
+import { checkUrl, checkServerUp, launchBrowser } from "./browser.mjs";
 import { fail } from "./utils.mjs";
 import { state } from "./state.mjs";
 /**
@@ -172,9 +172,11 @@ export async function runDevServer(cwd) {
 /**
  * Runs tests against the development server
  */
-export async function runDevTest(url, artifactDir, customPath = "/", browserPath, headless = true, bail = false, skipClient = false, realtime = false, skipHmr = false) {
+export async function runDevTest(url, artifactDir, customPath = "/", browserPath, headless = true, bail = false, skipClient = false, realtime = false, skipHmr = false, skipStyleTests = false) {
     log("Starting dev server test with path: %s", customPath || "/");
     console.log("🚀 Testing local development server");
+    const browser = await launchBrowser(browserPath, headless);
+    const page = await browser.newPage();
     try {
         // DRY: check both root and custom path
         await checkServerUp(url, customPath, RETRIES, bail);
@@ -187,10 +189,12 @@ export async function runDevTest(url, artifactDir, customPath = "/", browserPath
                     : "/" + customPath);
         // Pass the target directory to checkUrl for HMR testing
         const targetDir = state.resources.targetDir;
+        await page.goto(testUrl, { waitUntil: "networkidle0" });
         await checkUrl(testUrl, artifactDir, browserPath, headless, bail, skipClient, "Development", // Add environment context parameter
         realtime, // Add realtime parameter
         targetDir, // Add target directory for HMR testing
-        skipHmr);
+        skipHmr, // Add skip HMR option
+        skipStyleTests);
         log("Development server test completed successfully");
     }
     catch (error) {
@@ -206,4 +210,7 @@ export async function runDevTest(url, artifactDir, customPath = "/", browserPath
         // Make sure we throw the error so it's properly handled upstream
         throw error;
     }
+    finally {
+        await browser.close();
+    }
 }

package/dist/lib/smokeTests/environment.mjs

@@ -145,19 +145,6 @@ async function installDependencies(targetDir) {
     catch (error) {
         log("ERROR: Failed to install dependencies: %O", error);
         console.error(`❌ Failed to install dependencies: ${error instanceof Error ? error.message : String(error)}`);
-        // Try npm as fallback if pnpm fails
-        try {
-            console.log("⚠️ pnpm install failed, trying npm install as fallback...");
-            await $({
-                cwd: targetDir,
-                stdio: "pipe",
-            }) `npm install`;
-            console.log("✅ Dependencies installed successfully with npm");
-        }
-        catch (npmError) {
-            log("ERROR: Both pnpm and npm install failed: %O", npmError);
-            console.error(`❌ Failed to install dependencies with npm: ${npmError instanceof Error ? npmError.message : String(npmError)}`);
-            throw new Error(`Failed to install project dependencies. Please ensure the project can be installed with pnpm or npm.`);
-        }
+        throw new Error(`Failed to install project dependencies. Please ensure the project can be installed with pnpm.`);
     }
 }

package/dist/lib/smokeTests/release.d.mts

@@ -40,7 +40,7 @@ export declare function runRelease(cwd: string, projectDir: string, resourceUniq
 /**
  * Runs tests against the production deployment
  */
-export declare function runReleaseTest(customPath: string | undefined, artifactDir: string, resources: TestResources, browserPath?: string, headless?: boolean, bail?: boolean, skipClient?: boolean, projectDir?: string, realtime?: boolean, skipHmr?: boolean): Promise<void>;
+export declare function runReleaseTest(customPath: string | undefined, artifactDir: string, resources: TestResources, browserPath?: string, headless?: boolean, bail?: boolean, skipClient?: boolean, projectDir?: string, realtime?: boolean, skipHmr?: boolean, skipStyleTests?: boolean): Promise<void>;
 /**
  * Check if a resource name includes a specific resource unique key
  * This is used to identify resources created during our tests

package/dist/lib/smokeTests/release.mjs

@@ -379,7 +379,7 @@ export async function runRelease(cwd, projectDir, resourceUniqueKey) {
 /**
  * Runs tests against the production deployment
  */
-export async function runReleaseTest(customPath = "/", artifactDir, resources, browserPath, headless = true, bail = false, skipClient = false, projectDir, realtime = false, skipHmr = false) {
+export async function runReleaseTest(customPath = "/", artifactDir, resources, browserPath, headless = true, bail = false, skipClient = false, projectDir, realtime = false, skipHmr = false, skipStyleTests = false) {
     log("Starting release test with path: %s", customPath || "/");
     console.log("\n🚀 Testing production deployment");
     try {
@@ -398,7 +398,8 @@ export async function runReleaseTest(customPath = "/", artifactDir, resources, b
                     ? customPath
                     : "/" + customPath);
         await checkUrl(testUrl, artifactDir, browserPath, headless, bail, skipClient, "Production", realtime, resources.targetDir, // Add target directory parameter
-        true);
+        true, // Always skip HMR in production
+        skipStyleTests);
         log("Release test completed successfully");
         // Store the worker name if we didn't set it earlier
         if (resources && !resources.workerName) {

package/dist/lib/smokeTests/reporting.mjs

@@ -109,6 +109,8 @@ export async function generateFinalReport() {
             console.log(`  │  ├─ Server-side: ${formatTestStatus(state.testStatus.dev.initialServerSide)}`);
             console.log(`  │  ├─ Client-side: ${formatTestStatus(state.testStatus.dev.initialClientSide)}`);
             console.log(`  │  ├─ Server Render Check: ${formatTestStatus(state.testStatus.dev.initialServerRenderCheck)}`);
+            console.log(`  │  ├─ URL Styles: ${formatTestStatus(state.testStatus.dev.initialUrlStyles)}`);
+            console.log(`  │  ├─ Client Module Styles: ${formatTestStatus(state.testStatus.dev.initialClientModuleStyles)}`);
             console.log(`  │  ├─ Server HMR: ${formatTestStatus(state.testStatus.dev.initialServerHmr)}`);
             console.log(`  │  └─ Client HMR: ${formatTestStatus(state.testStatus.dev.initialClientHmr)}`);
             console.log(`  └─ Realtime Tests:`);
@@ -116,6 +118,8 @@ export async function generateFinalReport() {
             console.log(`     ├─ Server-side: ${formatTestStatus(state.testStatus.dev.realtimeServerSide)}`);
             console.log(`     ├─ Client-side: ${formatTestStatus(state.testStatus.dev.realtimeClientSide)}`);
             console.log(`     ├─ Server Render Check: ${formatTestStatus(state.testStatus.dev.realtimeServerRenderCheck)}`);
+            console.log(`     ├─ URL Styles: ${formatTestStatus(state.testStatus.dev.realtimeUrlStyles)}`);
+            console.log(`     ├─ Client Module Styles: ${formatTestStatus(state.testStatus.dev.realtimeClientModuleStyles)}`);
             console.log(`     ├─ Server HMR: ${formatTestStatus(state.testStatus.dev.realtimeServerHmr)}`);
             console.log(`     └─ Client HMR: ${formatTestStatus(state.testStatus.dev.realtimeClientHmr)}`);
         }
@@ -130,12 +134,16 @@ export async function generateFinalReport() {
                 console.log(`  ├─ Initial Tests:`);
                 console.log(`  │  ├─ Server-side: ${formatTestStatus(state.testStatus.production.initialServerSide)}`);
                 console.log(`  │  ├─ Client-side: ${formatTestStatus(state.testStatus.production.initialClientSide)}`);
-                console.log(`  │  └─ Server Render Check: ${formatTestStatus(state.testStatus.production.initialServerRenderCheck)}`);
+                console.log(`  │  ├─ Server Render Check: ${formatTestStatus(state.testStatus.production.initialServerRenderCheck)}`);
+                console.log(`  │  ├─ URL Styles: ${formatTestStatus(state.testStatus.production.initialUrlStyles)}`);
+                console.log(`  │  └─ Client Module Styles: ${formatTestStatus(state.testStatus.production.initialClientModuleStyles)}`);
                 console.log(`  └─ Realtime Tests:`);
                 console.log(`     ├─ Upgrade: ${formatTestStatus(state.testStatus.production.realtimeUpgrade)}`);
                 console.log(`     ├─ Server-side: ${formatTestStatus(state.testStatus.production.realtimeServerSide)}`);
                 console.log(`     ├─ Client-side: ${formatTestStatus(state.testStatus.production.realtimeClientSide)}`);
-                console.log(`     └─ Server Render Check: ${formatTestStatus(state.testStatus.production.realtimeServerRenderCheck)}`);
+                console.log(`     ├─ Server Render Check: ${formatTestStatus(state.testStatus.production.realtimeServerRenderCheck)}`);
+                console.log(`     ├─ URL Styles: ${formatTestStatus(state.testStatus.production.realtimeUrlStyles)}`);
+                console.log(`     └─ Client Module Styles: ${formatTestStatus(state.testStatus.production.realtimeClientModuleStyles)}`);
             }
             else {
                 console.log(`  └─ Tests: ⏩ SKIPPED (release command failed)`);
@@ -258,6 +266,10 @@ export function initializeTestStatus() {
     state.testStatus.dev.initialClientHmr = "DID_NOT_RUN";
     state.testStatus.dev.realtimeServerHmr = "DID_NOT_RUN";
     state.testStatus.dev.realtimeClientHmr = "DID_NOT_RUN";
+    state.testStatus.dev.initialUrlStyles = "DID_NOT_RUN";
+    state.testStatus.dev.initialClientModuleStyles = "DID_NOT_RUN";
+    state.testStatus.dev.realtimeUrlStyles = "DID_NOT_RUN";
+    state.testStatus.dev.realtimeClientModuleStyles = "DID_NOT_RUN";
     // Production tests
     state.testStatus.production.overall = "DID_NOT_RUN";
     state.testStatus.production.releaseCommand = "DID_NOT_RUN";
@@ -272,6 +284,10 @@ export function initializeTestStatus() {
     state.testStatus.production.initialClientHmr = "DID_NOT_RUN";
     state.testStatus.production.realtimeServerHmr = "DID_NOT_RUN";
     state.testStatus.production.realtimeClientHmr = "DID_NOT_RUN";
+    state.testStatus.production.initialUrlStyles = "DID_NOT_RUN";
+    state.testStatus.production.initialClientModuleStyles = "DID_NOT_RUN";
+    state.testStatus.production.realtimeUrlStyles = "DID_NOT_RUN";
+    state.testStatus.production.realtimeClientModuleStyles = "DID_NOT_RUN";
     // Now override with specific statuses based on options
     // Mark skipped tests based on options
     if (state.options.skipDev) {
@@ -287,6 +303,10 @@ export function initializeTestStatus() {
         state.testStatus.dev.initialClientHmr = "SKIPPED";
         state.testStatus.dev.realtimeServerHmr = "SKIPPED";
         state.testStatus.dev.realtimeClientHmr = "SKIPPED";
+        state.testStatus.dev.initialUrlStyles = "SKIPPED";
+        state.testStatus.dev.initialClientModuleStyles = "SKIPPED";
+        state.testStatus.dev.realtimeUrlStyles = "SKIPPED";
+        state.testStatus.dev.realtimeClientModuleStyles = "SKIPPED";
     }
     if (state.options.skipRelease) {
         state.testStatus.production.overall = "SKIPPED";
@@ -302,6 +322,10 @@ export function initializeTestStatus() {
         state.testStatus.production.initialClientHmr = "SKIPPED";
         state.testStatus.production.realtimeServerHmr = "SKIPPED";
         state.testStatus.production.realtimeClientHmr = "SKIPPED";
+        state.testStatus.production.initialUrlStyles = "SKIPPED";
+        state.testStatus.production.initialClientModuleStyles = "SKIPPED";
+        state.testStatus.production.realtimeUrlStyles = "SKIPPED";
+        state.testStatus.production.realtimeClientModuleStyles = "SKIPPED";
     }
     if (state.options.skipClient) {
         state.testStatus.dev.initialClientSide = "SKIPPED";
@@ -337,6 +361,8 @@ export function initializeTestStatus() {
             state.testStatus.dev.initialServerRenderCheck = "SKIPPED";
             state.testStatus.dev.initialServerHmr = "SKIPPED";
             state.testStatus.dev.initialClientHmr = "SKIPPED";
+            state.testStatus.dev.initialUrlStyles = "SKIPPED";
+            state.testStatus.dev.initialClientModuleStyles = "SKIPPED";
             // Set the upgrade test to PASSED as it's implicitly run for realtime mode
             state.testStatus.dev.realtimeUpgrade = "PASSED";
         }
@@ -346,6 +372,8 @@ export function initializeTestStatus() {
             state.testStatus.production.initialServerRenderCheck = "SKIPPED";
             state.testStatus.production.initialServerHmr = "SKIPPED";
             state.testStatus.production.initialClientHmr = "SKIPPED";
+            state.testStatus.production.initialUrlStyles = "SKIPPED";
+            state.testStatus.production.initialClientModuleStyles = "SKIPPED";
             // Set release command to PASSED since it must have succeeded for realtime tests to run
             state.testStatus.production.releaseCommand = "PASSED";
             // Set the upgrade test to PASSED as it's implicitly run for realtime mode

package/dist/lib/smokeTests/runSmokeTests.mjs

@@ -57,7 +57,7 @@ export async function runSmokeTests(options = {}) {
                 resources.stopDev = stopDev;
                 state.resources.stopDev = stopDev;
                 log("Running development server tests");
-                await runDevTest(url, options.artifactDir, options.customPath, browserPath, options.headless !== false, options.bail, options.skipClient, options.realtime, options.skipHmr);
+                await runDevTest(url, options.artifactDir, options.customPath, browserPath, options.headless !== false, options.bail, options.skipClient, options.realtime, options.skipHmr, options.skipStyleTests);
                 // Mark that dev tests have run successfully
                 state.devTestsRan = true;
                 // Update the overall dev test status to PASSED
@@ -95,7 +95,7 @@ export async function runSmokeTests(options = {}) {
                 // Update status when release command runs
                 try {
                     console.log("\n🚀 Running release command smoke test");
-                    await runReleaseTest(options.customPath, options.artifactDir, resources, browserPath, options.headless !== false, options.bail, options.skipClient, options.projectDir, options.realtime, options.skipHmr);
+                    await runReleaseTest(options.customPath, options.artifactDir, resources, browserPath, options.headless !== false, options.bail, options.skipClient, options.projectDir, options.realtime, options.skipHmr, options.skipStyleTests);
                     // Update release command status to PASSED
                     updateTestStatus("production", "releaseCommand", "PASSED");
                     // Mark that release tests have run successfully

package/dist/lib/smokeTests/state.d.mts

@@ -14,6 +14,10 @@ export interface TestStatus {
         initialClientHmr: TestStatusValue;
         realtimeServerHmr: TestStatusValue;
         realtimeClientHmr: TestStatusValue;
+        initialUrlStyles: TestStatusValue;
+        initialClientModuleStyles: TestStatusValue;
+        realtimeUrlStyles: TestStatusValue;
+        realtimeClientModuleStyles: TestStatusValue;
     };
     production: {
         overall: TestStatusValue;
@@ -29,6 +33,10 @@ export interface TestStatus {
         initialClientHmr: TestStatusValue;
         realtimeServerHmr: TestStatusValue;
         realtimeClientHmr: TestStatusValue;
+        initialUrlStyles: TestStatusValue;
+        initialClientModuleStyles: TestStatusValue;
+        realtimeUrlStyles: TestStatusValue;
+        realtimeClientModuleStyles: TestStatusValue;
     };
 }
 export declare const state: {

package/dist/lib/smokeTests/state.mjs

@@ -32,6 +32,11 @@ export const state = {
             initialClientHmr: "DID_NOT_RUN",
             realtimeServerHmr: "DID_NOT_RUN",
             realtimeClientHmr: "DID_NOT_RUN",
+            // Style check statuses
+            initialUrlStyles: "DID_NOT_RUN",
+            initialClientModuleStyles: "DID_NOT_RUN",
+            realtimeUrlStyles: "DID_NOT_RUN",
+            realtimeClientModuleStyles: "DID_NOT_RUN",
         },
         production: {
             overall: "DID_NOT_RUN",
@@ -48,6 +53,11 @@ export const state = {
             initialClientHmr: "DID_NOT_RUN",
             realtimeServerHmr: "DID_NOT_RUN",
             realtimeClientHmr: "DID_NOT_RUN",
+            // Style check statuses
+            initialUrlStyles: "DID_NOT_RUN",
+            initialClientModuleStyles: "DID_NOT_RUN",
+            realtimeUrlStyles: "DID_NOT_RUN",
+            realtimeClientModuleStyles: "DID_NOT_RUN",
         },
     },
 };