fix(testing): move webpack and vite to optional peer dep (#29800)

@nx/webpack and @nx/vite are used for a single migration but pollute the
overall dep size of someone using @nx/playwright without both vite and
webpack. This change allows users to only install the one stack they are
using.

packages/playwright/package.json

@@ -37,18 +37,24 @@
     "@phenomnomnominal/tsquery": "~5.0.1",
     "@nx/devkit": "file:../devkit",
     "@nx/eslint": "file:../eslint",
-    "@nx/webpack": "file:../webpack",
-    "@nx/vite": "file:../vite",
     "@nx/js": "file:../js",
     "tslib": "^2.3.0",
     "minimatch": "9.0.3"
   },
   "peerDependencies": {
-    "@playwright/test": "^1.36.0"
+    "@playwright/test": "^1.36.0",
+    "@nx/webpack": "file:../webpack",
+    "@nx/vite": "file:../vite"
   },
   "peerDependenciesMeta": {
     "@playwright/test": {
       "optional": true
+    },
+    "@nx/webpack": {
+      "optional": true
+    },
+    "@nx/vite": {
+      "optional": true
     }
   },
   "executors": "./executors.json",

packages/playwright/src/migrations/update-19-6-0/use-serve-static-preview-for-command.ts

@@ -15,8 +15,6 @@ import type { ConfigurationResult } from 'nx/src/project-graph/utils/project-con
 import { LoadedNxPlugin } from 'nx/src/project-graph/plugins/loaded-nx-plugin';
 import { retrieveProjectConfigurations } from 'nx/src/project-graph/utils/retrieve-workspace-files';
 import { ProjectConfigurationsError } from 'nx/src/project-graph/error-types';
-import { createNodesV2 as webpackCreateNodesV2 } from '@nx/webpack/src/plugins/plugin';
-import { createNodesV2 as viteCreateNodesV2 } from '@nx/vite/plugin';
 import type { Node } from 'typescript';
 
 export default async function (tree: Tree) {
@@ -129,8 +127,20 @@ export default async function (tree: Tree) {
           ? 'serveStaticTargetName'
           : 'previewTargetName',
         projectToMigrate.configFileType === 'webpack'
-          ? webpackCreateNodesV2
+          ? (
-          : viteCreateNodesV2
+              await getDynamicImportedModule<
+                typeof import('@nx/webpack/src/plugins/plugin')
+              >(
+                '@nx/webpack/src/plugins/plugin',
+                '@nx/webpack should be installed when attempting to setup @nx/playwright with a webpack config file.'
+              )
+            ).createNodesV2
+          : (
+              await getDynamicImportedModule<typeof import('@nx/vite/plugin')>(
+                '@nx/vite/plugin',
+                '@nx/vite should be installed when attempting to setup @nx/playwright with a vite config file.'
+              )
+            ).createNodesV2
       )) ??
       getServeStaticLikeTarget(
         tree,
@@ -236,6 +246,14 @@ export default async function (tree: Tree) {
   await formatFiles(tree);
 }
 
+async function getDynamicImportedModule<T>(moduleName: string, error: string) {
+  try {
+    return (await import(moduleName)) as T;
+  } catch {
+    throw new Error(error);
+  }
+}
+
 async function getServeStaticTargetNameForConfigFile<T>(
   tree: Tree,
   pluginName: string,