fix(project): Allow Component.ts (#1243)

Fixes #1242.
This allows the use of TS for Component files.

Author: maxreichmann

packages/project/lib/specifications/types/Component.js

@@ -291,11 +291,14 @@ class Component extends ComponentProject {
 	}
 
 	async _ensureComponent() {
-		// Ensure that a Component.js exists
-		const componentResource = await this._getRawSourceReader().byPath("/Component.js");
+		// Throw if neither Component.js nor Component.ts is present
+		const componentResource = await this._getRawSourceReader().byPath("/Component.js") ||
+			await this._getRawSourceReader().byPath("/Component.ts");
 		if (!componentResource) {
 			throw new Error(
-				`Unable to find required file Component.js in component project ${this.getName()}`);
+				`Unable to find either required "Component.js" or "Component.ts"` +
+				` in component project ${this.getName()}`
+			);
 		}
 	}
 }

packages/project/package.json

@@ -48,7 +48,7 @@
 		"version": "git-chglog --sort semver --next-tag v$npm_package_version -o CHANGELOG.md v4.0.0.. && git add CHANGELOG.md",
 		"prepublishOnly": "git push --follow-tags",
 		"release-note": "git-chglog --sort semver -c .chglog/release-config.yml v$npm_package_version",
-		"depcheck": "depcheck --ignores @ui5/project,@istanbuljs/esm-loader-hook,rimraf"
+		"depcheck": "depcheck --ignores @ui5/project,@istanbuljs/esm-loader-hook,rimraf,sap"
 	},
 	"files": [
 		"CHANGELOG.md",

packages/project/test/fixtures/component.h/src-with-component-js-and-component-ts/Component.js

@@ -0,0 +1,8 @@
+sap.ui.define(["sap/ui/core/UIComponent"], function(UIComponent){
+	"use strict";
+	return UIComponent.extend('application.h.Component', {
+		metadata: {
+			manifest: "json"
+		}
+	});
+});

packages/project/test/fixtures/component.h/src-with-component-js-and-component-ts/Component.ts

@@ -0,0 +1,7 @@
+import UIComponent from "sap/ui/core/UIComponent";
+
+export default class Component extends UIComponent {
+    public static metadata = {
+        "manifest": "json"
+    };
+};

packages/project/test/fixtures/component.h/src-with-component-js-and-component-ts/manifest.json

@@ -0,0 +1,13 @@
+{
+    "_version": "1.1.0",
+    "sap.app": {
+        "_version": "1.1.0",
+        "id": "${componentName}",
+        "type": "application",
+        "applicationVersion": {
+            "version": "1.2.2"
+        },
+        "embeds": ["embedded"],
+        "title": "{{title}}"
+    }
+}

packages/project/test/fixtures/component.h/src-with-component-js/Component.js

@@ -0,0 +1,8 @@
+sap.ui.define(["sap/ui/core/UIComponent"], function(UIComponent){
+	"use strict";
+	return UIComponent.extend('application.h.Component', {
+		metadata: {
+			manifest: "json"
+		}
+	});
+});

packages/project/test/fixtures/component.h/src-with-component-js/manifest.json

@@ -0,0 +1,13 @@
+{
+    "_version": "1.1.0",
+    "sap.app": {
+        "_version": "1.1.0",
+        "id": "${componentName}",
+        "type": "application",
+        "applicationVersion": {
+            "version": "1.2.2"
+        },
+        "embeds": ["embedded"],
+        "title": "{{title}}"
+    }
+}

packages/project/test/fixtures/component.h/src-with-component-ts/Component.ts

@@ -0,0 +1,7 @@
+import UIComponent from "sap/ui/core/UIComponent";
+
+export default class Component extends UIComponent {
+    public static metadata = {
+        "manifest": "json"
+    };
+};

packages/project/test/fixtures/component.h/src-with-component-ts/manifest.json

@@ -0,0 +1,13 @@
+{
+    "_version": "1.1.0",
+    "sap.app": {
+        "_version": "1.1.0",
+        "id": "${componentName}",
+        "type": "application",
+        "applicationVersion": {
+            "version": "1.2.2"
+        },
+        "embeds": ["embedded"],
+        "title": "{{title}}"
+    }
+}

packages/project/test/lib/specifications/types/Component.js

@@ -678,11 +678,28 @@ test("namespace: detect namespace from pom.xml via ${appId} from properties", as
 		" couldn't be resolved from maven property \"appId\" of pom.xml of project component.h");
 });
 
-test("Throw for missing Component.js", async (t) => {
+test("Throw when neither Component.js nor Component.ts exists", async (t) => {
 	const {componentHInput} = t.context;
 	componentHInput.configuration.resources.configuration.paths.src = "src-no-component";
-
 	const error = await t.throwsAsync(Specification.create(componentHInput));
 	t.is(error.message,
-		"Unable to find required file Component.js in component project component.h");
+		"Unable to find either required \"Component.js\" or \"Component.ts\" in component project component.h");
+});
+
+test("Do not throw when Component.js exists", async (t) => {
+	const {componentHInput} = t.context;
+	componentHInput.configuration.resources.configuration.paths.src = "src-with-component-js";
+	await t.notThrowsAsync(Specification.create(componentHInput), "Should not throw an error");
+});
+
+test("Do not throw when Component.ts exists", async (t) => {
+	const {componentHInput} = t.context;
+	componentHInput.configuration.resources.configuration.paths.src = "src-with-component-ts";
+	await t.notThrowsAsync(Specification.create(componentHInput), "Should not throw an error");
+});
+
+test("Do not throw when both Component.js and Component.ts exist", async (t) => {
+	const {componentHInput} = t.context;
+	componentHInput.configuration.resources.configuration.paths.src = "src-with-component-js-and-component-ts";
+	await t.notThrowsAsync(Specification.create(componentHInput), "Should not throw an error");
 });