Merge branch 'main' into feature-demo

simplytest · Sep 30, 2024 · ccca4ec · ccca4ec
2 parents f765487 + 8dd8207
commit ccca4ec
Show file tree

Hide file tree

Showing 72 changed files with 1,226 additions and 1,035 deletions.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,5 @@
+{
+    "plugins": [
+        "istanbul"
+    ]
+}
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -81,6 +81,21 @@ jobs:
           reporter: java-junit
           path: "results/e2e*.xml"
 
+      - name: 👀 Sonar Scan
+        if: github.ref == 'refs/heads/main'
+        uses: sonarsource/sonarqube-scan-action@v2.0.1
+        env:
+          SONAR_TOKEN: ${{ secrets.SONARQUBE_TOKEN }}
+          SONAR_HOST_URL: ${{ vars.SONARQUBE_HOST }}
+
+      - name: 🤖 Sonar Summary
+        if: github.ref == 'refs/heads/main'
+        run: |
+          {
+            echo "### 🤖 Sonar Summary"
+            echo "${{ vars.SONARQUBE_HOST }}"
+          } >> $GITHUB_STEP_SUMMARY
+
       - name: 🔍 Upload PNPM Logs
         if: ${{ always() }}
         uses: actions/upload-artifact@v4

diff --git a/.gitignore b/.gitignore
@@ -4,8 +4,10 @@ dist
 cypress/screenshots
 cypress/downloads
 
+coverage
 results
 
+.nyc_output
 .angular
 .vscode
 .idea

diff --git a/.nycrc b/.nycrc
@@ -0,0 +1,13 @@
+{
+    "extends": "@istanbuljs/nyc-config-typescript",
+    "all": true,
+    "exclude": [
+        "./coverage/**",
+        "cypress/**",
+        "./dist/**",
+        "**/*.spec.ts",
+        "./src/main.ts",
+        "./src/test.ts",
+        "**/*.conf.js"
+    ]
+}
diff --git a/README.md b/README.md
@@ -17,4 +17,9 @@ To build the docker image, simply build the dockerfile present in the root direc
 $ docker buildx build -t banking-frontend -f docker/Dockerfile .
 $ docker run -p 4200:80 banking-frontend
 ```
-
+
+To start frontend from docker contaienr which interacts with localhost backend, use following command:
+
+```bash
+$ docker run -e VARIANT=DEV -p 4200:80 banking-frontend
+```
diff --git a/angular.json b/angular.json
@@ -9,9 +9,15 @@
       "root": "",
       "sourceRoot": "src",
       "prefix": "app",
+      "i18n": {
+        "sourceLocale": "de",
+        "locales": {
+          "en": "src/locale/en-US.json"
+        }
+      },
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-builders/custom-webpack:browser",
           "options": {
             "outputPath": "dist/BankingSoftwareFrontEnd",
             "index": "src/index.html",
@@ -34,10 +40,14 @@
             "buildOptimizer": false,
             "sourceMap": true,
             "optimization": false,
-            "namedChunks": true
+            "namedChunks": true,
+            "customWebpackConfig": {
+              "path": "./cypress/coverage.webpack.ts"
+            }
           },
           "configurations": {
             "production": {
+              "localize": true,
               "fileReplacements": [
                 {
                   "replace": "src/environments/environment.ts",
@@ -63,20 +73,49 @@
                   "maximumError": "10kb"
                 }
               ]
+            },
+            "development": {
+              "localize": false,
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
+            },
+            "en": {
+              "localize": [
+                "en"
+              ]
+            },
+            "de": {
+              "localize": [
+                "de"
+              ]
             }
           },
-          "defaultConfiguration": ""
+          "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
+          "builder": "@angular-builders/custom-webpack:dev-server",
           "options": {
             "browserTarget": "BankingSoftwareFrontEnd:build"
           },
           "configurations": {
             "production": {
               "browserTarget": "BankingSoftwareFrontEnd:build:production"
+            },
+            "development": {
+              "browserTarget": "BankingSoftwareFrontEnd:build:development"
+            },
+            "de": {
+              "browserTarget": "BankingSoftwareFrontEnd:build:development,de"
+            },
+            "en": {
+              "browserTarget": "BankingSoftwareFrontEnd:build:development,en"
             }
-          }
+          },
+          "defaultConfiguration": "development"
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",

diff --git a/cypress.config.ts b/cypress.config.ts
@@ -1,17 +1,19 @@
-import { defineConfig } from "cypress";
-import createBundler from "@bahmutov/cypress-esbuild-preprocessor";
 import { addCucumberPreprocessorPlugin } from "@badeball/cypress-cucumber-preprocessor";
 import { createEsbuildPlugin } from "@badeball/cypress-cucumber-preprocessor/esbuild";
+import createBundler from "@bahmutov/cypress-esbuild-preprocessor";
+import registerCodeCoverageTasks from "@cypress/code-coverage/task";
+import { defineConfig } from "cypress";
+import coverageWebpack from "./cypress/coverage.webpack";
 
 export default defineConfig({
-
     e2e: {
         specPattern: "**/e2e/*.{spec.ts,feature}",
-        async setupNodeEvents(
-            on: Cypress.PluginEvents,
-            config: Cypress.PluginConfigOptions
-        ): Promise<Cypress.PluginConfigOptions>
+        baseUrl: "http://localhost:4200/",
+        blockHosts: "fonts.googleapis.com",
+
+        async setupNodeEvents(on: Cypress.PluginEvents, config: Cypress.PluginConfigOptions)
         {
+            registerCodeCoverageTasks(on, config);
             await addCucumberPreprocessorPlugin(on, config);
 
             on(
@@ -23,14 +25,27 @@ export default defineConfig({
 
             return config;
         },
-        screenshotOnRunFailure: true,
+        env: {
+            codeCoverageTasksRegistered: true,
+        },
     },
 
     component: {
         devServer: {
+            webpackConfig: coverageWebpack,
             framework: "angular",
             bundler: "webpack",
         },
         specPattern: "**/*.cy.ts",
+
+        setupNodeEvents(on: Cypress.PluginEvents, config: Cypress.PluginConfigOptions)
+        {
+            registerCodeCoverageTasks(on, config);
+            return config;
+        },
+
+        env: {
+            codeCoverageTasksRegistered: true,
+        },
     },
 });
diff --git a/cypress/coverage.webpack.ts b/cypress/coverage.webpack.ts
@@ -0,0 +1,24 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+/* eslint-disable no-undef */
+
+export default {
+    module: {
+        rules: [
+            {
+                test: /\.(ts)$/,
+                use: {
+                    loader: "babel-loader",
+                    options: {
+                        plugins: ["babel-plugin-istanbul"],
+                    },
+                },
+                enforce: "post",
+                include: require("path").join(__dirname, "..", "src"),
+                exclude: [
+                    /node_modules/,
+                    /cypress/,
+                    /(ngfactory|ngstyle)\.js/],
+            },
+        ],
+    },
+};
diff --git a/cypress/e2e/AccessebilityTest.feature b/cypress/e2e/AccessebilityTest.feature
@@ -0,0 +1,9 @@
+Feature: Banking App - Dashboard Accessebility
+
+  Scenario Outline: Dashboard Accessebility check
+    Given Ich bin auf der Banking App als Nutzer '<contractID>' mit Passwort '<password>' eingeloggt
+
+    Examples: 
+      | contractID | password |
+      |      00002 |      123 |
+
diff --git a/cypress/e2e/CreateAccount.feature b/cypress/e2e/CreateAccount.feature
@@ -1,34 +1,31 @@
 Feature: Banking App - Create Account Page
 
   Scenario Outline: Create Accounts
-	Given I navigate to the Banking App dashboard page
-	When When I click on Registrieren button
-	And I type a first name '<firstName>' and a last name '<lastName>'
-	And I type a password <password>
-	And I enter street name <street> a house number '<house>'
-	And I enter a postcode <zipCode> a city <city> and a country <country>
-	And I enter an email <email>
-	And I enter a birthDate <birthDate>
-	And When I click on Registrieren button again
-	Then I should be presented with a greeting text <greeting>
-	When I click on Konto erstellen button
-	And I click on Giro-Konto button
-	Then I should be presented with a created Giro Konto
-	When I click on Konto erstellen button
-	And I click on Festgeld-Konto button
-	Then I should be presented with a created Festgeld-Konto called FixedRate
-	When I click on Konto erstellen button
-	And I click on Tagesgeld-Konto button
-	Then I should be presented with a created Tagesgeld-Konto called OnCall
-	When I click on Konto erstellen button
-	And I click on Immobilien-Finanzierungskonto button
-	Then I should be presented an alert box with text Immobilien-Finanzierungskonto Erstellen
-	When I click on Kredit Anfordern Button
-	Then I should be presented with a created  Immobilien-Finanzierungskonto called RealEstate
-
-
-	Examples:
-	  | firstName | lastName | password | street    | house | zipCode | city   | country     | email       | birthDate  | greeting    |
-	  | John      | Doe      | 123      | Hauptstr. | 1     | 10555   | Berlin | Deutschland | john@doe.de | 2000-09-09 | Hallo John! |
-
+    Given I navigate to the Banking App dashboard page
+    When When I click on Registrieren button
+    And I type a first name '<firstName>' and a last name '<lastName>'
+    And I type a password <password>
+    And I enter street name <street> a house number '<house>'
+    And I enter a postcode <zipCode> a city <city> and a country <country>
+    And I enter an email <email>
+    And I enter a birthDate <birthDate>
+    And When I click on Registrieren button again
+    Then I should be presented with a greeting text <greeting>
+    When I click on Konto erstellen button
+    And I click on Giro-Konto button
+    Then I should be presented with a created Giro Konto
+    When I click on Konto erstellen button
+    And I click on Festgeld-Konto button
+    Then I should be presented with a created Festgeld-Konto called FixedRate
+    When I click on Konto erstellen button
+    And I click on Tagesgeld-Konto button
+    Then I should be presented with a created Tagesgeld-Konto called OnCall
+    When I click on Konto erstellen button
+    And I click on Immobilien-Finanzierungskonto button
+    Then I should be presented an alert box with text Immobilien-Finanzierungskonto Erstellen
+    When I click on Kredit Anfordern Button
+    Then I should be presented with a created  Immobilien-Finanzierungskonto called RealEstate
 
+    Examples: 
+      | firstName | lastName | password | street    | house | zipCode | city   | country     | email       | birthDate  | greeting         |
+      | John      | Doe      |      123 | Hauptstr. |     1 |   10555 | Berlin | Deutschland | john@doe.de | 2000-09-09 | Willkommen John! |
diff --git a/cypress/e2e/Login.feature b/cypress/e2e/Login.feature
@@ -1,4 +1,3 @@
-
 Feature: Banking App - Dashboard Page
 
   Scenario Outline: Validate valid login credentials
@@ -7,17 +6,19 @@ Feature: Banking App - Dashboard Page
     When I type a Password <password>
     When I click on login button
     Then I should be presented with a greeting text <greeting>
-    Examples:
-      | contractID | password | greeting    |
-      | 00002      | 123      | Hallo John! |
-      | 00003      | 123      | Hallo Amanda! |
+
+    Examples: 
+      | contractID | password | greeting           |
+      |      00002 |      123 | Willkommen John!   |
+      |      00003 |      123 | Willkommen Amanda! |
 
   Scenario Outline: Validate invalid login credentials
     Given I navigate to the Banking App dashboard page
     When I type a Contract ID <contractID>
     When I type an invalid Password <password>
     When I click on login button
     Then I should be presented with an alert box containing text <expectedAlertText>
-    Examples:
-      | contractID | password | expectedAlertText        |
-      | 00002      | 12       | Kontrakt nicht gefunden! |
+
+    Examples: 
+      | contractID | password | expectedAlertText       |
+      |      00002 |       12 | Vertrag nicht gefunden! |
diff --git a/cypress/e2e/MoneyTransfer.feature b/cypress/e2e/MoneyTransfer.feature
@@ -13,7 +13,7 @@ Feature: Money Transfer
     Then I should be presented with a greeting text <greeting>
     When I click on Arrow button to receive money into my account
     And I should be presented with an alert box containing "Geld empfangen" text
-    And I type a Geldbetrag <geldbetrag>
+    And I type a Geldbetrag '<geldbetrag>'
     And I click on Geld empfangen button
     Then I should be presented with an alert box containing "Geld erhalten!" text
     When I click on Close button
@@ -39,5 +39,5 @@ Feature: Money Transfer
     Then my account balance at the end has an amount of '<Endbetrag>'
 
     Examples: 
-      | firstName | lastName | password | street    | house | zipCode | city   | country     | email       | birthDate  | greeting    | geldbetrag | betrag | IBAN                   | Endbetrag |
-      | John      | Doe      |      123 | Hauptstr. |     1 |   10555 | Berlin | Deutschland | john@doe.de | 2000-09-09 | Hallo John! |       2000 |   1000 | DE02120300000000202051 |         0 |
+      | firstName | lastName | password | street    | house | zipCode | city   | country     | email       | birthDate  | greeting         | geldbetrag | betrag | IBAN                   | Endbetrag |
+      | John      | Doe      |      123 | Hauptstr. |     1 |   10555 | Berlin | Deutschland | john@doe.de | 2000-09-09 | Willkommen John! |       2000 |   1000 | DE02120300000000202051 |         0 |