Fix vite-ecosystem-ci integration (#8997)

integration/helpers/playwright-fixture.ts

@@ -277,13 +277,12 @@ async function doAndWait(
   page.on("requestfailed", onRequestDone);
   page.on("load", networkSettledCallback); // e.g. navigation with javascript disabled
 
-  let timeoutId: NodeJS.Timer | undefined;
-  if (DEBUG) {
-    timeoutId = setInterval(() => {
-      console.log(`${requestCounter} requests pending:`);
-      for (let request of pending) console.log(`  ${request.url()}`);
-    }, 5000);
-  }
+  let timeoutId = DEBUG
+    ? setInterval(() => {
+        console.log(`${requestCounter} requests pending:`);
+        for (let request of pending) console.log(`  ${request.url()}`);
+      }, 5000)
+    : undefined;
 
   let result = await action();
   actionDone = true;

integration/helpers/vite.ts

@@ -116,6 +116,14 @@ export async function createProject(
   return projectDir;
 }
 
+// Avoid "Warning: The 'NO_COLOR' env is ignored due to the 'FORCE_COLOR' env
+// being set" in vite-ecosystem-ci which breaks empty stderr assertions. To fix
+// this we always ensure that only NO_COLOR is set after spreading process.env.
+const colorEnv = {
+  FORCE_COLOR: undefined,
+  NO_COLOR: "1",
+} as const;
+
 export const viteBuild = ({
   cwd,
   env = {},
@@ -129,6 +137,7 @@ export const viteBuild = ({
     cwd,
     env: {
       ...process.env,
+      ...colorEnv,
       ...env,
     },
   });
@@ -314,6 +323,7 @@ function node(
     cwd: options.cwd,
     env: {
       ...process.env,
+      ...colorEnv,
       ...options.env,
     },
     stdio: "pipe",

package.json

@@ -26,7 +26,7 @@
     "playwright:integration": "playwright test --config ./integration/playwright.config.ts",
     "vite-ecosystem-ci:build": "pnpm build",
     "vite-ecosystem-ci:before-test": "pnpm playwright install",
-    "vite-ecosystem-ci:test": "pnpm playwright:integration vite && pnpm clean:integration",
+    "vite-ecosystem-ci:test": "pnpm playwright:integration --project=chromium integration/vite-* && pnpm clean:integration",
     "changeset": "changeset",
     "changeset:version": "changeset version && node ./scripts/remove-prerelease-changelogs.mjs && node ./scripts/patchup-version.mjs",
     "changeset:release": "pnpm build --tsc && changeset publish",

packages/remix-dev/vite/babel.ts

@@ -1,9 +1,15 @@
+/* eslint-disable @typescript-eslint/consistent-type-imports */
 import type { NodePath } from "@babel/traverse";
 import type { types as BabelTypes } from "@babel/core";
 import { parse } from "@babel/parser";
 import * as t from "@babel/types";
-import traverse from "@babel/traverse";
-import generate from "@babel/generator";
+
+// These `require`s were needed to support building within vite-ecosystem-ci,
+// otherwise we get errors that `traverse` and `generate` are not functions.
+const traverse = require("@babel/traverse")
+  .default as typeof import("@babel/traverse").default;
+const generate = require("@babel/generator")
+  .default as typeof import("@babel/generator").default;
 
 export { traverse, generate, parse, t };
 export type { BabelTypes, NodePath };