fix: make sure angular project configs can resolve correctly on windows (#32971)

Author: AtofStryker

.circleci/src/pipeline/@pipeline.yml

@@ -121,7 +121,7 @@ commands:
           name: Set environment variable to determine whether or not to persist artifacts
           command: |
             echo "Setting SHOULD_PERSIST_ARTIFACTS variable"
-            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "feat/support_next_16" ]]; then
+            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "fix/angular_dep_resolution_windows" ]]; then
                 export SHOULD_PERSIST_ARTIFACTS=true
             fi' >> "$BASH_ENV"
   # You must run `setup_should_persist_artifacts` command and be using bash before running this command

.circleci/src/pipeline/workflows/@main.yml

@@ -4,7 +4,7 @@ linux-x64:
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'feat/support_next_16', << pipeline.git.branch >> ]
+      - equal: [ 'fix/angular_dep_resolution_windows', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>

npm/webpack-dev-server/src/helpers/angularHandler.ts

@@ -1,5 +1,5 @@
 import * as fs from 'fs-extra'
-import { tmpdir } from 'os'
+import { tmpdir, platform } from 'os'
 import * as path from 'path'
 import type { Configuration, RuleSetRule } from 'webpack'
 import type { PresetHandlerResult, WebpackDevServerConfig } from '../devServer'
@@ -183,12 +183,15 @@ export async function getAngularCliModules (projectRoot: string) {
     { logging },
   ] = await Promise.all(angularCLiModules.map(async (dep) => {
     try {
-      const depPath = require.resolve(dep, { paths: [projectRoot] })
+      let depPath = require.resolve(dep, { paths: [projectRoot] })
       // NOTE: @cypress/webpack-dev-server is a CJS package, but we need to import some ESM files and absolute imports.
       // since import statements in TypeScript will get transpiled down to CommonJS require statements, we want to use tsx to leverage
       // an ESM style import here, which supports CommonJS and ESM.
       const { tsImport } = require('tsx/esm/api')
 
+      // NOTE: on Windows, fully qualified paths (ex: C:\Users\username\project\blah) need to be prefixed with `file://` to be properly resolved.
+      depPath = platform() === 'win32' ? `file://${toPosix(depPath)}` : depPath
+
       const module = await tsImport(depPath, __filename)
 
       return module