Merge pull request #318 from TheJacksonLaboratory/feature/angular-upgrade

Feature/angular upgrade

Author: iimpulse

.eslintrc.json

@@ -36,6 +36,8 @@
             "type": "attribute"
           }
         ]
+    ,
+    "object-curly-spacing": ["error", "always"]
       }
     },
     {

.github/workflows/hpo-web-development.yml

@@ -14,11 +14,11 @@ jobs:
       - name: Configure Node
         uses: actions/setup-node@v3
         with:
-          node-version: 16.10.0
+          node-version: 24.5.0
           cache: 'npm'
 
       - name: Lint, Test, Build
         run: |
           npm install
           npm run lint
-          npm run testci
+          npm run test:ci

.github/workflows/hpo-web.yml

@@ -24,15 +24,15 @@ jobs:
     - name: Configure Node
       uses: actions/setup-node@v3
       with:
-        node-version: 16.10.0
+        node-version: 24.5.0
         cache: 'npm'
 
     - name: Lint, Test, Build
       run: |
         npm install
         npm run lint
-        npm run testci
-        npm run buildProd --if-present
+        npm run test:ci
+        npm run build:prod --if-present
 
     - name: Set Project Version
       run: echo "PROJECT_VERSION=$(cat package.json | jq -r '.version')" >> "$GITHUB_ENV"
@@ -42,7 +42,7 @@ jobs:
 
     - name: Deploy to GCS
       run: |
-        gsutil -m cp -r dist/* "$GCLOUD_BUCKET/hpo-web-$PROJECT_VERSION-$GIT_HASH/"
+        gsutil -m cp -r dist/hpo-web/* "$GCLOUD_BUCKET/hpo-web-$PROJECT_VERSION-$GIT_HASH/"
         gsutil -m rm -f "$GCLOUD_BUCKET/*" || true
         gsutil -m rm -rf "$GCLOUD_BUCKET/assets/" || true
         gsutil -m cp -r "$GCLOUD_BUCKET/hpo-web-$PROJECT_VERSION-$GIT_HASH/*"  "$GCLOUD_BUCKET/"

angular.json

@@ -9,22 +9,25 @@
       "projectType": "application",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-devkit/build-angular:application",
           "options": {
             "aot": true,
-            "outputPath": "dist",
+            "outputPath": "dist/hpo-web",
             "index": "src/index.html",
-            "main": "src/main.ts",
             "tsConfig": "src/tsconfig.app.json",
-            "polyfills": "src/polyfills.ts",
+            "polyfills": [
+              "src/polyfills.ts"
+            ],
             "assets": [
               "src/assets",
               "src/favicon.ico"
             ],
             "styles": [
-              "src/styles.scss"
+              "src/styles.scss",
+              "node_modules/@angular/material/prebuilt-themes/indigo-pink.css"
             ],
-            "scripts": []
+            "scripts": [],
+            "browser": "src/main.ts"
           },
           "configurations": {
             "development": {
@@ -62,8 +65,6 @@
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
               "fileReplacements": [
                 {
                   "replace": "src/environments/environment.ts",
@@ -76,38 +77,28 @@
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "hpo:build"
+            "buildTarget": "hpo:build"
           },
           "configurations": {
             "development": {
-              "browserTarget": "hpo:build:development"
+              "buildTarget": "hpo:build:development"
             },
             "production": {
-              "browserTarget": "hpo:build:production"
+              "buildTarget": "hpo:build:production"
             }
           }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "hpo:build"
+            "buildTarget": "hpo:build"
           }
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular-devkit/build-angular:jest",
           "options": {
-            "main": "src/test.ts",
-            "karmaConfig": "./karma.conf.js",
-            "polyfills": "src/polyfills.ts",
-            "tsConfig": "src/tsconfig.spec.json",
-            "scripts": [],
-            "styles": [
-              "src/styles.scss"
-            ],
-            "assets": [
-              "src/assets",
-              "src/favicon.ico"
-            ]
+            "polyfills": ["src/polyfills.ts"],
+            "tsConfig": "src/tsconfig.spec.json"
           }
         },
         "lint": {

jest.config.js

@@ -0,0 +1,38 @@
+module.exports = {
+  preset: 'jest-preset-angular',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
+  testEnvironment: 'jsdom',
+  transform: {
+    '^.+\\.(ts|mjs|js|html)$': [
+      'jest-preset-angular',
+      {
+        tsconfig: '<rootDir>/src/tsconfig.spec.json',
+        stringifyContentPathRegex: '\\.(html|svg)$',
+      },
+    ],
+  },
+  transformIgnorePatterns: [
+    'node_modules/(?!.*\\.mjs$)',
+  ],
+  collectCoverageFrom: [
+    'src/**/*.ts',
+    '!src/main.ts',
+    '!src/polyfills.ts',
+    '!src/**/*.d.ts',
+    '!src/**/index.ts',
+    '!src/environments/**',
+    '!src/test.ts',
+  ],
+  coverageReporters: ['html', 'text-summary', 'lcov'],
+  coverageDirectory: 'coverage',
+  testMatch: [
+    '<rootDir>/src/**/__tests__/**/*.(js|ts)',
+    '<rootDir>/src/**/(*.)+(spec|test).(js|ts)',
+  ],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
+  testPathIgnorePatterns: [
+    '<rootDir>/node_modules/',
+    '<rootDir>/dist/',
+  ],
+  cacheDirectory: '<rootDir>/.jest-cache',
+};