@nx/cypress 16.8.0-beta.5 → 16.8.0-beta.6

package/migrations.json

@@ -59,6 +59,12 @@
       "version": "16.4.0-beta.10",
       "description": "Remove tsconfig.e2e.json and add settings to project tsconfig.json. tsConfigs executor option is now deprecated. The project level tsconfig.json file should be used instead.",
       "implementation": "./src/migrations/update-16-4-0/tsconfig-sourcemaps"
+    },
+    "update-16-8-0-cypress-13": {
+      "cli": "nx",
+      "version": "16.8.0-beta.4",
+      "description": "Update to Cypress v13. Most noteable change is video recording is off by default. This migration will only update if the workspace is already on Cypress v12. https://docs.cypress.io/guides/references/migration-guide#Migrating-to-Cypress-130",
+      "implementation": "./src/migrations/update-16-8-0/cypress-13"
     }
   },
   "packageJsonUpdates": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/cypress",
-  "version": "16.8.0-beta.5",
+  "version": "16.8.0-beta.6",
   "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,17 +34,17 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@nrwl/cypress": "16.8.0-beta.5",
-    "@nx/devkit": "16.8.0-beta.5",
-    "@nx/js": "16.8.0-beta.5",
-    "@nx/linter": "16.8.0-beta.5",
+    "@nrwl/cypress": "16.8.0-beta.6",
+    "@nx/devkit": "16.8.0-beta.6",
+    "@nx/js": "16.8.0-beta.6",
+    "@nx/linter": "16.8.0-beta.6",
     "@phenomnomnominal/tsquery": "~5.0.1",
     "detect-port": "^1.5.1",
     "semver": "7.5.3",
     "tslib": "^2.3.0"
   },
   "peerDependencies": {
-    "cypress": ">= 3 < 13"
+    "cypress": ">= 3 < 14"
   },
   "peerDependenciesMeta": {
     "cypress": {
@@ -55,5 +55,5 @@
     "access": "public"
   },
   "type": "commonjs",
-  "gitHead": "ad2d1e8a55b2d1b358bb5e7483343d9757ff2c53"
+  "gitHead": "0cc6ba996f2ef09f00b932c8eacf42de642457f3"
 }

package/plugins/cypress-preset.d.ts

@@ -1,7 +1,6 @@
 interface BaseCypressPreset {
     videosFolder: string;
     screenshotsFolder: string;
-    video: boolean;
     chromeWebSecurity: boolean;
 }
 export interface NxComponentTestingOptions {
@@ -39,7 +38,6 @@ export declare function nxE2EPreset(pathToConfig: string, options?: NxCypressE2E
     fixturesFolder: string;
     videosFolder: string;
     screenshotsFolder: string;
-    video: boolean;
     chromeWebSecurity: boolean;
 } | {
     setupNodeEvents(on: any): void;
@@ -49,7 +47,6 @@ export declare function nxE2EPreset(pathToConfig: string, options?: NxCypressE2E
     fixturesFolder: string;
     videosFolder: string;
     screenshotsFolder: string;
-    video: boolean;
     chromeWebSecurity: boolean;
 };
 export type NxCypressE2EPresetOptions = {

package/plugins/cypress-preset.js

@@ -21,7 +21,6 @@ function nxBaseCypressPreset(pathToConfig, options) {
     return {
         videosFolder,
         screenshotsFolder,
-        video: true,
         chromeWebSecurity: false,
     };
 }

package/src/executors/cypress/cypress.impl.d.ts

@@ -33,6 +33,7 @@ export interface CypressExecutorOptions extends Json {
     tag?: string;
     port?: number | 'cypress-auto';
     quiet?: boolean;
+    runnerUi?: boolean;
 }
 export default function cypressExecutor(options: CypressExecutorOptions, context: ExecutorContext): Promise<{
     success: any;

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

@@ -163,6 +163,7 @@ async function runCypress(baseUrl, opts) {
     options.tag = opts.tag;
     options.exit = opts.exit;
     options.headed = opts.headed;
+    options.runnerUi = opts.runnerUi;
     if (opts.headless) {
         options.headless = opts.headless;
     }

package/src/executors/cypress/schema.json

@@ -164,6 +164,10 @@
       "type": "boolean",
       "description": "If passed, Cypress output will not be printed to stdout. Only output from the configured Mocha reporter will print.",
       "default": false
+    },
+    "runnerUi": {
+      "type": "boolean",
+      "description": "Displays the Cypress Runner UI. Useful for when Test Replay is enabled and you would still like the Cypress Runner UI to be displayed for screenshots and video."
     }
   },
   "additionalProperties": true,

package/src/migrations/update-16-8-0/cypress-13.d.ts

@@ -0,0 +1,7 @@
+import { type Tree } from '@nx/devkit';
+export declare function updateToCypress13(tree: Tree): Promise<void>;
+/**
+ * leave a comment on all usages of overriding built-ins that are now banned
+ **/
+export declare function shouldNotOverrideReadFile(tree: Tree, filePath: string): void;
+export default updateToCypress13;

package/src/migrations/update-16-8-0/cypress-13.js

@@ -0,0 +1,179 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.shouldNotOverrideReadFile = exports.updateToCypress13 = void 0;
+const devkit_1 = require("@nx/devkit");
+const cypress_version_1 = require("../../utils/cypress-version");
+const typescript_1 = require("typescript");
+const tsquery_1 = require("@phenomnomnominal/tsquery");
+const executor_options_utils_1 = require("@nx/devkit/src/generators/executor-options-utils");
+const JS_TS_FILE_MATCHER = /\.[jt]sx?$/;
+async function updateToCypress13(tree) {
+    if ((0, cypress_version_1.installedCypressVersion)() < 12) {
+        return;
+    }
+    const projects = (0, devkit_1.getProjects)(tree);
+    (0, executor_options_utils_1.forEachExecutorOptions)(tree, '@nx/cypress:cypress', (options, projectName) => {
+        if (!options.cypressConfig || !tree.exists(options.cypressConfig)) {
+            return;
+        }
+        const projectConfig = projects.get(projectName);
+        removeNodeVersionOption(tree, options.cypressConfig);
+        removeVideoUploadOnPassesOption(tree, options.cypressConfig);
+        (0, devkit_1.visitNotIgnoredFiles)(tree, projectConfig.root, (filePath) => {
+            if (!JS_TS_FILE_MATCHER.test(filePath)) {
+                return;
+            }
+            shouldNotOverrideReadFile(tree, filePath);
+        });
+    });
+    (0, devkit_1.updateJson)(tree, 'package.json', (json) => {
+        json.devDependencies ??= {};
+        json.devDependencies.cypress = '^13.0.0';
+        return json;
+    });
+    await (0, devkit_1.formatFiles)(tree);
+}
+exports.updateToCypress13 = updateToCypress13;
+function removeVideoUploadOnPassesOption(tree, configPath) {
+    const config = tree.read(configPath, 'utf-8');
+    const isUsingDeprecatedOption = tsquery_1.tsquery.query(config, getPropertyQuery('videoUploadOnPasses'))?.length > 0;
+    if (!isUsingDeprecatedOption) {
+        return;
+    }
+    const importStatement = configPath.endsWith('.ts')
+        ? "import fs from 'fs';"
+        : "const fs = require('fs');";
+    const replacementFunction = `/**
+* Delete videos for specs that do not contain failing or retried tests.
+* This function is to be used in the 'setupNodeEvents' configuration option as a replacement to 
+* 'videoUploadOnPasses' which has been removed.
+*
+* https://docs.cypress.io/guides/guides/screenshots-and-videos#Delete-videos-for-specs-without-failing-or-retried-tests
+**/
+function removePassedSpecs(on) {
+  on('after:spec', (spec, results) => {
+    if(results && results.vide) {
+      const hasFailures = results.tests.some(t => t.attempts.some(a =>  a.state === 'failed'));
+
+      if(!hasFailures) {
+        fs.unlinkSync(results.video);
+      }
+    }
+  })
+}`;
+    const withReplacementFn = `${importStatement}\n${config}\n${replacementFunction}`;
+    // setupNodeEvents can be a property or method.
+    const setupNodeEventsQuery = 'ExportAssignment ObjectLiteralExpression > :matches(PropertyAssignment:has(Identifier[name="setupNodeEvents"]), MethodDeclaration:has(Identifier[name="setupNodeEvents"]))';
+    const hasSetupNodeEvents = tsquery_1.tsquery.query(withReplacementFn, setupNodeEventsQuery)?.length > 0;
+    let updatedWithSetupNodeEvents = withReplacementFn;
+    if (hasSetupNodeEvents) {
+        // if have setupNodeEvents, update existing fn to use removePassedSpecs helper and remove videoUploadOnPasses
+        const noVideoUploadOption = tsquery_1.tsquery.replace(withReplacementFn, getPropertyQuery('videoUploadOnPasses'), (node) => {
+            if ((0, typescript_1.isObjectLiteralExpression)(node.initializer)) {
+                // is a nested config object
+                const key = node.name.getText().trim();
+                const listOfProperties = node.initializer.properties
+                    .map((j) => j.getText())
+                    .filter((j) => !j.includes('videoUploadOnPasses'))
+                    .join(',\n');
+                return `${key}: {
+    ${listOfProperties}
+}
+  `;
+            }
+            else {
+                if (isPropertyTopLevel(node)) {
+                    return `// ${node.getText()} `;
+                }
+            }
+        });
+        updatedWithSetupNodeEvents = tsquery_1.tsquery.replace(noVideoUploadOption, `${setupNodeEventsQuery} Block`, (node) => {
+            const blockWithoutBraces = node
+                .getFullText()
+                .trim()
+                .slice(1, -1)
+                .trim();
+            return `{
+  ${blockWithoutBraces}
+  removePassedSpecs(on);
+}
+`;
+        }, { visitAllChildren: false });
+    }
+    else {
+        // if don't have setupNodeEvents, replace videoUploadOnPasses with setupNodeEvents method
+        updatedWithSetupNodeEvents = tsquery_1.tsquery.replace(withReplacementFn, getPropertyQuery('videoUploadOnPasses'), () => {
+            return `setupNodeEvents(on, config) {
+  removePassedSpecs(on);
+}`;
+        });
+    }
+    tree.write(configPath, updatedWithSetupNodeEvents);
+}
+/**
+ * remove the nodeVersion option from the config file
+ **/
+function removeNodeVersionOption(tree, configPath) {
+    const config = tree.read(configPath, 'utf-8');
+    const updated = tsquery_1.tsquery.replace(config, getPropertyQuery('nodeVersion'), (node) => {
+        if ((0, typescript_1.isObjectLiteralExpression)(node.initializer)) {
+            // is a nested config object
+            const key = node.name.getText().trim();
+            const listOfProperties = node.initializer.properties
+                .map((j) => j.getFullText())
+                .filter((j) => !j.includes('nodeVersion'))
+                .join(',    ');
+            return `${key}: {
+    ${listOfProperties}
+  }`;
+        }
+        else {
+            if (isPropertyTopLevel(node)) {
+                return `// ${node.getText()}`;
+            }
+        }
+    });
+    if (updated !== config) {
+        tree.write(configPath, updated);
+    }
+}
+/**
+ * leave a comment on all usages of overriding built-ins that are now banned
+ **/
+function shouldNotOverrideReadFile(tree, filePath) {
+    const content = tree.read(filePath, 'utf-8');
+    const markedOverrideUsage = tsquery_1.tsquery.replace(content, 'PropertyAccessExpression:has(Identifier[name="overwrite"]):has(Identifier[name="Cypress"])', (node) => {
+        if (isAlreadyCommented(node)) {
+            return;
+        }
+        const expression = node.expression.getText().trim();
+        // prevent grabbing other Cypress.<something>.defaults
+        if (expression === 'Cypress.Commands') {
+            // get value.
+            const overwriteExpression = node.parent;
+            const command = overwriteExpression.arguments?.[0]?.text; // need string without quotes
+            if (command === 'readFile') {
+                // overwrite
+                return `/**
+* TODO(@nx/cypress): This command can no longer be overridden
+* Consider using a different name like 'custom_${command}'
+* More info: https://docs.cypress.io/guides/references/migration-guide#readFile-can-no-longer-be-overwritten-with-CypressCommandsoverwrite
+**/
+${node.getText()}`;
+            }
+        }
+    });
+    tree.write(filePath, markedOverrideUsage);
+}
+exports.shouldNotOverrideReadFile = shouldNotOverrideReadFile;
+function isAlreadyCommented(node) {
+    return node.getFullText().includes('TODO(@nx/cypress)');
+}
+function isPropertyTopLevel(node) {
+    return (node.parent &&
+        (0, typescript_1.isObjectLiteralExpression)(node.parent) &&
+        node.parent.parent &&
+        (0, typescript_1.isCallExpression)(node.parent.parent));
+}
+const getPropertyQuery = (propertyName) => `ExportAssignment ObjectLiteralExpression > PropertyAssignment:has(Identifier[name="${propertyName}"])`;
+exports.default = updateToCypress13;

package/src/utils/versions.d.ts

@@ -2,7 +2,7 @@ export declare const nxVersion: any;
 export declare const eslintPluginCypressVersion = "^2.13.4";
 export declare const typesNodeVersion = "16.11.7";
 export declare const cypressViteDevServerVersion = "^2.2.1";
-export declare const cypressVersion = "^12.16.0";
+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";

package/src/utils/versions.js

@@ -5,7 +5,7 @@ exports.nxVersion = require('../../package.json').version;
 exports.eslintPluginCypressVersion = '^2.13.4';
 exports.typesNodeVersion = '16.11.7';
 exports.cypressViteDevServerVersion = '^2.2.1';
-exports.cypressVersion = '^12.16.0';
+exports.cypressVersion = '^13.0.0';
 exports.cypressWebpackVersion = '^2.0.0';
 exports.webpackHttpPluginVersion = '^5.5.0';
 exports.viteVersion = '~4.3.9';