cypress: add @cypress/schematic for angular

mshima · Dec 12, 2024 · 3b90e5e · 3b90e5e
1 parent 8c6f863
commit 3b90e5e
Show file tree

Hide file tree

Showing 5 changed files with 100 additions and 21 deletions.
diff --git a/generators/app/__snapshots__/generator.spec.ts.snap b/generators/app/__snapshots__/generator.spec.ts.snap
@@ -650,6 +650,7 @@ exports[`generator - app with default config should match snapshot 1`] = `
     "@angular/cli": "ANGULAR_CLI_VERSION",
     "@angular/common": "ANGULAR_COMMON_VERSION",
     "@cypress/code-coverage": "CYPRESS_CODE_COVERAGE_VERSION",
+    "@cypress/schematic": "CYPRESS_SCHEMATIC_VERSION",
     "@eslint/js": "ESLINT_JS_VERSION",
     "@fortawesome/angular-fontawesome": "FORTAWESOME_ANGULAR_FONTAWESOME_VERSION",
     "@fortawesome/fontawesome-svg-core": "FORTAWESOME_FONTAWESOME_SVG_CORE_VERSION",
@@ -1312,6 +1313,7 @@ exports[`generator - app with gateway should match snapshot 1`] = `
     "@angular/cli": "ANGULAR_CLI_VERSION",
     "@angular/common": "ANGULAR_COMMON_VERSION",
     "@cypress/code-coverage": "CYPRESS_CODE_COVERAGE_VERSION",
+    "@cypress/schematic": "CYPRESS_SCHEMATIC_VERSION",
     "@eslint/js": "ESLINT_JS_VERSION",
     "@fortawesome/angular-fontawesome": "FORTAWESOME_ANGULAR_FONTAWESOME_VERSION",
     "@fortawesome/fontawesome-svg-core": "FORTAWESOME_FONTAWESOME_SVG_CORE_VERSION",

diff --git a/generators/client/resources/package.json b/generators/client/resources/package.json
@@ -4,6 +4,7 @@
   },
   "devDependencies": {
     "@cypress/code-coverage": "3.13.9",
+    "@cypress/schematic": "2.5.1",
     "babel-loader": "9.2.1",
     "babel-plugin-istanbul": "7.0.0",
     "cypress": "13.16.1",

diff --git a/generators/cypress/__snapshots__/generator.spec.ts.snap b/generators/cypress/__snapshots__/generator.spec.ts.snap
@@ -8,6 +8,9 @@ exports[`generator - cypress jwt-cypressAudit(false)-angular-withAdminUi(false)-
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "clientRoot/angular.json": {
+    "stateCleared": "modified",
+  },
   "clientRoot/cypress.config.ts": {
     "stateCleared": "modified",
   },
@@ -68,6 +71,9 @@ exports[`generator - cypress jwt-cypressAudit(false)-angular-withAdminUi(false)-
   "clientRoot/test/cypress/tsconfig.json": {
     "stateCleared": "modified",
   },
+  "package.json": {
+    "stateCleared": "modified",
+  },
 }
 `;
 
@@ -145,6 +151,9 @@ exports[`generator - cypress jwt-cypressAudit(true)-vue-withAdminUi(true)-cypres
   "clientRoot/test/cypress/tsconfig.json": {
     "stateCleared": "modified",
   },
+  "package.json": {
+    "stateCleared": "modified",
+  },
 }
 `;
 
@@ -156,6 +165,9 @@ exports[`generator - cypress oauth2-cypressAudit(false)-angular-withAdminUi(fals
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "angular.json": {
+    "stateCleared": "modified",
+  },
   "cypress.config.ts": {
     "stateCleared": "modified",
   },
@@ -342,6 +354,9 @@ exports[`generator - cypress session-cypressAudit(false)-angular-withAdminUi(fal
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "angular.json": {
+    "stateCleared": "modified",
+  },
   "cypress.config.ts": {
     "stateCleared": "modified",
   },

diff --git a/generators/cypress/generator.ts b/generators/cypress/generator.ts
@@ -27,6 +27,8 @@ import { cypressEntityFiles, cypressFiles } from './files.js';
 
 const { ANGULAR } = clientFrameworkTypes;
 
+const WAIT_TIMEOUT = 3 * 60000;
+
 export default class CypressGenerator extends BaseApplicationGenerator {
   async beforeQueue() {
     if (!this.fromBlueprint) {
@@ -188,18 +190,32 @@ export default class CypressGenerator extends BaseApplicationGenerator {
       },
 
       configure({ application }) {
+        const { clientFrameworkAngular, devServerPort, devServerPortProxy: devServerPortE2e = devServerPort } = application;
+
         const clientPackageJson = this.createStorage(this.destinationPath(application.clientRootDir!, 'package.json'));
         clientPackageJson.merge({
           devDependencies: {
             'eslint-plugin-cypress': application.nodeDependencies['eslint-plugin-cypress'],
           },
           scripts: {
-            e2e: 'npm run e2e:cypress:headed --',
-            'e2e:headless': 'npm run e2e:cypress --',
-            'e2e:cypress:headed': 'npm run e2e:cypress -- --headed',
+            'ci:e2e:run': 'concurrently -k -s first -n application,e2e -c red,blue npm:ci:e2e:server:start npm:e2e:headless',
+            'ci:e2e:dev': `concurrently -k -s first -n application,e2e -c red,blue npm:app:start npm:e2e:headless`,
+            cypress: 'cypress open --e2e',
             'e2e:cypress': 'cypress run --e2e --browser chrome',
+            'e2e:cypress:headed': 'npm run e2e:cypress -- --headed',
             'e2e:cypress:record': 'npm run e2e:cypress -- --record',
-            cypress: 'cypress open --e2e',
+            'e2e:dev': `concurrently -k -s first -n application,e2e -c red,blue npm:app:start npm:e2e`,
+            'pree2e:headless': 'npm run ci:server:await',
+            'e2e:headless': 'npm run e2e:cypress --',
+            ...(clientFrameworkAngular
+              ? {
+                  e2e: 'ng e2e',
+                  'e2e:devserver': `concurrently -k -s first -n backend,e2e -c red,blue npm:backend:start npm:start npm:e2e`,
+                }
+              : {
+                  e2e: 'npm run e2e:cypress:headed --',
+                  'e2e:devserver': `concurrently -k -s first -n backend,frontend,e2e -c red,yellow,blue npm:backend:start npm:start "wait-on -t ${WAIT_TIMEOUT} http-get://127.0.0.1:${devServerPortE2e} && npm run e2e:headless -- -c baseUrl=http://localhost:${devServerPortE2e}"`,
+                }),
           },
         });
       },
@@ -220,7 +236,7 @@ export default class CypressGenerator extends BaseApplicationGenerator {
         });
       },
       configureCoverage({ application, source }) {
-        const { cypressCoverage, clientFrameworkAngular, dasherizedBaseName } = application;
+        const { cypressCoverage, clientFrameworkAngular, clientRootDir, dasherizedBaseName } = application;
         if (!cypressCoverage) return;
         const clientPackageJson = this.createStorage(this.destinationPath(application.clientRootDir!, 'package.json'));
         clientPackageJson.merge({
@@ -241,7 +257,10 @@ export default class CypressGenerator extends BaseApplicationGenerator {
         });
         if (clientFrameworkAngular) {
           // Add 'ng build --configuration instrumenter' support
-          this.createStorage('angular.json').setPath(`projects.${dasherizedBaseName}.architect.build.configurations.instrumenter`, {});
+          this.createStorage(`${clientRootDir}angular.json`).setPath(
+            `projects.${dasherizedBaseName}.architect.build.configurations.instrumenter`,
+            {},
+          );
           source.addWebpackConfig?.({
             config: `targetOptions.configuration === 'instrumenter'
       ? {
@@ -268,6 +287,61 @@ export default class CypressGenerator extends BaseApplicationGenerator {
           });
         }
       },
+      cypressSchematics({ application, source }) {
+        const { clientFrameworkAngular, dasherizedBaseName, cypressCoverage, clientRootDir } = application;
+        if (!clientFrameworkAngular) return;
+
+        source.mergeClientPackageJson?.({
+          devDependencies: {
+            '@cypress/schematic': null,
+          },
+        });
+        this.mergeDestinationJson(`${clientRootDir}angular.json`, {
+          projects: {
+            [application.dasherizedBaseName]: {
+              e2e: {
+                builder: '@cypress/schematic:cypress',
+                options: {
+                  devServerTarget: `${dasherizedBaseName}:serve`,
+                  watch: false,
+                  headed: true,
+                  browser: 'chrome',
+                },
+                configurations: {
+                  production: {
+                    devServerTarget: `${dasherizedBaseName}:serve:production`,
+                  },
+                },
+              },
+              'cypress-headless': {
+                builder: '@cypress/schematic:cypress',
+                options: {
+                  devServerTarget: `${dasherizedBaseName}:serve`,
+                  browser: 'chrome',
+                },
+                configurations: {
+                  production: {
+                    devServerTarget: `${dasherizedBaseName}:serve:production`,
+                  },
+                },
+              },
+              'cypress-open': {
+                builder: '@cypress/schematic:cypress',
+                options: {
+                  devServerTarget: `${dasherizedBaseName}:serve`,
+                  watch: true,
+                  headless: false,
+                },
+                configurations: {
+                  production: {
+                    devServerTarget: `${dasherizedBaseName}:serve:production`,
+                  },
+                },
+              },
+            },
+          },
+        });
+      },
     });
   }
 

diff --git a/generators/java/generators/server/generator.ts b/generators/java/generators/server/generator.ts
@@ -49,11 +49,11 @@ export default class ServerGenerator extends BaseApplicationGenerator {
         if (buildTool === 'maven') {
           const excludeWebapp = application.skipClient ? '' : ' -Dskip.installnodenpm -Dskip.npm';
           scriptsStorage.set({
-            'app:start': './mvnw',
+            'app:start': './mvnw -ntp --batch-mode',
             'backend:info': './mvnw --version',
             'backend:doc:test': './mvnw -ntp javadoc:javadoc --batch-mode',
             'backend:nohttp:test': './mvnw -ntp checkstyle:check --batch-mode',
-            'backend:start': `./mvnw${excludeWebapp}`,
+            'backend:start': `./mvnw${excludeWebapp} -ntp --batch-mode`,
             'java:jar': './mvnw -ntp verify -DskipTests --batch-mode',
             'java:war': './mvnw -ntp verify -DskipTests --batch-mode -Pwar',
             'java:docker': './mvnw -ntp verify -DskipTests -Pprod jib:dockerBuild',
@@ -98,9 +98,7 @@ export default class ServerGenerator extends BaseApplicationGenerator {
         });
       },
       packageJsonE2eScripts({ application }) {
-        const { devServerPort, devServerPortProxy: devServerPortE2e = devServerPort } = application;
         const scriptsStorage = this.packageJson.createStorage('scripts');
-        const buildCmd = application.buildToolGradle ? 'gradlew' : 'mvnw -ntp';
 
         let applicationWaitTimeout = WAIT_TIMEOUT * (application.applicationTypeGateway ? 2 : 1);
         applicationWaitTimeout = application.authenticationTypeOauth2 ? applicationWaitTimeout * 2 : applicationWaitTimeout;
@@ -110,17 +108,6 @@ export default class ServerGenerator extends BaseApplicationGenerator {
         scriptsStorage.set({
           'ci:server:await': `echo "Waiting for server at port $npm_package_config_backend_port to start" && wait-on -t ${applicationWaitTimeout} ${applicationEndpoint} && echo "Server at port $npm_package_config_backend_port started"`,
         });
-
-        // TODO add e2eTests property to application.
-        if (this.jhipsterConfig.testFrameworks?.includes('cypress')) {
-          scriptsStorage.set({
-            'pree2e:headless': 'npm run ci:server:await',
-            'ci:e2e:run': 'concurrently -k -s first -n application,e2e -c red,blue npm:ci:e2e:server:start npm:e2e:headless',
-            'ci:e2e:dev': `concurrently -k -s first -n application,e2e -c red,blue "./${buildCmd}" npm:e2e:headless`,
-            'e2e:dev': `concurrently -k -s first -n application,e2e -c red,blue "./${buildCmd}" npm:e2e`,
-            'e2e:devserver': `concurrently -k -s first -n backend,frontend,e2e -c red,yellow,blue npm:backend:start npm:start "wait-on -t ${WAIT_TIMEOUT} http-get://127.0.0.1:${devServerPortE2e} && npm run e2e:headless -- -c baseUrl=http://localhost:${devServerPortE2e}"`,
-          });
-        }
       },
     });
   }