diff --git a/cli/types/cypress.d.ts b/cli/types/cypress.d.ts
index d4062d9681..de8f85ae1a 100644
--- a/cli/types/cypress.d.ts
+++ b/cli/types/cypress.d.ts
@@ -3047,7 +3047,7 @@ declare namespace Cypress {
 
   type PickConfigOpt<T> = T extends keyof DefineDevServerConfig ? DefineDevServerConfig[T] : any
 
-  type ProjectConfig = {
+  type AngularDevServerProjectConfig = {
     root: string,
     sourceRoot: string,
     buildOptions: Record<string, any>
@@ -3068,7 +3068,7 @@ declare namespace Cypress {
     framework: 'angular',
     webpackConfig?: PickConfigOpt<'webpackConfig'>,
     options?: {
-      projectConfig: ProjectConfig
+      projectConfig: AngularDevServerProjectConfig
     }
   }
 
diff --git a/npm/webpack-dev-server/src/devServer.ts b/npm/webpack-dev-server/src/devServer.ts
index ebf9eb4569..7c68700a70 100644
--- a/npm/webpack-dev-server/src/devServer.ts
+++ b/npm/webpack-dev-server/src/devServer.ts
@@ -25,7 +25,7 @@ export type WebpackDevServerConfig = {
   framework?: typeof ALL_FRAMEWORKS[number] // Add frameworks here as we implement
   webpackConfig?: unknown // Derived from the user's webpack
   options?: {
-    projectConfig?: Cypress.ProjectConfig
+    projectConfig?: Cypress.AngularDevServerProjectConfig
   }
 }
 
diff --git a/npm/webpack-dev-server/src/helpers/angularHandler.ts b/npm/webpack-dev-server/src/helpers/angularHandler.ts
index d56b69c053..2619f1b8fd 100644
--- a/npm/webpack-dev-server/src/helpers/angularHandler.ts
+++ b/npm/webpack-dev-server/src/helpers/angularHandler.ts
@@ -13,8 +13,6 @@ type Configurations = {
   }
 }
 
-export type MyType = Extract<Cypress.DevServerConfigOptions, { framework: 'angular'}>
-
 export type AngularJsonProjectConfig = {
   projectType: string
   root: string
@@ -33,7 +31,7 @@ type AngularJson = {
 
 const dynamicImport = new Function('specifier', 'return import(specifier)')
 
-async function getProjectConfig (projectRoot: string): Promise<Cypress.ProjectConfig> {
+async function getProjectConfig (projectRoot: string): Promise<Cypress.AngularDevServerProjectConfig> {
   const angularJson = await getAngularJson(projectRoot)
 
   let { defaultProject } = angularJson
@@ -199,7 +197,7 @@ export async function getAngularJson (projectRoot: string): Promise<AngularJson>
   return JSON.parse(angularJson)
 }
 
-function createFakeContext (projectRoot: string, defaultProjectConfig: Cypress.ProjectConfig) {
+function createFakeContext (projectRoot: string, defaultProjectConfig: Cypress.AngularDevServerProjectConfig) {
   const logger = {
     createChild: () => ({}),
   }
diff --git a/system-tests/projects/angular-custom-config/src/app/my-component.cy.ts b/system-tests/projects/angular-custom-config/src/app/my-component.cy.ts
index 01c5c548bc..6465f17c66 100644
--- a/system-tests/projects/angular-custom-config/src/app/my-component.cy.ts
+++ b/system-tests/projects/angular-custom-config/src/app/my-component.cy.ts
@@ -3,6 +3,9 @@ import { MyComponent } from './my-component'
 describe('MyComponent', () => {
   it('should mount with an h1 tag with a class of very-red', () => {
     cy.mount(MyComponent)
+    // Proves out the Angular specific `projectConfig` option. The global styles in `custom-styles.scss` would not normally be applied with how this project's `angular.json`
+    // is configured. By utilizing the `projectConfig` option in `component.devServer.options`, we can change the
+    // build options to allow this global style to be loaded
     cy.get('h1').should('have.css', 'color', 'rgb(255, 0, 0)')
   })
 })
diff --git a/system-tests/test/component_testing_spec.ts b/system-tests/test/component_testing_spec.ts
index 355781b8fe..8f29b1c82b 100644
--- a/system-tests/test/component_testing_spec.ts
+++ b/system-tests/test/component_testing_spec.ts
@@ -124,7 +124,7 @@ describe(`Angular CLI major versions`, () => {
     })
   }
 
-  systemTests.it('angular 14 custom config with mount tests', {
+  systemTests.it('angular 14 custom config', {
     project: 'angular-custom-config',
     spec: 'src/app/my-component.cy.ts',
     testingType: 'component',