Skip to content

Commit 94e78eb

Browse files
authored
feat: enable Angular CT support (#23089)
1 parent f73810d commit 94e78eb

File tree

14 files changed

+47
-46
lines changed

14 files changed

+47
-46
lines changed

cli/package.json

+7-1
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,8 @@
107107
"vue",
108108
"react",
109109
"vue2",
110-
"react18"
110+
"react18",
111+
"angular"
111112
],
112113
"bin": {
113114
"cypress": "bin/cypress"
@@ -149,6 +150,11 @@
149150
"./mount-utils": {
150151
"require": "./mount-utils/dist/index.js",
151152
"types": "./mount-utils/dist/index.d.ts"
153+
},
154+
"./angular": {
155+
"import": "./angular/dist/index.js",
156+
"require": "./angular/dist/index.js",
157+
"types": "./angular/dist/index.d.ts"
152158
}
153159
},
154160
"workspaces": {

cli/scripts/post-build.js

+1
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ const npmModulesToCopy = [
1212
'react18',
1313
'vue',
1414
'vue2',
15+
'angular',
1516
]
1617

1718
npmModulesToCopy.forEach((folder) => {

cli/types/cypress.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -3044,7 +3044,7 @@ declare namespace Cypress {
30443044

30453045
type DevServerConfigOptions = {
30463046
bundler: 'webpack'
3047-
framework: 'react' | 'vue' | 'vue-cli' | 'nuxt' | 'create-react-app' | 'next'
3047+
framework: 'react' | 'vue' | 'vue-cli' | 'nuxt' | 'create-react-app' | 'next' | 'angular'
30483048
webpackConfig?: PickConfigOpt<'webpackConfig'>
30493049
} | {
30503050
bundler: 'vite'

npm/angular/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
"scripts": {
77
"prebuild": "rimraf dist",
88
"build": "tsc || echo 'built, with type errors'",
9+
"postbuild": "node ../../scripts/sync-exported-npm-with-cli.js",
910
"build-prod": "yarn build",
1011
"check-ts": "tsc --noEmit"
1112
},

npm/webpack-dev-server/cypress/e2e/angular.cy.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,7 @@ for (const project of WEBPACK_REACT) {
1212
continue
1313
}
1414

15-
// TODO: revert once Angular is slated for release
16-
describe.skip(`Working with ${project}`, () => {
15+
describe(`Working with ${project}`, () => {
1716
beforeEach(() => {
1817
cy.scaffoldProject(project)
1918
cy.openProject(project)

npm/webpack-dev-server/src/devServer.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import { nuxtHandler } from './helpers/nuxtHandler'
1212
import { createReactAppHandler } from './helpers/createReactAppHandler'
1313
import { nextHandler } from './helpers/nextHandler'
1414
import { sourceDefaultWebpackDependencies, SourceRelativeWebpackResult } from './helpers/sourceRelativeWebpackModules'
15+
import { angularHandler } from './helpers/angularHandler'
1516

1617
const debug = debugLib('cypress:webpack-dev-server:devServer')
1718

@@ -25,7 +26,7 @@ export type WebpackDevServerConfig = {
2526
webpackConfig?: unknown // Derived from the user's webpack
2627
}
2728

28-
export const ALL_FRAMEWORKS = ['create-react-app', 'nuxt', 'react', 'vue-cli', 'next', 'vue'] as const
29+
export const ALL_FRAMEWORKS = ['create-react-app', 'nuxt', 'react', 'vue-cli', 'next', 'vue', 'angular'] as const
2930

3031
/**
3132
* @internal
@@ -115,9 +116,8 @@ async function getPreset (devServerConfig: WebpackDevServerConfig): Promise<Opti
115116
case 'next':
116117
return await nextHandler(devServerConfig)
117118

118-
// TODO: revert once Angular is slated for release
119-
// case 'angular':
120-
// return await angularHandler(devServerConfig)
119+
case 'angular':
120+
return await angularHandler(devServerConfig)
121121

122122
case 'react':
123123
case 'vue':

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

+1-2
Original file line numberDiff line numberDiff line change
@@ -65,8 +65,7 @@ const frameworkWebpackMapper: FrameworkWebpackMapper = {
6565
react: undefined,
6666
vue: undefined,
6767
next: 'next',
68-
// TODO: revert once Angular is slated for release
69-
// 'angular': '@angular-devkit/build-angular',
68+
'angular': '@angular-devkit/build-angular',
7069
}
7170

7271
// Source the users framework from the provided projectRoot. The framework, if available, will serve

npm/webpack-dev-server/src/makeDefaultWebpackConfig.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,8 @@ export function makeDefaultWebpackConfig (
3838
plugins: [
3939
new HtmlWebpackPlugin({
4040
template: indexHtmlFile,
41-
// TODO: revert once Angular is slated for release
4241
// Angular generates all of it's scripts with <script type="module">. Live-reloading breaks without this option.
43-
// ...(config.devServerConfig.framework === 'angular' ? { scriptLoading: 'module' } : {}),
42+
...(config.devServerConfig.framework === 'angular' ? { scriptLoading: 'module' } : {}),
4443
}),
4544
],
4645
} as any

npm/webpack-dev-server/test/handlers/angularHandler.spec.ts

+3-4
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,7 @@ const projectConfig: AngularJsonProjectConfig = {
4040
},
4141
}
4242

43-
// TODO: revert once Angular is slated for release
44-
describe.skip('angularHandler', function () {
43+
describe('angularHandler', function () {
4544
this.timeout(1000 * 60)
4645

4746
it('sources the config from angular-13', async () => {
@@ -54,7 +53,7 @@ describe.skip('angularHandler', function () {
5453
projectRoot,
5554
specPattern: 'src/**/*.cy.ts',
5655
} as Cypress.PluginConfigOptions,
57-
// framework: 'angular',
56+
framework: 'angular',
5857
} as WebpackDevServerConfig
5958

6059
const { frameworkConfig: webpackConfig, sourceWebpackModulesResult } = await angularHandler(devServerConfig)
@@ -79,7 +78,7 @@ describe.skip('angularHandler', function () {
7978
projectRoot,
8079
specPattern: 'src/**/*.cy.ts',
8180
} as Cypress.PluginConfigOptions,
82-
// framework: 'angular',
81+
framework: 'angular',
8382
} as WebpackDevServerConfig
8483

8584
const { frameworkConfig: webpackConfig, sourceWebpackModulesResult } = await angularHandler(devServerConfig)

packages/graphql/schemas/schema.graphql

+1
Original file line numberDiff line numberDiff line change
@@ -871,6 +871,7 @@ type FileParts implements Node {
871871
}
872872

873873
enum FrontendFrameworkEnum {
874+
angular
874875
nextjs
875876
nuxtjs
876877
react

packages/launchpad/cypress/e2e/scaffold-component-testing.cy.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -108,8 +108,7 @@ describe('scaffolding component testing', {
108108
})
109109
})
110110

111-
// TODO: revert once Angular is slated for release
112-
context.skip('angular-cli-unconfigured', () => {
111+
context('angular-cli-unconfigured', () => {
113112
it('scaffolds component testing for Angular', () => {
114113
startSetupFor('angular-cli-unconfigured')
115114

packages/launchpad/src/utils/icons.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import LogoNext from '../images/logos/nextjs.svg'
44
import LogoNuxt from '../images/logos/nuxt.svg'
55
import LogoVue from '../images/logos/vue.svg'
66
import LogoReact from '../images/logos/react.svg'
7-
// import LogoAngular from '../images/logos/angular.svg'
7+
import LogoAngular from '../images/logos/angular.svg'
88

99
import type { FrontendFrameworkEnum, SupportedBundlers } from '../generated/graphql'
1010

@@ -19,6 +19,5 @@ export const FrameworkBundlerLogos: Record<FrontendFrameworkEnum | SupportedBund
1919
nuxtjs: LogoNuxt,
2020
react: LogoReact,
2121
reactscripts: LogoReact,
22-
// TODO: revert once Angular is slated for release
23-
// angular: LogoAngular,
22+
angular: LogoAngular,
2423
}

packages/scaffold-config/src/frameworks.ts

+22-23
Original file line numberDiff line numberDiff line change
@@ -219,27 +219,26 @@ export const WIZARD_FRAMEWORKS = [
219219
supportStatus: 'full',
220220
componentIndexHtml: componentIndexHtmlGenerator(),
221221
},
222-
// TODO: revert once Angular is slated for release
223-
// {
224-
// type: 'angular',
225-
// configFramework: 'angular',
226-
// category: 'template',
227-
// name: 'Angular',
228-
// detectors: [dependencies.WIZARD_DEPENDENCY_ANGULAR_CLI],
229-
// supportedBundlers: [dependencies.WIZARD_DEPENDENCY_WEBPACK],
230-
// dependencies: (bundler: WizardBundler['type'], projectPath: string): DependencyToInstall[] => {
231-
// return [
232-
// isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_CLI, projectPath),
233-
// isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_DEVKIT_BUILD_ANGULAR, projectPath),
234-
// isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_CORE, projectPath),
235-
// isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_COMMON, projectPath),
236-
// isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_PLATFORM_BROWSER_DYNAMIC, projectPath),
237-
// ]
238-
// },
239-
// codeGenFramework: 'angular',
240-
// mountModule: 'cypress/angular',
241-
// supportStatus: 'full',
242-
// componentIndexHtml: componentIndexHtmlGenerator(),
243-
// specPattern: '**/*.cy.ts',
244-
// },
222+
{
223+
type: 'angular',
224+
configFramework: 'angular',
225+
category: 'template',
226+
name: 'Angular',
227+
detectors: [dependencies.WIZARD_DEPENDENCY_ANGULAR_CLI],
228+
supportedBundlers: [dependencies.WIZARD_DEPENDENCY_WEBPACK],
229+
dependencies: (bundler: WizardBundler['type'], projectPath: string): Promise<DependencyToInstall[]> => {
230+
return Promise.all([
231+
isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_CLI, projectPath),
232+
isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_DEVKIT_BUILD_ANGULAR, projectPath),
233+
isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_CORE, projectPath),
234+
isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_COMMON, projectPath),
235+
isDependencyInstalled(dependencies.WIZARD_DEPENDENCY_ANGULAR_PLATFORM_BROWSER_DYNAMIC, projectPath),
236+
])
237+
},
238+
codeGenFramework: 'angular',
239+
mountModule: 'cypress/angular',
240+
supportStatus: 'full',
241+
componentIndexHtml: componentIndexHtmlGenerator(),
242+
specPattern: '**/*.cy.ts',
243+
},
245244
] as const

packages/scaffold-config/test/unit/detect.spec.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -205,8 +205,7 @@ describe('detectFramework', () => {
205205
})
206206

207207
;['13.0.0', '14.0.0'].forEach((v) => {
208-
// TODO: revert once Angular is slated for release
209-
it.skip(`Angular CLI v${v}`, async () => {
208+
it(`Angular CLI v${v}`, async () => {
210209
const projectPath = await scaffoldMigrationProject('angular-cli-unconfigured')
211210

212211
fakeDepsInNodeModules(projectPath, [

0 commit comments

Comments
 (0)