@ui5/webcomponents-tools 0.0.0-aadaf0b2a → 0.0.0-acc6fea96

package/README.md

@@ -1,24 +1,21 @@
-![UI5 icon](https://raw.githubusercontent.com/SAP/ui5-webcomponents/master/docs/images/UI5_logo_wide.png)
+# ![UI5 icon](https://raw.githubusercontent.com/SAP/ui5-webcomponents/main/docs/images/UI5_logo_water.png)UI5 Web Components - Tools
 
-# UI5 Web Components - Tools
-
-[![Travis CI Build Status](https://travis-ci.org/SAP/ui5-webcomponents.svg?branch=master)](https://travis-ci.org/SAP/ui5-webcomponents)
 [![npm Package Version](https://badge.fury.io/js/%40ui5%2Fwebcomponents.svg)](https://www.npmjs.com/package/@ui5/webcomponents)
 
 Provides libraries, configuration files and build artifacts, 
 used by other UI5 Web Components packages, such as `main` and `fiori`. 
 
 ## Resources
-- [UI5 Web Components - README.md](https://github.com/SAP/ui5-webcomponents/blob/master/README.md)
+- [UI5 Web Components - README.md](https://github.com/SAP/ui5-webcomponents/blob/main/README.md)
 - [UI5 Web Components - Home Page](https://sap.github.io/ui5-webcomponents)
-- [UI5 Web Components - Playground and API Reference](https://sap.github.io/ui5-webcomponents/playground/)
+- [UI5 Web Components - Playground and API Reference](https://sap.github.io/ui5-webcomponents/play/)
 
 ## Support
-We welcome all comments, suggestions, questions, and bug reports. Please follow our [Support Guidelines](https://github.com/SAP/ui5-webcomponents/blob/master/SUPPORT.md#-content) on how to report an issue, or chat with us in the `#webcomponents` channel of the [OpenUI5 Community Slack](https://join-ui5-slack.herokuapp.com/).
+We welcome all comments, suggestions, questions, and bug reports. Please follow our [Support Guidelines](https://github.com/SAP/ui5-webcomponents/blob/main/SUPPORT.md#-content) on how to report an issue, or chat with us in the `#webcomponents` channel of the [OpenUI5 Community Slack](https://ui5-slack-invite.cfapps.eu10.hana.ondemand.com/).
 
 ## Contribute
-Please check our [Contribution Guidelines](https://github.com/SAP/ui5-webcomponents/blob/master/CONTRIBUTING.md).
+Please check our [Contribution Guidelines](https://github.com/SAP/ui5-webcomponents/blob/main/docs/6-contributing/02-conventions-and-guidelines.md).
 
 ## License
 Copyright (c) 2019 SAP SE or an SAP affiliate company. All rights reserved.
-This file is licensed under the Apache Software License, Version 2.0 except as noted otherwise in the [LICENSE](https://github.com/SAP/ui5-webcomponents/blob/master/LICENSE.txt) file.
+This file is licensed under the Apache Software License, Version 2.0 except as noted otherwise in the [LICENSE](https://github.com/SAP/ui5-webcomponents/blob/main/LICENSE.txt) file.

package/assets-meta.js

@@ -0,0 +1,158 @@
+const assetsMeta = {
+  "themes": {
+    "default": "sap_horizon",
+    "all": [
+      "sap_fiori_3",
+      "sap_fiori_3_dark",
+      "sap_fiori_3_hcb",
+      "sap_fiori_3_hcw",
+	    "sap_horizon",
+	    "sap_horizon_dark",
+	    "sap_horizon_hcb",
+	    "sap_horizon_hcw",
+      "sap_horizon_exp",
+	    "sap_horizon_dark_exp",
+	    "sap_horizon_hcb_exp",
+	    "sap_horizon_hcw_exp",
+    ],
+  },
+  "languages": {
+    "default": "en",
+    "all": [
+      "ar",
+      "bg",
+      "ca",
+      "cnr",
+      "cs",
+      "cy",
+      "da",
+      "de",
+      "el",
+      "en",
+      "en_GB",
+      "en_US_sappsd",
+      "en_US_saprigi",
+      "en_US_saptrc",
+      "es",
+      "es_MX",
+      "et",
+      "fi",
+      "fr",
+      "fr_CA",
+      "hi",
+      "hr",
+      "hu",
+      "in",
+      "it",
+      "iw",
+      "ja",
+      "kk",
+      "ko",
+      "lt",
+      "lv",
+      "mk",
+      "ms",
+      "nl",
+      "no",
+      "pl",
+      "pt_PT",
+      "pt",
+      "ro",
+      "ru",
+      "sh",
+      "sk",
+      "sl",
+      "sr",
+      "sv",
+      "th",
+      "tr",
+      "uk",
+      "vi",
+      "zh_CN",
+      "zh_TW"
+    ]
+  },
+  "locales": {
+    "default": "en",
+    "all": [
+      "ar",
+      "ar_EG",
+      "ar_SA",
+      "bg",
+      "ca",
+      "cnr",
+      "cs",
+      "da",
+      "de",
+      "de_AT",
+      "de_CH",
+      "el",
+      "el_CY",
+      "en",
+      "en_AU",
+      "en_GB",
+      "en_HK",
+      "en_IE",
+      "en_IN",
+      "en_NZ",
+      "en_PG",
+      "en_SG",
+      "en_ZA",
+      "es",
+      "es_AR",
+      "es_BO",
+      "es_CL",
+      "es_CO",
+      "es_MX",
+      "es_PE",
+      "es_UY",
+      "es_VE",
+      "et",
+      "fa",
+      "fi",
+      "fr",
+      "fr_BE",
+      "fr_CA",
+      "fr_CH",
+      "fr_LU",
+      "he",
+      "hi",
+      "hr",
+      "hu",
+      "id",
+      "it",
+      "it_CH",
+      "ja",
+      "kk",
+      "ko",
+      "lt",
+      "lv",
+      "ms",
+      "mk",
+      "nb",
+      "nl",
+      "nl_BE",
+      "pl",
+      "pt",
+      "pt_PT",
+      "ro",
+      "ru",
+      "ru_UA",
+      "sk",
+      "sl",
+      "sr",
+      "sr_Latn",
+      "sv",
+      "th",
+      "tr",
+      "uk",
+      "vi",
+      "zh_CN",
+      "zh_HK",
+      "zh_SG",
+      "zh_TW"
+    ]
+  }
+};
+
+module.exports = assetsMeta;

package/bin/dev.js

@@ -2,4 +2,15 @@
 
 const child_process = require("child_process");
 
-child_process.execSync(`npx nps ${process.argv[2]}`, {stdio: 'inherit'});
+let command = process.argv[2];
+const argument = process.argv[3];
+
+if (command === "watch") {
+	if (["src", "test", "bundles", "styles", "templates", "samples"].includes(argument)) {
+		command = `watch.${argument}`;
+	}
+} else if (command === "test") {
+	command = `test ${process.argv.slice(3).join(" ")}`;
+}
+
+child_process.execSync(`npx nps "${command}"`, {stdio: 'inherit'});

package/components-package/cypress/support/commands.js

@@ -0,0 +1,39 @@
+/// <reference types="cypress" />
+// ***********************************************
+// This example commands.ts shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+//
+// declare global {
+//   namespace Cypress {
+//     interface Chainable {
+//       login(email: string, password: string): Chainable<void>
+//       drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
+//     }
+//   }
+// }
+
+import "cypress-real-events";

package/components-package/cypress/support/component-index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+	<meta charset="utf-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width,initial-scale=1.0">
+	<meta name="sap-allowedThemeOrigins" content="https://example.com">
+	<title>Components App</title>
+	<script data-ui5-config type="application/json">{}</script>
+</head>
+
+<body>
+	<div data-cy-root></div>
+</body>
+
+</html>

package/components-package/cypress/support/component.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="cypress" />
+import { RenderOptions, HTMLTemplateResult } from 'lit';
+import "cypress-real-events";
+
+export type Renderable = HTMLTemplateResult;
+export interface MountUI5Options extends MountLitTemplateOptions {
+	ui5Configuration: object;
+}
+export type MountOptions = Partial<MountUI5Options>;
+export declare function mount<T extends keyof HTMLElementTagNameMap = any>(component: string | Renderable, options?: MountOptions): Cypress.Chainable<JQuery<HTMLElementTagNameMap[T]>>;
+declare global {
+	namespace Cypress {
+		interface Chainable {
+			/**
+			 * Mount your component into Cypress sandbox
+			 * @param component content to render by lit-html render function
+			 * @param options render options for custom rendering
+			 */
+			mount: typeof mount;
+		}
+	}
+}
+

package/components-package/cypress/support/component.js

@@ -0,0 +1,34 @@
+import { setupHooks } from '@cypress/mount-utils';
+import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
+import { mount } from 'cypress-ct-lit'
+import "./commands.js";
+
+let dispose;
+
+function cleanup() {
+	dispose?.();
+}
+
+function ui5Mount(component, options = {}) {
+	const configurationScript = document.head.querySelector("script[data-ui5-config]")
+	cleanup();
+
+	if (options.ui5Configuration) {
+		configurationScript.innerHTML = JSON.stringify(options.ui5Configuration);
+
+	}
+
+	dispose = () => {
+		configurationScript.innerHTML = "{}";
+	}
+
+	if (typeof component === "string") {
+		return mount(unsafeHTML(component), options)
+	}
+
+	return mount(component, options)
+}
+
+setupHooks(cleanup);
+
+Cypress.Commands.add('mount', ui5Mount)

package/components-package/cypress.config.js

@@ -0,0 +1,19 @@
+const { defineConfig } = require('cypress')
+const path = require("path");
+
+module.exports = defineConfig({
+	component: {
+		supportFile: path.join(__dirname, "cypress/support/component.js"),
+		indexHtmlFile: path.join(__dirname, "cypress/support/component-index.html"),
+		specPattern: ["**/specs/*.cy.{js,ts}", "**/specs/**/*.cy.{js,ts}"],
+		devServer: {
+			framework: 'cypress-ct-lit',
+			bundler: 'vite',
+		}
+	},
+	video: false,
+	screenshotOnRunFailure: false,
+	scrollBehavior: false,
+	viewportHeight: 1080,
+	viewportWidth: 1440,
+})

package/components-package/eslint.js

@@ -1,3 +1,98 @@
+const fs = require("fs");
+const path = require("path");
+const tsMode = fs.existsSync(path.join(process.cwd(), "tsconfig.json"));
+
+/**
+ * Returns eslint rules specific to typescript files
+ * @returns
+ */
+const getTsModeOverrides = () => {
+	const tsConfiguration = {
+		files: ["*.ts"],
+		parser: "@typescript-eslint/parser",
+		plugins: ["@typescript-eslint"],
+		extends: [
+			"plugin:@typescript-eslint/recommended",
+			"plugin:@typescript-eslint/recommended-requiring-type-checking"
+		],
+		parserOptions: {
+			"project": [
+				"./tsconfig.json",
+				"./cypress/tsconfig.json",
+			],
+			EXPERIMENTAL_useSourceOfProjectReferenceRedirect: true,
+		},
+		rules: {
+			"no-shadow": "off",
+			"@typescript-eslint/consistent-type-imports": "error",
+			"import/consistent-type-specifier-style": ["error", "prefer-top-level"],
+			"@typescript-eslint/no-shadow": ["error"],
+			"@typescript-eslint/no-unsafe-member-access": "off",
+			"@typescript-eslint/no-floating-promises": "off",
+			"@typescript-eslint/no-explicit-any": "off",
+			"@typescript-eslint/no-unsafe-assignment": "off",
+			"@typescript-eslint/ban-ts-comment": "off",
+			"@typescript-eslint/no-unsafe-call": "off",
+			"@typescript-eslint/no-non-null-assertion": "off",
+			"@typescript-eslint/no-empty-function": "off",
+			"@typescript-eslint/no-empty-interface": "off",
+			"lines-between-class-members": "off",
+		}
+	};
+
+	const tsxConfiguration = JSON.parse(JSON.stringify(tsConfiguration));
+	tsxConfiguration.files = ["*.tsx"];
+	tsxConfiguration.rules = {
+		...tsxConfiguration.rules,
+		"@typescript-eslint/unbound-method": "off", // to be able to attach on* listeners
+		"@typescript-eslint/no-misused-promises": "off", // to be able to have async event listeners
+		"operator-linebreak": "off",
+		"no-nested-ternary": "off",
+		"implicit-arrow-linebreak": "off",
+		"function-paren-newline": "off",
+		"comma-dangle": "off"
+	};
+
+	const cypressConfiguration = {
+		"files": ["**/cypress/**/*.ts"],
+
+		"plugins": [
+			"cypress"
+		],
+		extends: [
+			"plugin:cypress/recommended"
+		],
+		"env": {
+			"cypress/globals": true
+		},
+		"rules": {
+			"max-nested-callbacks": 0,
+			"@typescript-eslint/no-namespace": "off",
+			"cypress/no-assigning-return-values": "error",
+			"cypress/no-unnecessary-waiting": "error",
+			"cypress/assertion-before-screenshot": "warn",
+			"cypress/no-force": "warn",
+			"cypress/no-async-tests": "error",
+			"cypress/no-async-before": "error",
+			"cypress/no-pause": "error",
+			"import/no-extraneous-dependencies": [
+				"error",
+				{
+					"devDependencies": [
+						"**/cypress/**/*.ts"
+					]
+				}
+			]
+		}
+	}
+
+	return [
+		tsConfiguration,
+		tsxConfiguration,
+		cypressConfiguration,
+	];
+}
+
 module.exports = {
 	"env": {
 		"browser": true,
@@ -5,6 +100,7 @@ module.exports = {
 	},
 	"root": true,
 	"extends": "airbnb-base",
+	"overrides": tsMode ? getTsModeOverrides() : [],
 	"parserOptions": {
 		"ecmaVersion": 2018,
 		"sourceType": "module"
@@ -47,6 +143,7 @@ module.exports = {
 		"curly": [2, "all"],
 		// "default-case": 1, // removed for UI5 WebComponents
 		"import/extensions": ["error", "always"], // override for UI5 WebComponents
+		"import/order": "off",
 		"no-alert": 2,
 		"no-caller": 2,
 		"no-div-regex": 2,
@@ -88,7 +185,7 @@ module.exports = {
 		"no-shadow-restricted-names": 2,
 		"no-undef-init": 2,
 		"no-undef": 2,
-		"no-unused-vars": [2, {"vars":"all", "args":"none"}],
+		"no-unused-vars": [2, { "vars": "all", "args": "none" }],
 
 		"brace-style": [2, "1tbs", { "allowSingleLine": true }],
 		"camelcase": [1, { "properties": "never" }], // added for UI5 WebComponents
@@ -104,7 +201,7 @@ module.exports = {
 		"no-new-object": 2,
 		"no-spaced-func": 2,
 		"quote-props": [2, "as-needed", { "keywords": true, "unnecessary": false }],
-		"semi-spacing": [1, {"before": false, "after": true}],
+		"semi-spacing": [1, { "before": false, "after": true }],
 		"semi": 2,
 		"keyword-spacing": 2,
 		"space-infix-ops": 2,