@nx/cypress 17.2.0-beta.2 → 17.2.0-beta.4

package/migrations.json

@@ -87,6 +87,15 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "17.2.0-beta.2": {
+      "version": "17.2.0-beta.2",
+      "packages": {
+        "vite": {
+          "version": "^5.0.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/cypress",
-  "version": "17.2.0-beta.2",
+  "version": "17.2.0-beta.4",
   "private": false,
   "description": "The Nx Plugin for Cypress contains executors and generators allowing your workspace to use the powerful Cypress integration testing capabilities.",
   "repository": {
@@ -34,14 +34,15 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@nx/devkit": "17.2.0-beta.2",
-    "@nx/eslint": "17.2.0-beta.2",
-    "@nx/js": "17.2.0-beta.2",
+    "@nx/devkit": "17.2.0-beta.4",
+    "@nx/eslint": "17.2.0-beta.4",
+    "@nx/js": "17.2.0-beta.4",
     "@phenomnomnominal/tsquery": "~5.0.1",
     "detect-port": "^1.5.1",
+    "string-argv": "^0.3.2",
     "semver": "7.5.3",
     "tslib": "^2.3.0",
-    "@nrwl/cypress": "17.2.0-beta.2"
+    "@nrwl/cypress": "17.2.0-beta.4"
   },
   "peerDependencies": {
     "cypress": ">= 3 < 14"

package/plugins/cypress-preset.d.ts

@@ -32,6 +32,17 @@ export declare function nxBaseCypressPreset(pathToConfig: string, options?: {
  *
  */
 export declare function nxE2EPreset(pathToConfig: string, options?: NxCypressE2EPresetOptions): any;
+export interface WebServerConfig {
+    /**
+     * Timeout to wait for the webserver to start listening
+     */
+    timeout?: number;
+    /**
+     * Reuse an existing web server if it exists
+     * If this is false, an error will be thrown if the server is already running
+     */
+    reuseExistingServer?: boolean;
+}
 export type NxCypressE2EPresetOptions = {
     bundler?: string;
     /**
@@ -40,7 +51,8 @@ export type NxCypressE2EPresetOptions = {
      * default is 'src'
      **/
     cypressDir?: string;
-    devServerTargets?: Record<string, string>;
-    ciDevServerTarget?: string;
+    webServerCommands?: Record<string, string>;
+    ciWebServerCommand?: string;
+    webServerConfig?: WebServerConfig;
 };
 export {};

package/plugins/cypress-preset.js

@@ -5,8 +5,9 @@ const devkit_1 = require("@nx/devkit");
 const path_1 = require("path");
 const fs_1 = require("fs");
 const preprocessor_vite_1 = require("../src/plugins/preprocessor-vite");
-const ct_helpers_1 = require("../src/utils/ct-helpers");
-const start_dev_server_1 = require("../src/utils/start-dev-server");
+const child_process_1 = require("child_process");
+const http_1 = require("http");
+const https_1 = require("https");
 function nxBaseCypressPreset(pathToConfig, options) {
     // used to set babel settings for react CT.
     process.env.NX_CYPRESS_COMPONENT_TEST =
@@ -27,6 +28,16 @@ function nxBaseCypressPreset(pathToConfig, options) {
     };
 }
 exports.nxBaseCypressPreset = nxBaseCypressPreset;
+function startWebServer(webServerCommand) {
+    const serverProcess = (0, child_process_1.exec)(webServerCommand, {
+        cwd: devkit_1.workspaceRoot,
+    });
+    serverProcess.stdout.pipe(process.stdout);
+    serverProcess.stderr.pipe(process.stderr);
+    return () => {
+        serverProcess.kill();
+    };
+}
 /**
  * nx E2E Preset for Cypress
  * @description
@@ -51,40 +62,78 @@ function nxE2EPreset(pathToConfig, options) {
         specPattern: `${basePath}/**/*.cy.{js,jsx,ts,tsx}`,
         fixturesFolder: `${basePath}/fixtures`,
         env: {
-            devServerTargets: options?.devServerTargets,
-            devServerTargetOptions: {},
-            ciDevServerTarget: options?.ciDevServerTarget,
+            webServerCommands: options?.webServerCommands,
+            ciWebServerCommand: options?.ciWebServerCommand,
         },
         async setupNodeEvents(on, config) {
             if (options?.bundler === 'vite') {
                 on('file:preprocessor', (0, preprocessor_vite_1.default)());
             }
-            if (!config.env.devServerTargets) {
+            if (!config.env.webServerCommands) {
                 return;
             }
-            const devServerTarget = config.env.devServerTarget ?? config.env.devServerTargets['default'];
-            if (!devServerTarget) {
+            const webServerCommand = config.env.webServerCommand ?? config.env.webServerCommands.default;
+            if (!webServerCommand) {
                 return;
             }
-            if (!config.baseUrl && devServerTarget) {
-                const graph = await (0, devkit_1.createProjectGraphAsync)();
-                const target = (0, devkit_1.parseTargetString)(devServerTarget, graph);
-                const context = (0, ct_helpers_1.createExecutorContext)(graph, graph.nodes[target.project].data?.targets, target.project, target.target, target.configuration);
-                const devServer = (0, start_dev_server_1.startDevServer)({
-                    devServerTarget,
-                    ...config.env.devServerTargetOptions,
-                }, context);
+            if (config.baseUrl && webServerCommand) {
+                if (await isServerUp(config.baseUrl)) {
+                    if (options.webServerConfig.reuseExistingServer === undefined
+                        ? true
+                        : options.webServerConfig.reuseExistingServer) {
+                        console.log(`Reusing the server already running on ${config.baseUrl}`);
+                        return;
+                    }
+                    else {
+                        throw new Error(`Web server is already running at ${config.baseUrl}`);
+                    }
+                }
+                const killWebServer = startWebServer(webServerCommand);
                 on('after:run', () => {
-                    devServer.return();
+                    killWebServer();
                 });
-                const devServerValue = (await devServer.next()).value;
-                if (!devServerValue) {
-                    return;
-                }
-                return { ...config, baseUrl: devServerValue.baseUrl };
+                await waitForServer(config.baseUrl, options.webServerConfig);
             }
         },
     };
     return baseConfig;
 }
 exports.nxE2EPreset = nxE2EPreset;
+function waitForServer(url, webServerConfig) {
+    return new Promise((resolve, reject) => {
+        let pollTimeout;
+        const { protocol } = new URL(url);
+        const timeoutDuration = webServerConfig?.timeout ?? 5 * 1000;
+        const timeout = setTimeout(() => {
+            clearTimeout(pollTimeout);
+            reject(new Error(`Web server failed to start in ${timeoutDuration}ms. This can be configured in cypress.config.ts.`));
+        }, timeoutDuration);
+        const makeRequest = protocol === 'https:' ? https_1.request : http_1.request;
+        function pollForServer() {
+            const request = makeRequest(url, () => {
+                clearTimeout(timeout);
+                resolve();
+            });
+            request.on('error', () => {
+                pollTimeout = setTimeout(pollForServer, 100);
+            });
+            // Don't forget to end the request
+            request.end();
+        }
+        pollForServer();
+    });
+}
+function isServerUp(url) {
+    const { protocol } = new URL(url);
+    const makeRequest = protocol === 'https:' ? https_1.request : http_1.request;
+    return new Promise((resolve) => {
+        const request = makeRequest(url, () => {
+            resolve(true);
+        });
+        request.on('error', () => {
+            resolve(false);
+        });
+        // Don't forget to end the request
+        request.end();
+    });
+}

package/src/executors/cypress/cypress.impl.js

@@ -109,9 +109,6 @@ async function runCypress(baseUrl, opts) {
     if (opts.browser) {
         options.browser = opts.browser;
     }
-    options.env = {
-        devServerTarget: opts.devServerTarget,
-    };
     if (opts.env) {
         options.env = {
             ...options.env,

package/src/generators/configuration/configuration.js

@@ -95,28 +95,28 @@ async function addFiles(tree, options, projectGraph, hasPlugin) {
             jsx: options.jsx,
         });
         const cyFile = (0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress.config.ts');
-        let devServerTargets;
+        let webServerCommands;
         let ciDevServerTarget;
         if (hasPlugin && !options.baseUrl && options.devServerTarget) {
-            devServerTargets = {};
-            devServerTargets.default = options.devServerTarget;
+            webServerCommands = {};
+            webServerCommands.default = 'nx run ' + options.devServerTarget;
             const parsedTarget = (0, devkit_1.parseTargetString)(options.devServerTarget, projectGraph);
             const devServerProjectConfig = (0, devkit_1.readProjectConfiguration)(tree, parsedTarget.project);
             // Add production e2e target if serve target is found
             if (parsedTarget.configuration !== 'production' &&
                 devServerProjectConfig.targets[parsedTarget.target]?.configurations?.['production']) {
-                devServerTargets.production = `${parsedTarget.project}:${parsedTarget.target}:production`;
+                webServerCommands.production = `nx run ${parsedTarget.project}:${parsedTarget.target}:production`;
             }
             // Add ci/static e2e target if serve target is found
             if (devServerProjectConfig.targets?.['serve-static']) {
-                ciDevServerTarget = `${parsedTarget.project}:serve-static`;
+                ciDevServerTarget = `nx run ${parsedTarget.project}:serve-static`;
             }
         }
         const updatedCyConfig = await (0, config_1.addDefaultE2EConfig)(tree.read(cyFile, 'utf-8'), {
             cypressDir: options.directory,
             bundler: options.bundler === 'vite' ? 'vite' : undefined,
-            devServerTargets,
-            ciDevServerTarget: ciDevServerTarget,
+            webServerCommands,
+            ciWebServerCommand: ciDevServerTarget,
         }, options.baseUrl);
         tree.write(cyFile, updatedCyConfig);
     }

package/src/plugins/plugin.js

@@ -124,12 +124,12 @@ function buildCypressTargets(configFilePath, projectRoot, options, context) {
             targets[options.targetName].configurations ??= {};
             for (const [configuration, devServerTarget] of Object.entries(devServerTargets ?? {})) {
                 targets[options.targetName].configurations[configuration] = {
-                    command: `cypress run --config-file ${relativeConfigPath} --e2e --env.devServerTarget ${devServerTarget}`,
+                    command: `cypress run --config-file ${relativeConfigPath} --e2e --env.webServerCommand "nx run ${devServerTarget}"`,
                 };
             }
         }
-        const ciDevServerTarget = cypressEnv?.ciDevServerTarget;
-        if (ciDevServerTarget) {
+        const ciWebServerCommand = cypressEnv?.ciWebServerCommand;
+        if (ciWebServerCommand) {
             const specPatterns = Array.isArray(cypressConfig.e2e.specPattern)
                 ? cypressConfig.e2e.specPattern.map((p) => (0, path_1.join)(projectRoot, p))
                 : [(0, path_1.join)(projectRoot, cypressConfig.e2e.specPattern)];
@@ -150,7 +150,10 @@ function buildCypressTargets(configFilePath, projectRoot, options, context) {
                     outputs,
                     inputs,
                     cache: true,
-                    command: `cypress run --config-file ${relativeConfigPath} --e2e --env.devServerTarget ${ciDevServerTarget} --spec ${relativeSpecFilePath}`,
+                    command: `cypress run --config-file ${relativeConfigPath} --e2e --env=${JSON.stringify({ webServerCommand: ciWebServerCommand })} --spec ${relativeSpecFilePath}`,
+                    options: {
+                        cwd: projectRoot,
+                    },
                 };
                 dependsOn.push({
                     target: targetName,

package/src/utils/versions.d.ts

@@ -5,5 +5,5 @@ export declare const cypressViteDevServerVersion = "^2.2.1";
 export declare const cypressVersion = "^13.0.0";
 export declare const cypressWebpackVersion = "^2.0.0";
 export declare const webpackHttpPluginVersion = "^5.5.0";
-export declare const viteVersion = "~4.3.9";
+export declare const viteVersion = "^5.0.0";
 export declare const htmlWebpackPluginVersion = "^5.5.0";

package/src/utils/versions.js

@@ -8,5 +8,5 @@ exports.cypressViteDevServerVersion = '^2.2.1';
 exports.cypressVersion = '^13.0.0';
 exports.cypressWebpackVersion = '^2.0.0';
 exports.webpackHttpPluginVersion = '^5.5.0';
-exports.viteVersion = '~4.3.9';
+exports.viteVersion = '^5.0.0';
 exports.htmlWebpackPluginVersion = '^5.5.0';