@nx/cypress 23.3.0-beta.7 → 23.3.0-beta.9

package/README.md

@@ -12,7 +12,7 @@
 [![Semantic Release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square)](<>)
 [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
 [![Join us on the Official Nx Discord Server](https://img.shields.io/discord/1143497901675401286?label=discord)](https://go.nx.dev/community)
-[![Nx Sandboxing](https://staging.nx.app/workspaces/62d013ea0852fe0a2df74438/sandbox-badge.svg)](https://nx.dev/docs/features/ci-features/sandboxing)
+[![Hours saved](https://img.shields.io/endpoint?url=https%3A%2F%2Fstaging.nx.app%2Fnx-cloud%2Fbadge%2F62d013ea0852fe0a2df74438%2Fhours-saved.json)](https://nx.dev/nx-cloud)
 
 </div>
 

package/dist/src/migrations/update-23-1-0/disable-webpack-ct-just-in-time-compile.js

@@ -46,7 +46,8 @@ function isWebpackComponentTesting(component) {
     if (usesNxComponentTestingPreset(component)) {
         // @nx/remix is the only vite-based Nx CT preset; resolve the import bound
         // to the call so an unrelated remix reference elsewhere can't misclassify.
-        return getComponentTestingPresetImport(component) !== NX_VITE_CT_PRESET;
+        return ((0, migrations_1.getComponentTestingPresetImport)(component.getSourceFile()) !==
+            NX_VITE_CT_PRESET);
     }
     // Hand-written config: migrate only when it has an inline devServer framework.
     return hasInlineDevServerFramework(component);
@@ -71,43 +72,6 @@ function getComponentProperty(component, name) {
     ts ??= (0, internal_1.ensureTypescript)();
     return (0, tsquery_1.query)(component, 'PropertyAssignment').filter((property) => ts.isIdentifier(property.name) && property.name.text === name);
 }
-// Resolves the module specifier that binds the `nxComponentTestingPreset`
-// identifier used inside `component`, covering both ESM `import` and CJS
-// `require` cypress configs. Returns null when no such binding is found.
-function getComponentTestingPresetImport(component) {
-    ts ??= (0, internal_1.ensureTypescript)();
-    for (const statement of component.getSourceFile().statements) {
-        if (ts.isImportDeclaration(statement) && statement.importClause) {
-            const namedBindings = statement.importClause.namedBindings;
-            if (namedBindings &&
-                ts.isNamedImports(namedBindings) &&
-                ts.isStringLiteral(statement.moduleSpecifier) &&
-                namedBindings.elements.some((element) => element.name.text === 'nxComponentTestingPreset')) {
-                return statement.moduleSpecifier.text;
-            }
-        }
-        if (ts.isVariableStatement(statement)) {
-            for (const declaration of statement.declarationList.declarations) {
-                const initializer = declaration.initializer;
-                if (!initializer ||
-                    !ts.isCallExpression(initializer) ||
-                    !ts.isIdentifier(initializer.expression) ||
-                    initializer.expression.text !== 'require' ||
-                    !ts.isObjectBindingPattern(declaration.name)) {
-                    continue;
-                }
-                const moduleSpecifier = initializer.arguments[0];
-                if (moduleSpecifier &&
-                    ts.isStringLiteral(moduleSpecifier) &&
-                    declaration.name.elements.some((element) => ts.isIdentifier(element.name) &&
-                        element.name.text === 'nxComponentTestingPreset')) {
-                    return moduleSpecifier.text;
-                }
-            }
-        }
-    }
-    return null;
-}
 function setsJustInTimeCompile(component) {
     return getComponentProperty(component, 'justInTimeCompile').length > 0;
 }

package/dist/src/migrations/update-23-3-0/ai-instructions-for-cypress-16.md

@@ -139,7 +139,50 @@ it('renders on mobile', { viewportWidth: 375 }, () => {
 
 `cy.getCookie()`, `cy.getCookies()`, `cy.getAllCookies()`, `cy.getAllLocalStorage()` and `cy.getAllSessionStorage()` are queries: they retry assertions chained with `.should()` and follow `defaultCommandTimeout` (4000ms) instead of `responseTimeout` (30000ms). A `.then()` callback still runs once and does not retry. Change nothing unless a test fails; then move the assertion from `.then()` onto `.should()` so it retries, or pass `{ timeout }` when a cookie read needs longer than 4 seconds.
 
-The deterministic migration renamed `Cypress.Commands.overwrite()` to `overwriteQuery()` for those five names. Adapt each renamed callback: make it a `function` expression, call `originalFn.call(this, ...)`, and return a function that computes the result from the subject, not a chainable. Cypress calls both the callback and the original query with the command as `this`, so an arrow callback fails to typecheck (TS2684) and throws at runtime. The paired `adapt-query-command-overwrites` instructions show the rewrites.
+The deterministic migration renamed `Cypress.Commands.overwrite()` to `overwriteQuery()` for those five names; `<advisory_context>` lists each renamed call. Do not re-apply the rename. Adapt each renamed callback to the query contract: `overwriteQuery` calls the callback with the command as `this`, the original query function as the first argument, and then the arguments the test passed, and the callback must return a function that takes the subject. Cypress calls that returned function, possibly many times while retrying, to compute the result. It must not return a chainable, call `cy.*` commands or use `.then()`. The original query reads `this` as well, so every callback must be a `function` expression that calls `originalFn.call(this, ...)`. An arrow callback, or a plain `originalFn(...)` call, fails to typecheck (TS2684, `QueryFnWithOriginalFn` declares `this: Command`) and throws at runtime. Convert arrow callbacks even when they only forward their arguments:
+
+**Before:**
+
+```ts
+Cypress.Commands.overwriteQuery('getCookie', (originalFn, name, options) => {
+  return originalFn(name, { ...options, log: false });
+});
+```
+
+**After:**
+
+```ts
+Cypress.Commands.overwriteQuery(
+  'getCookie',
+  function (originalFn, name, options) {
+    return originalFn.call(this, name, { ...options, log: false });
+  }
+);
+```
+
+Rewrite callbacks that post-process the result. Get the inner function from `originalFn`, then return a function that calls it with the subject and transforms the value:
+
+**Before:**
+
+```ts
+Cypress.Commands.overwriteQuery('getCookies', (originalFn, options) => {
+  return originalFn(options).then((cookies) =>
+    cookies.filter((cookie) => cookie.name.startsWith('app.'))
+  );
+});
+```
+
+**After:**
+
+```ts
+Cypress.Commands.overwriteQuery('getCookies', function (originalFn, options) {
+  const innerFn = originalFn.call(this, options);
+  return (subject) =>
+    innerFn(subject).filter((cookie) => cookie.name.startsWith('app.'));
+});
+```
+
+Callbacks that call other `cy.*` commands, use `cy.wrap()`, or run asynchronous work cannot become queries. Move that logic into a separate custom command added with `Cypress.Commands.add()` and update the specs that relied on the overwritten behavior.
 
 ## Step 7: Review behavior changes that need no code by default
 
@@ -155,7 +198,7 @@ Flag these, and change code only when a test fails:
 ## Step 8: Component testing
 
 - Angular: `cypress/angular` mounts with zoneless change detection on Cypress 16, for zone-based apps too. A template no longer re-renders after a plain property mutation on the component instance, so state that tests assert on in the DOM must be signal-based. The `autoSpyOutputs` and `autoDetectChanges` mount options no longer exist: remove `autoDetectChanges`, and replace `autoSpyOutputs: true` with explicit spies passed through `componentProperties` (for example `{ saved: createOutputSpy('savedSpy') }`). Cypress officially supports Angular 21 and later; Angular 20 runs with a warning. The harness bootstraps through `@angular/platform-browser/testing`, so `@angular/platform-browser-dynamic` can be uninstalled when nothing else imports it. The deprecated `@cypress/angular-zoneless` npm package was removed and its imports rewritten to `cypress/angular` by the deterministic migration; remove any leftover reference to it.
-- Vite: Cypress 16 component testing runs on Vite 8 only, and `@cypress/vite-dev-server` 8 declares it as a peer. Bump `vite` and any `@vitejs/*` plugin that still pins an older major. The package update only sees the Vite installed at the workspace root, so check projects that declare their own `vite` in a project-level `package.json`.
+- Vite: Cypress 16 component testing runs on Vite 8 only, and `@cypress/vite-dev-server` 8 declares it as a peer. The deterministic migration kept the workspace on Cypress 15 only when a Vite component testing config, or a config whose bundler could not be determined statically, resolved an installed Vite below 8. It cannot see a `vite` that is declared but not installed. It also does not check a Cypress config with a custom name that no `@nx/cypress:cypress` target references, such as one run through `nx:run-commands`. Bump any `vite` below 8 in the root or a project `package.json`, and any `@vitejs/*` plugin that still pins an older major. A Vite component testing config the migration did not check must resolve Vite 8 from its directory.
 - Next.js: Cypress's `next` dev server framework requires Next.js 15.0.4 or later. The `@nx/next/plugins/component-testing` preset runs the `react` framework over a webpack config Nx builds, so a Cypress config on that preset does not use the dropped adapter. Only a hand-written config with `devServer: { framework: 'next' }` needs the Next.js bump.
 - Electron: the bundled Electron browser is deprecated. Cypress prints a warning; set `defaultBrowser: 'chrome'` (or another installed browser) in the Cypress config, or pass `--browser`, when the warning matters in CI.
 

package/dist/src/migrations/update-23-3-0/update-cypress-16-config-options.js

@@ -53,7 +53,7 @@ async function updateCypress16ConfigOptions(tree) {
                 if (!isConfigProperty(property)) {
                     continue;
                 }
-                const name = getPropertyName(property.name);
+                const name = (0, migrations_1.getPropertyName)(property.name);
                 if (name === null) {
                     continue;
                 }
@@ -108,7 +108,7 @@ async function updateCypress16ConfigOptions(tree) {
 // Removed options whose value carried intent the replacement needs. A
 // shorthand value is unknown, so it gets the follow-up too.
 function getRemovalFollowUp(property) {
-    const name = getPropertyName(property.name);
+    const name = (0, migrations_1.getPropertyName)(property.name);
     if (name === 'execTimeout') {
         return `removed \`${property.getText()}\`; \`cy.exec()\` is gone, set \`taskTimeout\` if the replacement \`cy.task()\` needs more than the 60000ms default`;
     }
@@ -156,7 +156,7 @@ function getOptionBlocks(config) {
     for (const block of topLevel) {
         for (const property of block.properties) {
             if (!isConfigProperty(property) ||
-                !TESTING_TYPE_BLOCKS.includes(getPropertyName(property.name))) {
+                !TESTING_TYPE_BLOCKS.includes((0, migrations_1.getPropertyName)(property.name))) {
                 continue;
             }
             const nested = (0, config_1.resolveObjectLiteral)(ts.isPropertyAssignment(property)
@@ -175,24 +175,11 @@ function isNxPresetCall(expression) {
         NX_PRESET_CALLS.includes(expression.expression.text));
 }
 function hasProperty(block, name) {
-    return block.properties.some((property) => isConfigProperty(property) && getPropertyName(property.name) === name);
+    return block.properties.some((property) => isConfigProperty(property) && (0, migrations_1.getPropertyName)(property.name) === name);
 }
 function isConfigProperty(node) {
     return (ts.isPropertyAssignment(node) || ts.isShorthandPropertyAssignment(node));
 }
-// A computed identifier (`[key]: value`) resolves at runtime, so it is skipped.
-function getPropertyName(name) {
-    if (ts.isIdentifier(name) || isStringLiteralName(name)) {
-        return name.text;
-    }
-    if (ts.isComputedPropertyName(name) && isStringLiteralName(name.expression)) {
-        return name.expression.text;
-    }
-    return null;
-}
-function isStringLiteralName(node) {
-    return ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node);
-}
 function getValueText(property) {
     return ts.isPropertyAssignment(property)
         ? property.initializer.getText()

package/dist/src/migrations/update-23-3-0/upgrade-to-cypress-16.d.ts

@@ -0,0 +1,8 @@
+import { type Tree } from '@nx/devkit';
+type MigrationResult = {
+    nextSteps: string[];
+    agentContext: string[];
+    skipAgentic?: boolean;
+};
+export default function upgradeToCypress16(tree: Tree): Promise<MigrationResult>;
+export {};

package/dist/src/migrations/update-23-3-0/upgrade-to-cypress-16.js

@@ -0,0 +1,231 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = upgradeToCypress16;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const internal_1 = require("@nx/devkit/internal");
+const internal_2 = require("@nx/js/internal");
+const path_1 = require("path");
+const semver_1 = require("semver");
+const config_1 = require("../../utils/config");
+const migrations_1 = require("../../utils/migrations");
+const versions_1 = require("../../utils/versions");
+const update_angular_zoneless_mount_import_1 = tslib_1.__importDefault(require("./update-angular-zoneless-mount-import"));
+const update_cypress_16_config_options_1 = tslib_1.__importDefault(require("./update-cypress-16-config-options"));
+const update_cypress_16_query_command_overwrites_1 = tslib_1.__importDefault(require("./update-cypress-16-query-command-overwrites"));
+// Keep these versions pinned; versions.ts advances to later majors.
+const CYPRESS_16_VERSIONS = {
+    cypress: '^16.0.0',
+    '@cypress/vite-dev-server': '^8.0.0',
+    '@cypress/webpack-dev-server': '^6.0.0',
+};
+// Cypress 16 component testing throws on a Vite below 8 (getVite.js in its
+// bundled vite-dev-server); the peer `vite ^8.0.0` also excludes 8 prereleases.
+const VITE_FLOOR = '8.0.0';
+const NX_VITE_CT_PRESET = '@nx/remix/plugins/component-testing';
+const NX_WEBPACK_CT_PRESETS = [
+    '@nx/angular/plugins/component-testing',
+    '@nx/next/plugins/component-testing',
+    '@nx/react/plugins/component-testing',
+];
+// Re-collects the Cypress 16 migrations: below their version, above every
+// 23.2.x. `--from` is exclusive.
+const REPLAN_COMMAND = `npx nx migrate @nx/cypress@${versions_1.nxVersion} --from=@nx/cypress@23.3.0-beta.0`;
+const RERUN_COMMAND = `${REPLAN_COMMAND} && npx nx migrate --run-migration=@nx/cypress:upgrade-to-cypress-16`;
+let ts;
+async function upgradeToCypress16(tree) {
+    const declared = (0, devkit_1.readJson)(tree, 'package.json');
+    const declaredCypress = declared.dependencies?.cypress ?? declared.devDependencies?.cypress;
+    // Resolves a `catalog:` reference to its range; `addDependenciesToPackageJson`
+    // then writes the bump into the catalog.
+    const cypressRange = (0, devkit_1.getDependencyVersionFromPackageJson)(tree, 'cypress');
+    if (!cypressRange ||
+        !((0, semver_1.validRange)(cypressRange) || ['latest', 'next'].includes(cypressRange))) {
+        const reason = declaredCypress
+            ? `\`cypress\` is declared as \`${declaredCypress}\` in package.json, which this migration cannot bump`
+            : '`cypress` is not declared in the root package.json';
+        return skipped(`${reason}. Move it to \`${CYPRESS_16_VERSIONS.cypress}\` by hand, install, and run \`${REPLAN_COMMAND} && npx nx migrate --run-migrations\` to apply the Cypress 16 migrations.`);
+    }
+    const blockers = await findViteBelowFloor(tree);
+    if (blockers.length > 0) {
+        return skipped(`Kept Cypress 15: Cypress 16 component testing requires Vite 8 and ${blockers.join(', ')}. Update \`vite\` to 8 where each listed config resolves it from, and any \`@vitejs/*\` plugin whose peer range excludes Vite 8. Install, then run \`${RERUN_COMMAND}\` to move to Cypress 16.`);
+    }
+    const bumped = Object.fromEntries(Object.entries(CYPRESS_16_VERSIONS).filter(([name]) => declared.devDependencies?.[name] || declared.dependencies?.[name]));
+    (0, devkit_1.addDependenciesToPackageJson)(tree, {}, bumped);
+    const results = [
+        await (0, update_cypress_16_config_options_1.default)(tree),
+        await (0, update_cypress_16_query_command_overwrites_1.default)(tree),
+        await (0, update_angular_zoneless_mount_import_1.default)(tree),
+    ];
+    await (0, devkit_1.formatFiles)(tree);
+    return {
+        nextSteps: results.flatMap((result) => result?.nextSteps ?? []),
+        agentContext: [
+            `Bumped ${Object.entries(bumped)
+                .map(([name, version]) => `\`${name}\` to \`${version}\``)
+                .join(', ')} in package.json`,
+            ...results.flatMap((result) => result?.agentContext ?? []),
+        ],
+    };
+}
+function skipped(message) {
+    return { nextSteps: [message], agentContext: [], skipAgentic: true };
+}
+// The Cypress config files whose component testing would run on a Vite below
+// 8. Vite is resolved from each config's directory, as Cypress does. A config
+// whose bundler cannot be read statically counts when such a Vite resolves.
+async function findViteBelowFloor(tree) {
+    const cypressConfigPaths = new Set(await (0, devkit_1.globAsync)(tree, [`**/${config_1.CYPRESS_CONFIG_FILE_NAME_PATTERN}`]));
+    for await (const { cypressConfigPath } of (0, migrations_1.cypressProjectConfigs)(tree)) {
+        cypressConfigPaths.add(cypressConfigPath);
+    }
+    const blockers = [];
+    for (const cypressConfigPath of cypressConfigPaths) {
+        const bundler = tree.exists(cypressConfigPath)
+            ? getComponentTestingBundler(tree.read(cypressConfigPath, 'utf-8'))
+            : 'unknown';
+        if (bundler === 'other') {
+            continue;
+        }
+        const viteVersion = (0, internal_1.getInstalledPackageVersion)('vite', [
+            (0, path_1.resolve)(tree.root, (0, path_1.dirname)(cypressConfigPath)),
+        ]);
+        if (!viteVersion || !(0, semver_1.lt)(viteVersion, VITE_FLOOR)) {
+            continue;
+        }
+        blockers.push(bundler === 'vite'
+            ? `${cypressConfigPath} resolves Vite ${viteVersion}`
+            : `${cypressConfigPath} resolves Vite ${viteVersion} and its bundler could not be determined statically`);
+    }
+    return blockers;
+}
+// Reads the `component` block of a config the way Cypress evaluates it:
+// through same-file spreads and variables, last assignment wins. Anything that
+// cannot be resolved statically (an imported spread, a preset options variable
+// from another file, a computed bundler, a preset call not bound to an Nx
+// preset module) is `unknown`.
+function getComponentTestingBundler(contents) {
+    ts ??= (0, internal_2.ensureTypescript)();
+    const config = (0, config_1.resolveCypressConfigObject)(contents);
+    if (!config) {
+        return 'unknown';
+    }
+    const component = findProperty(config, 'component');
+    if (component === 'unresolved') {
+        return 'unknown';
+    }
+    if (!component) {
+        return 'other';
+    }
+    return classifyComponent(component, config.getSourceFile());
+}
+// The value assigned to `name` in `block`, following spreads of same-file
+// objects, last member wins. `null` when the block has no such property,
+// `'unresolved'` when the last member that could set it cannot be read: a
+// spread of something unresolvable or a computed key.
+function findProperty(block, name) {
+    const sourceFile = block.getSourceFile();
+    let value = null;
+    for (const property of block.properties) {
+        if (ts.isSpreadAssignment(property)) {
+            const spread = (0, config_1.resolveObjectLiteral)(property.expression, sourceFile);
+            value = spread ? (findProperty(spread, name) ?? value) : 'unresolved';
+            continue;
+        }
+        const memberName = getMemberName(property);
+        if (memberName === 'unresolved') {
+            value = 'unresolved';
+        }
+        else if (memberName === name) {
+            value = ts.isPropertyAssignment(property)
+                ? property.initializer
+                : ts.isShorthandPropertyAssignment(property)
+                    ? property.name
+                    : 'unresolved';
+        }
+    }
+    return value;
+}
+// The static name of an object member, `'unresolved'` for a computed key that
+// is not a string literal.
+function getMemberName(property) {
+    const name = (0, migrations_1.getPropertyName)(property.name);
+    return name === null && ts.isComputedPropertyName(property.name)
+        ? 'unresolved'
+        : name;
+}
+function classifyComponent(value, sourceFile) {
+    if (ts.isCallExpression(value)) {
+        if (!ts.isIdentifier(value.expression) ||
+            value.expression.text !== 'nxComponentTestingPreset') {
+            return 'unknown';
+        }
+        const presetImport = (0, migrations_1.getComponentTestingPresetImport)(sourceFile);
+        if (presetImport === NX_VITE_CT_PRESET) {
+            return 'vite';
+        }
+        if (!NX_WEBPACK_CT_PRESETS.includes(presetImport) ||
+            value.arguments.some((argument) => ts.isSpreadElement(argument))) {
+            return 'unknown';
+        }
+        // The other Nx presets bundle with webpack unless told otherwise.
+        if (!value.arguments[1]) {
+            return 'other';
+        }
+        const options = (0, config_1.resolveObjectLiteral)(value.arguments[1], sourceFile);
+        return options ? getBundler(options, 'other') : 'unknown';
+    }
+    const component = (0, config_1.resolveObjectLiteral)(value, sourceFile);
+    if (!component) {
+        return 'unknown';
+    }
+    return classifyComponentObject(component, sourceFile) ?? 'other';
+}
+// The bundler set by the last member of a component object that can set one:
+// a `devServer` property or a spread carrying one. `null` when none does.
+function classifyComponentObject(component, sourceFile) {
+    let bundler = null;
+    for (const property of component.properties) {
+        if (ts.isSpreadAssignment(property)) {
+            if (ts.isCallExpression(property.expression)) {
+                bundler = classifyComponent(property.expression, sourceFile);
+                continue;
+            }
+            const spread = (0, config_1.resolveObjectLiteral)(property.expression, sourceFile);
+            bundler = spread
+                ? (classifyComponentObject(spread, sourceFile) ?? bundler)
+                : 'unknown';
+            continue;
+        }
+        const memberName = getMemberName(property);
+        if (memberName === 'unresolved') {
+            bundler = 'unknown';
+        }
+        else if (memberName === 'devServer') {
+            const devServer = ts.isPropertyAssignment(property)
+                ? (0, config_1.resolveObjectLiteral)(property.initializer, sourceFile)
+                : ts.isShorthandPropertyAssignment(property)
+                    ? (0, config_1.resolveObjectLiteral)(property.name, sourceFile)
+                    : null;
+            // Cypress requires `bundler` in `devServer`, so a block without a
+            // readable one holds it somewhere this migration cannot see.
+            bundler = devServer ? getBundler(devServer, 'unknown') : 'unknown';
+        }
+    }
+    return bundler;
+}
+// The `bundler` string in an options object, `missing` when it has none.
+function getBundler(options, missing) {
+    const bundler = findProperty(options, 'bundler');
+    if (bundler === 'unresolved') {
+        return 'unknown';
+    }
+    if (!bundler) {
+        return missing;
+    }
+    if (ts.isStringLiteral(bundler) ||
+        ts.isNoSubstitutionTemplateLiteral(bundler)) {
+        return bundler.text === 'vite' ? 'vite' : 'other';
+    }
+    return 'unknown';
+}

package/dist/src/migrations/update-23-3-0/upgrade-to-cypress-16.md

@@ -1,8 +1,8 @@
 #### Upgrade Cypress 15 to 16
 
-Bumps `cypress` to 16 together with `@cypress/vite-dev-server` 8 and `@cypress/webpack-dev-server` 6. A workspace with a Vite below 8 installed at the workspace root that does not land on Vite 8 in the same run stays on Cypress 15, since Cypress 16 component testing rejects an older Vite. A Vite declared only in a project's `package.json` is not detected, so check those projects before running their component tests. Cypress 16 removes `Cypress.env()` (replaced by the asynchronous `cy.env()` for `env` values and `Cypress.expose()` for the new `expose` values), `cy.exec()` (use `cy.task()`) and `.end()`, drops `env` from test configuration overrides, turns the cookie and storage getters into queries, drops CoffeeScript support, and routes Chrome, Chromium and Edge through the native browser network. It requires Node 22, 24 or 26+, Vite 8 for Vite component testing, Angular 21 for Angular component testing and Next.js 15.0.4 for component testing on Cypress's `next` dev server framework, which the Nx preset does not use. Read more in the [Cypress 16 migration guide](https://docs.cypress.io/app/references/migration-guide#Migrating-to-Cypress-160).
+Bumps `cypress` to 16 together with the declared `@cypress/vite-dev-server` (to 8) and `@cypress/webpack-dev-server` (to 6); a package manager catalog entry is bumped in the catalog. Cypress 16 component testing rejects a Vite below 8, so the migration first reads the bundler of every Cypress config's `component` block, following same-file spreads and variables, and resolves `vite` from that config's directory, as Cypress does. When a Vite component testing project, or a config whose bundler cannot be read statically, resolves a Vite below 8, the workspace stays on Cypress 15 and the migration reports the command to run once Vite is on 8. It does not check a Cypress config with a custom name that no `@nx/cypress:cypress` target references, such as one run through `nx:run-commands`. A Vite that only e2e or webpack component testing projects resolve, such as a transitive Vite hoisted to the workspace root, does not hold the bump. Cypress 16 removes `Cypress.env()` (replaced by the asynchronous `cy.env()` for `env` values and `Cypress.expose()` for the new `expose` values), `cy.exec()` (use `cy.task()`) and `.end()`, drops `env` from test configuration overrides, turns the cookie and storage getters into queries, drops CoffeeScript support, and routes Chrome, Chromium and Edge through the native browser network. It requires Node 22, 24 or 26+, Vite 8 for Vite component testing, Angular 21 for Angular component testing and Next.js 15.0.4 for component testing on Cypress's `next` dev server framework, which the Nx preset does not use. Read more in the [Cypress 16 migration guide](https://docs.cypress.io/app/references/migration-guide#Migrating-to-Cypress-160).
 
-The generator-based migrations in this release update the renamed and removed config options, the `cypress/angular-zoneless` import and the `Cypress.Commands.overwrite()` calls for the new queries. The paired AI instructions migration walks an agent through the source changes that need judgment. The most common one is shown below.
+After the bump, the migration updates the renamed and removed config options, the `cypress/angular-zoneless` import and the `Cypress.Commands.overwrite()` calls for the new queries; a workspace already on Cypress 16 gets the same rewrites from their standalone migrations. The paired AI instructions walk an agent through the source changes that need judgment. The most common one is shown below.
 
 #### Examples
 

package/dist/src/plugins/plugin.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createNodesV2 = exports.createNodes = void 0;
+const tslib_1 = require("tslib");
 const internal_1 = require("@nx/devkit/internal");
 const devkit_1 = require("@nx/devkit");
 const js_1 = require("@nx/js");
 const fs_1 = require("fs");
 const path_1 = require("path");
+const posix = tslib_1.__importStar(require("node:path/posix"));
 const constants_1 = require("../utils/constants");
 const cypressConfigGlob = '**/cypress.config.{js,ts,mjs,cjs}';
 const defaultPatterns = {
@@ -76,7 +78,7 @@ async function createNodesInternal(configFilePath, options, context, pluginCache
     };
 }
 function getTargetOutputs(outputs, subfolder) {
-    return outputs.map((output) => subfolder ? (0, path_1.join)(output, subfolder) : output);
+    return outputs.map((output) => subfolder ? posix.join(output, subfolder) : output);
 }
 // Normalize a Cypress config folder (e.g. videosFolder, screenshotsFolder) to a
 // project-root-relative path, then append the per-spec subfolder. Cypress
@@ -479,13 +481,13 @@ async function getSpecFilesAndPatternsForTestType(cypressConfig, testType, works
     const specPattern = cypressConfig[testType].specPattern ??
         defaultPatterns[testType].specPattern;
     const specPatterns = Array.isArray(specPattern)
-        ? specPattern.map((p) => (0, path_1.join)(projectRoot, p))
-        : [(0, path_1.join)(projectRoot, specPattern)];
+        ? specPattern.map((p) => posix.join(projectRoot, p))
+        : [posix.join(projectRoot, specPattern)];
     const excludeSpecPattern = cypressConfig[testType].excludeSpecPattern ??
         defaultPatterns[testType].excludeSpecPattern;
     const excludeSpecPatterns = Array.isArray(excludeSpecPattern)
-        ? excludeSpecPattern.map((p) => (0, path_1.join)(projectRoot, p))
-        : [(0, path_1.join)(projectRoot, excludeSpecPattern)];
+        ? excludeSpecPattern.map((p) => posix.join(projectRoot, p))
+        : [posix.join(projectRoot, excludeSpecPattern)];
     const specFiles = await (0, internal_1.globWithWorkspaceContext)(workspaceRoot, specPatterns, excludeSpecPatterns);
     return { specFiles, specPatterns, excludeSpecPatterns };
 }

package/dist/src/utils/migrations.d.ts

@@ -1,5 +1,5 @@
 import { type ProjectConfiguration, type Tree } from '@nx/devkit';
-import type { Expression, ObjectLiteralExpression, PropertyAssignment, SourceFile } from 'typescript';
+import type { Expression, ObjectLiteralExpression, PropertyAssignment, PropertyName, SourceFile } from 'typescript';
 export declare function cypressProjectConfigs(tree: Tree): AsyncGenerator<{
     projectName: string;
     projectConfig: ProjectConfiguration;
@@ -11,6 +11,8 @@ export declare function updateObjectProperty(config: ObjectLiteralExpression, pr
     newName?: string;
     newValue?: Expression;
 }): ObjectLiteralExpression;
+export declare function getComponentTestingPresetImport(sourceFile: SourceFile): string | null;
+export declare function getPropertyName(name: PropertyName): string | null;
 export declare function parseSourceFile(filePath: string, content: string): SourceFile;
 /**
  * Whether the file binds `name` as a runtime value anywhere: a variable,

package/dist/src/utils/migrations.js

@@ -4,55 +4,78 @@ exports.cypressProjectConfigs = cypressProjectConfigs;
 exports.getObjectProperty = getObjectProperty;
 exports.removeObjectProperty = removeObjectProperty;
 exports.updateObjectProperty = updateObjectProperty;
+exports.getComponentTestingPresetImport = getComponentTestingPresetImport;
+exports.getPropertyName = getPropertyName;
 exports.parseSourceFile = parseSourceFile;
 exports.hasLocalValueBinding = hasLocalValueBinding;
 const devkit_1 = require("@nx/devkit");
-const internal_1 = require("@nx/js/internal");
+const internal_1 = require("@nx/devkit/internal");
+const internal_2 = require("@nx/js/internal");
 const path_1 = require("path");
 const config_1 = require("./config");
 let ts;
 async function* cypressProjectConfigs(tree) {
     const projects = (0, devkit_1.getProjects)(tree);
+    const targetDefaults = (0, devkit_1.readNxJson)(tree)?.targetDefaults;
     for (const [projectName, projectConfig] of projects) {
-        const targetsWithExecutor = Object.values(projectConfig.targets ?? {}).filter((target) => target.executor === '@nx/cypress:cypress');
-        if (targetsWithExecutor.length > 0) {
-            const cypressConfigPaths = new Set();
-            for (const target of targetsWithExecutor) {
-                for (const [, options] of allTargetOptions(target)) {
-                    if (options.cypressConfig) {
-                        cypressConfigPaths.add(options.cypressConfig);
-                    }
-                }
+        const cypressConfigPaths = new Set();
+        for (const [targetName, target] of Object.entries(projectConfig.targets ?? {})) {
+            if (target.command) {
+                continue;
+            }
+            const merged = (0, internal_1.mergeTargetConfigurations)(target, (0, internal_1.readTargetDefaultsForTarget)(targetName, targetDefaults, target.executor, {
+                projectName,
+                projectNode: {
+                    name: projectName,
+                    type: projectConfig.projectType === 'application' ? 'app' : 'lib',
+                    data: projectConfig,
+                },
+            }) ?? undefined);
+            if (merged.executor !== '@nx/cypress:cypress') {
+                continue;
             }
-            for (const cypressConfigPath of cypressConfigPaths) {
-                yield { projectName, projectConfig, cypressConfigPath };
+            for (const [, options] of allTargetOptions(merged)) {
+                if (options.cypressConfig) {
+                    cypressConfigPaths.add(toTreePath(tree, (0, internal_1.interpolate)(options.cypressConfig, {
+                        workspaceRoot: '.',
+                        projectRoot: projectConfig.root,
+                        projectName,
+                    })));
+                }
             }
         }
-        else {
-            // might be using the crystal plugin
+        if (cypressConfigPaths.size === 0) {
             const result = await (0, devkit_1.globAsync)(tree, [
                 path_1.posix.join(projectConfig.root, config_1.CYPRESS_CONFIG_FILE_NAME_PATTERN),
             ]);
             if (result.length > 0) {
-                yield {
-                    projectName,
-                    projectConfig,
-                    cypressConfigPath: result[0],
-                };
+                cypressConfigPaths.add(result[0]);
             }
         }
+        for (const cypressConfigPath of cypressConfigPaths) {
+            yield { projectName, projectConfig, cypressConfigPath };
+        }
     }
 }
+function toTreePath(tree, path) {
+    if (!(0, path_1.isAbsolute)(path)) {
+        return path_1.posix.normalize(path);
+    }
+    const relativePath = (0, path_1.relative)(tree.root, path);
+    return relativePath.startsWith('..') || (0, path_1.isAbsolute)(relativePath)
+        ? path
+        : (0, devkit_1.normalizePath)(relativePath);
+}
 function getObjectProperty(config, name) {
-    ts ??= (0, internal_1.ensureTypescript)();
+    ts ??= (0, internal_2.ensureTypescript)();
     return config.properties.find((p) => ts.isPropertyAssignment(p) && p.name.getText() === name);
 }
 function removeObjectProperty(config, property) {
-    ts ??= (0, internal_1.ensureTypescript)();
+    ts ??= (0, internal_2.ensureTypescript)();
     return ts.factory.updateObjectLiteralExpression(config, config.properties.filter((p) => p !== property));
 }
 function updateObjectProperty(config, property, { newName, newValue }) {
-    ts ??= (0, internal_1.ensureTypescript)();
+    ts ??= (0, internal_2.ensureTypescript)();
     if (!newName && !newValue) {
         throw new Error('newName or newValue must be provided');
     }
@@ -60,6 +83,57 @@ function updateObjectProperty(config, property, { newName, newValue }) {
         ? ts.factory.updatePropertyAssignment(p, newName ? ts.factory.createIdentifier(newName) : p.name, newValue ? newValue : p.initializer)
         : p));
 }
+// Resolves the module specifier that binds the `nxComponentTestingPreset`
+// identifier in a cypress config, covering both ESM `import` and CJS
+// `require` forms. Returns null when no such binding is found.
+function getComponentTestingPresetImport(sourceFile) {
+    ts ??= (0, internal_2.ensureTypescript)();
+    for (const statement of sourceFile.statements) {
+        if (ts.isImportDeclaration(statement) && statement.importClause) {
+            const namedBindings = statement.importClause.namedBindings;
+            if (namedBindings &&
+                ts.isNamedImports(namedBindings) &&
+                ts.isStringLiteral(statement.moduleSpecifier) &&
+                namedBindings.elements.some((element) => element.name.text === 'nxComponentTestingPreset')) {
+                return statement.moduleSpecifier.text;
+            }
+        }
+        if (ts.isVariableStatement(statement)) {
+            for (const declaration of statement.declarationList.declarations) {
+                const initializer = declaration.initializer;
+                if (!initializer ||
+                    !ts.isCallExpression(initializer) ||
+                    !ts.isIdentifier(initializer.expression) ||
+                    initializer.expression.text !== 'require' ||
+                    !ts.isObjectBindingPattern(declaration.name)) {
+                    continue;
+                }
+                const moduleSpecifier = initializer.arguments[0];
+                if (moduleSpecifier &&
+                    ts.isStringLiteral(moduleSpecifier) &&
+                    declaration.name.elements.some((element) => ts.isIdentifier(element.name) &&
+                        element.name.text === 'nxComponentTestingPreset')) {
+                    return moduleSpecifier.text;
+                }
+            }
+        }
+    }
+    return null;
+}
+// Returns null for a computed name that is not a string literal.
+function getPropertyName(name) {
+    ts ??= (0, internal_2.ensureTypescript)();
+    if (ts.isIdentifier(name) || isStringLiteralName(name)) {
+        return name.text;
+    }
+    if (ts.isComputedPropertyName(name) && isStringLiteralName(name.expression)) {
+        return name.expression.text;
+    }
+    return null;
+}
+function isStringLiteralName(node) {
+    return ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node);
+}
 function* allTargetOptions(target) {
     if (target.options) {
         yield [undefined, target.options];
@@ -76,7 +150,7 @@ function* allTargetOptions(target) {
 // The extension picks the script kind, so `<T>x` in a .ts file and JSX in a
 // .tsx file both parse; tsquery's `ast()` parses everything as TSX.
 function parseSourceFile(filePath, content) {
-    ts ??= (0, internal_1.ensureTypescript)();
+    ts ??= (0, internal_2.ensureTypescript)();
     return ts.createSourceFile(filePath, content, ts.ScriptTarget.Latest, 
     /* setParentNodes */ true);
 }
@@ -91,7 +165,7 @@ function parseSourceFile(filePath, content) {
  * `Cypress` global.
  */
 function hasLocalValueBinding(sourceFile, name) {
-    ts ??= (0, internal_1.ensureTypescript)();
+    ts ??= (0, internal_2.ensureTypescript)();
     if (sourceFile.isDeclarationFile) {
         return false;
     }

package/migrations.json

@@ -63,7 +63,7 @@
       "documentation": "./dist/src/migrations/update-23-1-0/disable-webpack-ct-just-in-time-compile.md"
     },
     "update-cypress-16-config-options": {
-      "version": "23.3.0-beta.1",
+      "version": "23.3.0-beta.8",
       "requires": {
         "cypress": ">=16.0.0"
       },
@@ -72,7 +72,7 @@
       "documentation": "./dist/src/migrations/update-23-3-0/update-cypress-16-config-options.md"
     },
     "update-cypress-16-query-command-overwrites": {
-      "version": "23.3.0-beta.1",
+      "version": "23.3.0-beta.8",
       "requires": {
         "cypress": ">=16.0.0"
       },
@@ -82,7 +82,7 @@
       "documentation": "./dist/src/migrations/update-23-3-0/update-cypress-16-query-command-overwrites.md"
     },
     "update-angular-zoneless-mount-import": {
-      "version": "23.3.0-beta.1",
+      "version": "23.3.0-beta.8",
       "requires": {
         "cypress": ">=16.0.0"
       },
@@ -91,13 +91,23 @@
       "documentation": "./dist/src/migrations/update-23-3-0/update-angular-zoneless-mount-import.md"
     },
     "create-ai-instructions-for-cypress-16": {
-      "version": "23.3.0-beta.1",
+      "version": "23.3.0-beta.8",
       "requires": {
         "cypress": ">=16.0.0"
       },
       "description": "AI-assisted migration: replaces `Cypress.env()`, `cy.exec()`, `.end()`, `env` test-configuration overrides and runtime `Cypress.config()` writes removed in Cypress 16, whose replacements depend on where each value comes from, so it is driven by an AI prompt rather than a deterministic generator.",
       "prompt": "./dist/src/migrations/update-23-3-0/ai-instructions-for-cypress-16.md",
       "documentation": "./dist/src/migrations/update-23-3-0/upgrade-to-cypress-16.md"
+    },
+    "upgrade-to-cypress-16": {
+      "version": "23.3.0-beta.8",
+      "requires": {
+        "cypress": ">=15.0.0 <16.0.0"
+      },
+      "description": "Moves a Cypress 15 workspace to Cypress 16: bumps `cypress` and the declared `@cypress/*-dev-server` packages unless a Vite component testing config, or a config whose bundler cannot be determined statically, resolves a Vite below 8, applies the Cypress 16 config option, `overwriteQuery` and `cypress/angular` rewrites, and hands the remaining source changes to an AI prompt.",
+      "implementation": "./dist/src/migrations/update-23-3-0/upgrade-to-cypress-16",
+      "prompt": "./dist/src/migrations/update-23-3-0/ai-instructions-for-cypress-16.md",
+      "documentation": "./dist/src/migrations/update-23-3-0/upgrade-to-cypress-16.md"
     }
   },
   "packageJsonUpdates": {
@@ -197,29 +207,6 @@
           "alwaysAddToPackageJson": false
         }
       }
-    },
-    "23.3.0-cypress-16": {
-      "version": "23.3.0-beta.1",
-      "requires": {
-        "cypress": ">=15.0.0 <16.0.0"
-      },
-      "incompatibleWith": {
-        "vite": "<8.0.0"
-      },
-      "packages": {
-        "cypress": {
-          "version": "^16.0.0",
-          "alwaysAddToPackageJson": false
-        },
-        "@cypress/vite-dev-server": {
-          "version": "^8.0.0",
-          "alwaysAddToPackageJson": false
-        },
-        "@cypress/webpack-dev-server": {
-          "version": "^6.0.0",
-          "alwaysAddToPackageJson": false
-        }
-      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/cypress",
-  "version": "23.3.0-beta.7",
+  "version": "23.3.0-beta.9",
   "private": false,
   "type": "commonjs",
   "files": [
@@ -84,9 +84,9 @@
     "supportsOptionalMigrations": true
   },
   "dependencies": {
-    "@nx/devkit": "23.3.0-beta.7",
-    "@nx/eslint": "23.3.0-beta.7",
-    "@nx/js": "23.3.0-beta.7",
+    "@nx/devkit": "23.3.0-beta.9",
+    "@nx/eslint": "23.3.0-beta.9",
+    "@nx/js": "23.3.0-beta.9",
     "@phenomnomnominal/tsquery": "~6.2.0",
     "detect-port": "^2.1.0",
     "semver": "^7.6.3",
@@ -94,7 +94,7 @@
     "tslib": "^2.3.0"
   },
   "devDependencies": {
-    "nx": "23.3.0-beta.7"
+    "nx": "23.3.0-beta.9"
   },
   "peerDependencies": {
     "cypress": ">= 13 < 17"