Typescript configuration for Fiori elements apps (#1286)

This PR enables typescript for both apps Travel Processor and Travel
Analytics.
Additionally, for the Travel Processor App, the following flexible
programming model based extensions are added:
- a custom section combining a message strip and a table building block.
This replaces the standard booking table section
- a controller extension: when saving, it is checked whether
trees-4-tickets checkbox has been selected, a dialog is shown giving the
user the option to do so before save continues.

Other changes
- Fix bad extraneous field in Travels.csv file
- Show server stdout in Karma runs
- Use `karma-ui5-transpile` to get TS working in Karma tests
- Delete obsolete `app/*/package=lock.json` files
- Unified double `karma.conf` files
- Java 21 in pipeline
- Drop Node 18 in pipeline
- Remove obsolete `odata.test.js` which also caused problems with
`ts-jest`
- Remove obsolete `npm ci` calls in pipeline
- Use `deploy -out` param in Maven build to not be disturbed by extra
stdout ouput from `cds-ui5-plugin`
- Replace parent pom by SpringBoot bom
- Use latest SpringBoot 3.41
- Use latest CAP Java 3.5.0

---------

Co-authored-by: Christian Georgi <[email protected]>
Co-authored-by: Austin Devine <[email protected]>

.github/workflows/maven.yml

@@ -17,7 +17,7 @@ jobs:
 
     strategy:
       matrix:
-        java-version: [17,20]
+        java-version: [21]
 
     steps:
     - uses: actions/checkout@v4
@@ -28,17 +28,17 @@ jobs:
         java-version: ${{ matrix.java-version }}
         distribution: 'sapmachine'
 
+    - run: npm ci
+
     - name: Build with Maven
       run: mvn -B clean verify
 
     - name: Run integration tests - Manage Travels
       working-directory: ./app/travel_processor
       run: |
-        npm ci
         npm run test:java -- --ci
 
     - name: Run integration tests - Analyze Bookings
       working-directory: ./app/travel_analytics
       run: |
-        npm ci
         npm run test:java -- --ci

.github/workflows/node.js.yml

@@ -18,15 +18,15 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [22.x, 18.x]
+        node-version: [22.x, 20.x]
 
     steps:
     - uses: actions/checkout@v4
     - name: Use Node.js ${{ matrix.node-version }}
       uses: actions/setup-node@v4
       with:
         node-version: ${{ matrix.node-version }}
-    - run: npm i @sap/cds-dk typescript tsx
+    - run: npm i -g @sap/cds-dk typescript tsx
     - run: npm ci
     - run: npx cds-typer "*"
     - run: npm run lint
@@ -37,13 +37,11 @@ jobs:
     - name: Run integration tests - Manage Travels
       working-directory: ./app/travel_processor
       run: |
-        npm ci
         npm run test:node -- --ci
 
     - name: Run integration tests - Analyze Bookings
       working-directory: ./app/travel_analytics
       run: |
-        npm ci
         npm run test:node -- --ci
 
 #

.gitignore

@@ -3,7 +3,7 @@ _out
 *.db
 connection.properties
 default-*.json
-schema.sql
+*.sql
 gen/
 node_modules/
 target/

_i18n/i18n.properties

@@ -22,6 +22,10 @@ ProductPrice=Product Price
 ProductID=Product
 OverallStatus=Overall Status
 GeneralInformation=General Information
+GoGreen=Trees-4-Tickets
+GreenFee=Green Flight Fee
+TreesPlanted=Trees Planted
+Sustainability=Sustainability
 
 Booking=Booking
 Bookings=Bookings

karma-cap-middleware.js → app/.karma/karma-cap-middleware.js

@@ -18,11 +18,14 @@ function spawnServer(cmd, args, cwd, fnIsReady) {
     };
 
     proc.on("close", reject);
-    proc.stdout.on("data", checkServerReady);
+    proc.stdout.on("data", (data) => {
+      process.stdout.write(data.toString())
+      checkServerReady(data)
+    });
 
     // clean up sub process
     process.on("exit", () => {
-      if (proc) proc.kill();
+      if (proc) proc.kill("SIGKILL");
     });
   });
 }
@@ -52,9 +55,8 @@ async function java() {
     if (started) return new URL(`http://localhost:${started.groups.port}`);
   };
   const serverUrl = await spawnServer(
-    "mvn",
-    ["spring-boot:run", "-B", "-Dserver.port=0"],
-    "../../srv",
+    "mvn", ["spring-boot:run", "-B", "-Dspring-boot.run.jvmArguments=-Dserver.port=0"],
+    "../..",
     isReady
   );
 

app/.karma/karma.conf.js

@@ -0,0 +1,34 @@
+const puppeteer = require("puppeteer"),
+  cap = require("./karma-cap-middleware");
+
+process.env.CHROME_BIN = puppeteer.executablePath();
+
+module.exports = async (config) => {
+  // start the CAP server (either specify CLI arg --server=node or --server=java)
+  let capMiddleware;
+  if (config.server === "node") {
+    capMiddleware = cap.node();
+  } else if (config.server === "java") {
+    capMiddleware = cap.java();
+  } else {
+    throw new Error(`Unknown server type: ${config.server}`);
+  }
+
+  config.set({
+    frameworks: ["ui5"],
+    preprocessors: {
+      "webapp/**/*.ts": ["ui5-transpile"],
+    },
+    logLevel: "INFO", // log errors only. Change to "DEBUG" for more verbosity
+    proxies: {
+      "/base/webapp/": "/",
+    },
+    ui5: {
+      failOnEmptyTestPage: true,
+    },
+    plugins: [...config.plugins, await capMiddleware],
+    middleware: ["cap-proxy"],
+    browsers: config.ci ? ["ChromeHeadless"] : ["Chrome"],
+    singleRun: config.ci || config.singleRun || false
+  });
+};

app/labels.cds

@@ -12,6 +12,9 @@ annotate schema.Travel with @title: '{i18n>Travel}' {
   Description  @title: '{i18n>Description}';
   BookingFee   @title: '{i18n>BookingFee}'    @Measures.ISOCurrency: CurrencyCode_code;
   TotalPrice   @title: '{i18n>TotalPrice}'    @Measures.ISOCurrency: CurrencyCode_code;
+  GoGreen      @title: '{i18n>GoGreen}';  
+  GreenFee     @title: '{i18n>GreenFee}'      @Measures.ISOCurrency: CurrencyCode_code;
+  TreesPlanted @title: '{i18n>TreesPlanted}'; 
   TravelStatus @title: '{i18n>TravelStatus}'  @Common.Text: TravelStatus.name     @Common.TextArrangement: #TextOnly;
   to_Customer  @title: '{i18n>CustomerID}'    @Common.Text: to_Customer.LastName;
   to_Agency    @title: '{i18n>AgencyID}'      @Common.Text: to_Agency.Name;

app/travel_analytics/karma.conf.js

@@ -1,31 +1 @@
-const puppeteer = require("puppeteer"),
-  cap = require("../../karma-cap-middleware");
-
-process.env.CHROME_BIN = puppeteer.executablePath();
-
-module.exports = async (config) => {
-  // start the CAP server (either specify CLI arg --server=node or --server=java)
-  let capMiddleware;
-  if (config.server === "node") {
-    capMiddleware = cap.node();
-  } else if (config.server === "java") {
-    capMiddleware = cap.java();
-  } else {
-    throw new Error(`Unknown server type: ${config.server}`);
-  }
-
-  config.set({
-    frameworks: ["ui5"],
-    logLevel: "INFO", // log errors only. Change to "DEBUG" for more verbosity
-    proxies: {
-      "/base/webapp/": "/",
-    },
-    ui5: {
-      failOnEmptyTestPage: true,
-    },
-    plugins: [...config.plugins, await capMiddleware],
-    middleware: ["cap-proxy"],
-    browsers: config.ci ? ["ChromeHeadless"] : ["Chrome"],
-    singleRun: config.ci || config.singleRun || false
-  });
-};
+module.exports = require("../.karma/karma.conf.js")