@ui5/webcomponents-tools 0.0.0-dff5837d7 → 0.0.0-ec448881d

package/components-package/wdio.sync.js

@@ -0,0 +1,360 @@
+exports.config = {
+	//
+	// ====================
+	// Runner Configuration
+	// ====================
+	//
+	// WebdriverIO allows it to run your tests in arbitrary locations (e.g. locally or
+	// on a remote machine).
+	runner: 'local',
+
+	//
+	// ==================
+	// Specify Test Files
+	// ==================
+	// Define which test specs should run. The pattern is relative to the directory
+	// from which `wdio` was called. Notice that, if you are calling `wdio` from an
+	// NPM script (see https://docs.npmjs.com/cli/run-script) then the current working
+	// directory is where your package.json resides, so `wdio` will be called from there.
+	//
+	specs: [
+		'./test/specs/**/*.js'
+	],
+	// Patterns to exclude.
+	exclude: [
+		// 'path/to/excluded/files'
+	],
+	//
+	// ============
+	// Capabilities
+	// ============
+	// Define your capabilities here. WebdriverIO can run multiple capabilities at the same
+	// time. Depending on the number of capabilities, WebdriverIO launches several test
+	// sessions. Within your capabilities you can overwrite the spec and exclude options in
+	// order to group specific specs to a specific capability.
+	//
+	// First, you can define how many instances should be started at the same time. Let's
+	// say you have 3 different capabilities (Chrome, Firefox, and Safari) and you have
+	// set maxInstances to 1; wdio will spawn 3 processes. Therefore, if you have 10 spec
+	// files and you set maxInstances to 10, all spec files will get tested at the same time
+	// and 30 processes will get spawned. The property handles how many capabilities
+	// from the same test should run tests.
+	//
+	maxInstances: 10,
+	//
+	// If you have trouble getting all important capabilities together, check out the
+	// Sauce Labs platform configurator - a great tool to configure your capabilities:
+	// https://docs.saucelabs.com/reference/platforms-configurator
+	//
+	capabilities: [{
+		// maxInstances can get overwritten per capability. So if you have an in-house Selenium
+		// grid with only 5 firefox instances available you can make sure that not more than
+		// 5 instances get started at a time.
+		maxInstances: process.env.TRAVIS ? 1 : 5,
+		//
+		browserName: 'chrome',
+		'goog:chromeOptions': {
+			// to run chrome headless the following flags are required
+			// (see https://developers.google.com/web/updates/2017/04/headless-chrome)
+			args: ['--headless', '--disable-gpu'],
+			// args: ['--disable-gpu'],
+		}
+	}],
+	//
+	// port to find chromedriver
+	port: 9515, // default
+	// ===================
+	// Test Configurations
+	// ===================
+	// Define all options that are relevant for the WebdriverIO instance here
+	//
+	// Level of logging verbosity: trace | debug | info | warn | error
+	logLevel: 'error',
+	//
+	// Warns when a deprecated command is used
+	deprecationWarnings: true,
+	//
+	// If you only want to run your tests until a specific amount of tests have failed use
+	// bail (default is 0 - don't bail, run all tests).
+	bail: 0,
+	//
+	// Set a base URL in order to shorten url command calls. If your `url` parameter starts
+	// with `/`, the base url gets prepended, not including the path portion of your baseUrl.
+	// If your `url` parameter starts without a scheme or `/` (like `some/path`), the base url
+	// gets prepended directly.
+	baseUrl: undefined, // This is important since WDIO 7+ does not accept an empty string for baseUrl
+	path: '',
+	//
+	// Default timeout for all waitFor* commands.
+	waitforTimeout: 10000,
+	//
+	// Default timeout in milliseconds for request
+	// if Selenium Grid doesn't send response
+	connectionRetryTimeout: 90000,
+	//
+	// Default request retries count
+	connectionRetryCount: 3,
+	//
+	// Test runner services
+	// Services take over a specific job you don't want to take care of. They enhance
+	// your test setup with almost no effort. Unlike plugins, they don't add new
+	// commands. Instead, they hook themselves up into the test process.
+	services: ['chromedriver'],
+	// options
+	chromeDriverArgs: ['--port=9515'], // default
+	// Framework you want to run your specs with.
+	// The following are supported: Mocha, Jasmine, and Cucumber
+	// see also: https://webdriver.io/docs/frameworks.html
+	//
+	// Make sure you have the wdio adapter package for the specific framework installed
+	// before running any tests.
+	framework: 'mocha',
+	//
+	// Test reporter for stdout.
+	// The only one supported by default is 'dot'
+	// see also: https://webdriver.io/docs/dot-reporter.html
+	reporters: ['dot', 'spec'],
+
+	//
+	// Options to be passed to Mocha.
+	// See the full list at http://mochajs.org/
+	mochaOpts: {
+		ui: 'bdd',
+		timeout: 60000
+	},
+	//
+	// =====
+	// Hooks
+	// =====
+	// WebdriverIO provides several hooks you can use to interfere with the test process in order to enhance
+	// it and to build services around it. You can either apply a single function or an array of
+	// methods to it. If one of them returns with a promise, WebdriverIO will wait until that promise got
+	// resolved to continue.
+	/**
+	 * Gets executed once before all workers get launched.
+	 * @param {Object} config wdio configuration object
+	 * @param {Array.<Object>} capabilities list of capabilities details
+	 */
+	// onPrepare: function (config, capabilities) {
+	// },
+	/**
+	 * Gets executed just before initialising the webdriver session and test framework. It allows you
+	 * to manipulate configurations depending on the capability or spec.
+	 * @param {Object} config wdio configuration object
+	 * @param {Array.<Object>} capabilities list of capabilities details
+	 * @param {Array.<String>} specs List of spec file paths that are to be run
+	 */
+	// beforeSession: function (config, capabilities, specs) {
+	// },
+	/**
+	 * Gets executed before test execution begins. At this point you can access to all global
+	 * variables like `browser`. It is the perfect place to define custom commands.
+	 * @param {Array.<Object>} capabilities list of capabilities details
+	 * @param {Array.<String>} specs List of spec file paths that are to be run
+	 */
+	before: function (capabilities, specs) {
+		browser.addCommand("isFocusedDeep", function () {
+			return browser.execute(function (elem) {
+				let activeElement = document.activeElement;
+
+				while (activeElement.shadowRoot) {
+					if (activeElement.shadowRoot.activeElement) {
+						activeElement = activeElement.shadowRoot.activeElement;
+					} else {
+						break;
+					}
+				}
+				return elem === activeElement;
+			}, this);
+		}, true);
+
+		browser.addCommand("isFocusedDeepElement", function (element) {
+			return browser.execute(function (elem, element, done) {
+				let activeElement = document.activeElement;
+
+				while (activeElement.shadowRoot) {
+					if (activeElement.shadowRoot.activeElement) {
+						activeElement = activeElement.shadowRoot.activeElement;
+					} else {
+						break;
+					}
+				}
+				done(element === activeElement);
+			}, this, element);
+		}, true);
+
+		browser.addCommand("setProperty", function(property, value) {
+			return browser.execute((elem, property, value) => {
+				return elem[property] = value;
+			}, this, property, value);
+		}, true);
+
+		browser.addCommand("setAttribute", function(attribute, value) {
+			return browser.execute((elem, attribute, value) => {
+				return elem.setAttribute(attribute, value);
+			}, this, attribute, value);
+		}, true);
+
+		browser.addCommand("removeAttribute", function(attribute) {
+			return browser.execute((elem, attribute) => {
+				return elem.removeAttribute(attribute);
+			}, this, attribute);
+		}, true);
+
+		browser.addCommand("hasClass", function(className) {
+			return browser.execute((elem, className) => {
+				return elem.classList.contains(className);
+			}, this, className);
+		}, true);
+
+		browser.addCommand("getStaticAreaItemClassName", function(selector) {
+			return browser.execute(async (selector) => {
+				const staticAreaItem = await document.querySelector(selector).getStaticAreaItemDomRef();
+				return staticAreaItem.host.classList[0];
+			}, selector);
+		}, false);
+	},
+	/**
+	 * Runs before a WebdriverIO command gets executed.
+	 * @param {String} commandName hook command name
+	 * @param {Array} args arguments that command would receive
+	 */
+	beforeCommand: function (commandName, args) {
+		const waitFor = [
+			"$",
+			"$$",
+			"getAttribute",
+			"getCSSProperty",
+			"getHTML",
+			"getProperty",
+			"getSize",
+			"getStaticAreaItemClassName", // custom
+			"getText",
+			"getValue",
+			"hasClass", // custom
+			"isDisplayed",
+			"isDisplayedInViewport",
+			"isEnabled",
+			"isExisting",
+			"isFocused",
+			"isFocusedDeep", // custom
+			"isFocusedDeepElement", // custom
+			"shadow$",
+			"shadow$$",
+		];
+		if (waitFor.includes(commandName)) {
+			browser.executeAsync(function (done) {
+				window["sap-ui-webcomponents-bundle"].renderFinished().then(done);
+			});
+		}
+	},
+
+	/**
+	 * Hook that gets executed before the suite starts
+	 * @param {Object} suite suite details
+	 */
+	// beforeSuite: function (suite) {
+	// },
+	/**
+	 * Function to be executed before a test (in Mocha/Jasmine) or a step (in Cucumber) starts.
+	 * @param {Object} test test details
+	 */
+	// beforeTest: function (test) {
+	// },
+	/**
+	 * Hook that gets executed _before_ a hook within the suite starts (e.g. runs before calling
+	 * beforeEach in Mocha)
+	 */
+	// beforeHook: function () {
+	// },
+	/**
+	 * Hook that gets executed _after_ a hook within the suite starts (e.g. runs after calling
+	 * afterEach in Mocha)
+	 */
+	// afterHook: function () {
+	// },
+	/**
+	 * Function to be executed after a test (in Mocha/Jasmine) or a step (in Cucumber) starts.
+	 * @param {Object} test test details
+	 */
+	// afterTest: function (test) {
+	// },
+	/**
+	 * Hook that gets executed after the suite has ended
+	 * @param {Object} suite suite details
+	 */
+	// afterSuite: function (suite) {
+	// },
+
+	/**
+	 * Runs after a WebdriverIO command gets executed
+	 * @param {String} commandName hook command name
+	 * @param {Array} args arguments that command would receive
+	 * @param {Number} result 0 - command success, 1 - command error
+	 * @param {Object} error error object if any
+	 */
+	afterCommand: function (commandName, args, result, error) {
+
+		// url -> set configuration first
+		if (commandName === "url" && !args[0].includes("do-not-change-configuration")) {
+			browser.execute(function() {
+				window["sap-ui-webcomponents-bundle"].configuration.setNoConflict(true);
+			});
+		}
+
+		const waitFor = [
+			"addValue",
+			"clearValue",
+			"click",
+			"doubleClick",
+			"dragAndDrop",
+			"keys",
+			"pause",
+			"removeAttribute", // custom
+			"setAttribute", // custom
+			"setProperty", // custom
+			"setValue",
+			"setWindowSize",
+			"touchAction",
+			"url"
+		];
+		if (waitFor.includes(commandName)) {
+			browser.executeAsync(function (done) {
+				window["sap-ui-webcomponents-bundle"].renderFinished().then(done);
+			});
+		}
+	},
+	/**
+	 * Gets executed after all tests are done. You still have access to all global variables from
+	 * the test.
+	 * @param {Number} result 0 - test pass, 1 - test fail
+	 * @param {Array.<Object>} capabilities list of capabilities details
+	 * @param {Array.<String>} specs List of spec file paths that ran
+	 */
+	// after: function (result, capabilities, specs) {
+	// },
+	/**
+	 * Gets executed right after terminating the webdriver session.
+	 * @param {Object} config wdio configuration object
+	 * @param {Array.<Object>} capabilities list of capabilities details
+	 * @param {Array.<String>} specs List of spec file paths that ran
+	 */
+	// afterSession: function (config, capabilities, specs) {
+	// },
+	/**
+	 * Gets executed after all workers got shut down and the process is about to exit.
+	 * @param {Object} exitCode 0 - success, 1 - fail
+	 * @param {Object} config wdio configuration object
+	 * @param {Array.<Object>} capabilities list of capabilities details
+	 * @param {<Object>} results object containing test results
+	 */
+	// onComplete: function(exitCode, config, capabilities, results) {
+	// },
+	/**
+	 * Gets executed when a refresh happens.
+	 * @param {String} oldSessionId session ID of the old session
+	 * @param {String} newSessionId session ID of the new session
+	 */
+	//onReload: function(oldSessionId, newSessionId) {
+	//}
+}

package/icons-collection/nps.js

@@ -2,24 +2,62 @@ const path = require("path");
 
 const LIB = path.join(__dirname, `../lib/`);
 
-const getScripts = () => {
+const createIconImportsCommand = (options) => {
+	if (!options.versions) {
+		return `node "${LIB}/create-icons/index.js" "${options.collectionName}"`;
+	}
+
+	const command  = { default: "nps" };
+	options.versions.forEach((v) => {
+		command.default += ` build.icons.create${v}`;
+		command[`create${v}`] = `node "${LIB}/create-icons/index.js" "${options.collectionName}" "${v}"`;
+	});
+
+	return command;
+}
+
+const copyIconAssetsCommand = (options) => {
+	if (!options.versions) {
+		return 	{
+			default: "nps copy.json-imports copy.icon-collection",
+			"json-imports": `node "${LIB}/copy-and-watch/index.js" --silent "src/**/*.js" dist/`,
+			"icon-collection": `node "${LIB}/copy-and-watch/index.js" --silent "src/*.json" dist/generated/assets/`,
+		}
+	}
+
+	const command  = {
+		default: "nps copy.json-imports ",
+		"json-imports": `node "${LIB}/copy-and-watch/index.js" --silent "src/**/*.js" dist/`,
+	};
+
+	options.versions.forEach((v) => {
+		command.default += ` copy.icon-collection${v}`;
+		command[`icon-collection${v}`] = `node "${LIB}/copy-and-watch/index.js" --silent "src/${v}/*.json" dist/generated/assets/${v}/`;
+	});
+
+	return command;
+}
+
+const getScripts = (options) => {
+	const createJSImportsCmd = createIconImportsCommand(options);
+	const copyAssetsCmd = copyIconAssetsCommand(options);
 
 	const scripts = {
 		clean: "rimraf dist",
-		copy: {
-			default: "nps copy.json-imports copy.icon-collections",
-			"json-imports": `node "${LIB}/copy-and-watch/index.js" "src/**/*.js" dist/`,
-			"icon-collections": `node "${LIB}/copy-and-watch/index.js" "src/icon-collections/**/*.json" dist/generated/assets/icon-collections/`
-		},
+		copy: copyAssetsCmd,
 		build: {
-			default: "nps clean copy build.i18n build.icons",
+			default: `nps clean copy build.i18n build.icons build.jsonImports`,
 			i18n: {
 				default: "nps build.i18n.defaultsjs build.i18n.json",
 				defaultsjs: `mkdirp dist/generated/i18n && node "${LIB}/i18n/defaults.js" src/i18n dist/generated/i18n`,
 				json: `mkdirp dist/generated/assets/i18n && node "${LIB}/i18n/toJSON.js" src/i18n dist/generated/assets/i18n`,
 			},
-			icons: `node "${LIB}/create-icons/index.js"`,
-		}
+			jsonImports: {
+				default: "mkdirp dist/generated/json-imports && nps build.jsonImports.i18n",
+				i18n: `node "${LIB}/generate-json-imports/i18n.js" dist/generated/assets/i18n dist/generated/json-imports`,
+			},
+			icons: createJSImportsCmd,
+		},
 	};
 
 	return scripts;

package/lib/copy-and-watch/index.js

@@ -1,16 +1,39 @@
+/*
+MIT License
+
+Copyright (c) 2017
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+ */
+
 const fs = require('fs');
 const path = require('path');
 const chokidar = require('chokidar');
 const glob = require('glob');
 const globParent = require('glob-parent');
-require('colors');
 
 /* CODE */
 
 const args = process.argv.slice(2);
 const options = {};
 
-['watch', 'clean', 'skip-initial-copy', 'safe'].forEach(key => {
+['watch', 'clean', 'skip-initial-copy', 'safe',  'silent'].forEach(key => {
 	const index = args.indexOf(`--${key}`);
 	if (index >= 0) {
 		options[key] = true;
@@ -64,12 +87,12 @@ const copy = from => {
 		return;
 	}
 	fs.writeFileSync(to, fs.readFileSync(from));
-	console.log('[COPY]'.yellow, from, 'to'.yellow, to);
+	options.silent || console.log('[COPY]'.yellow, from, 'to'.yellow, to);
 };
 const remove = from => {
 	const to = findTarget(from);
 	fs.unlinkSync(to);
-	console.log('[DELETE]'.yellow, to);
+	options.silent || console.log('[DELETE]'.yellow, to);
 };
 const rimraf = dir => {
 	if (fs.existsSync(dir)) {
@@ -110,7 +133,9 @@ if (options.watch) {
 
 	chokidar
 		.watch(sources, chokidarOptions)
-		.on('ready', () => sources.forEach(s => console.log('[WATCH]'.yellow, s)))
+		.on('ready', () => sources.forEach(s => {
+			options.silent || console.log('[WATCH]'.yellow, s);
+		}))
 		.on('add', copy)
 		.on('addDir', copy)
 		.on('change', copy)

package/lib/copy-list/index.js

@@ -0,0 +1,28 @@
+const fs = require("fs").promises;
+const path = require("path");
+
+const fileList = process.argv[2];
+const dest = process.argv[3];
+const src = "../../node_modules/@openui5/sap.ui.core/src/";
+
+const generate = async () => {
+	const filesToCopy = (await fs.readFile(fileList)).toString();
+	// console.log(filesToCopy);
+
+	// Support full-line comments starting with # in the used-modules.txt file
+	const shouldCopy = file => file.length && !file.startsWith("#");
+
+	const trimFile = file => file.trim();
+
+	return filesToCopy.split("\n").map(trimFile).filter(shouldCopy).map(async moduleName => {
+		const srcPath = path.join(src, moduleName);
+		const destPath = path.join(dest, moduleName);
+
+		await fs.mkdir(path.dirname(destPath), { recursive: true });
+		return fs.copyFile(srcPath, destPath);
+	});
+};
+
+generate().then(() => {
+	console.log("Files copied.");
+});

package/lib/create-icons/index.js

@@ -1,54 +1,82 @@
-const fs = require("fs");
-const path = require("path");
-const mkdirp = require("mkdirp");
-
-const srcDir = `src/icon-collections/`;
-const destDir = `dist/icons/`;
-
-mkdirp.sync(destDir);
-
-const template = (name, pathData, ltr) => `import { registerIcon } from "@ui5/webcomponents-base/dist/SVGIconRegistry.js";
-
-const name = "${name}";
-const pathData = "${pathData}";
-const ltr = ${ltr};
-
-registerIcon(name, { pathData, ltr});
-
-export default { pathData };`;
-
-const accTemplate = (name, pathData, ltr, accData) => `import { registerIcon } from "@ui5/webcomponents-base/dist/SVGIconRegistry.js";
-import { ${accData.key} } from "../generated/i18n/i18n-defaults.js";
-
-const name = "${name}";
-const pathData = "${pathData}";
-const ltr = ${ltr};
-const accData = ${accData.key};
-
-registerIcon(name, { pathData, ltr, accData });
-
-export default { pathData, accData };`;
-
-
-const createIcons = (file) => {
-	const json = JSON.parse(fs.readFileSync(file));
-
-	for (let name in json.data) {
-		const iconData = json.data[name];
-		const pathData = iconData.path;
-		const ltr = !!iconData.ltr;
-		const acc = iconData.acc;
-
-		const content = acc ? accTemplate(name, pathData, ltr, acc) : template(name, pathData, ltr);
-
-		fs.writeFileSync(path.join(destDir, `${name}.js`), content);
-	}
-
-};
-
-fs.readdirSync(srcDir).forEach(collectionFile => {
-	createIcons(path.join(srcDir, collectionFile));
-});
-
-
-
+const fs = require("fs").promises;
+const path = require("path");
+
+const collectionName = process.argv[2] || "SAP-icons";
+const collectionVersion = process.argv[3];
+const srcFile = collectionVersion ? path.normalize(`src/${collectionVersion}/${collectionName}.json`) : path.normalize(`src/${collectionName}.json`);
+const destDir = collectionVersion ? path.normalize(`dist/${collectionVersion}/`) : path.normalize("dist/");
+
+const iconTemplate = (name, pathData, ltr, collection, packageName) => `import { registerIcon } from "@ui5/webcomponents-base/dist/asset-registries/Icons.js";
+
+const name = "${name}";
+const pathData = "${pathData}";
+const ltr = ${ltr};
+const accData = null;
+const collection = "${collection}";
+const packageName = "${packageName}";
+
+registerIcon(name, { pathData, ltr, collection, packageName });
+
+export default "${name}";
+export { pathData, ltr, accData };`;
+
+
+const iconAccTemplate = (name, pathData, ltr, accData, collection, packageName) => `import { registerIcon } from "@ui5/webcomponents-base/dist/asset-registries/Icons.js";
+import { ${accData.key} } from "../generated/i18n/i18n-defaults.js";
+
+const name = "${name}";
+const pathData = "${pathData}";
+const ltr = ${ltr};
+const accData = ${accData.key};
+const collection = "${collection}";
+const packageName = "${packageName}";
+
+registerIcon(name, { pathData, ltr, accData, collection, packageName });
+
+export default "${name}";
+export { pathData, ltr, accData };`;
+
+
+
+const collectionTemplate = (name) => `import { isThemeFamily } from "@ui5/webcomponents-base/dist/config/Theme.js";
+import {pathData as pathDataV5, ltr, accData} from "./v5/${name}.js";
+import {pathData as pathDataV4} from "./v4/${name}.js";
+
+const pathData = isThemeFamily("sap_horizon") ? pathDataV5 : pathDataV4;
+
+export default "${name}";
+export { pathData, ltr, accData };`;
+
+
+const svgTemplate = (pathData) => `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+	<path d="${pathData}"/>
+</svg>`;
+
+const createIcons = async (file) => {
+	await fs.mkdir(destDir, { recursive: true });
+
+	const json = JSON.parse(await fs.readFile(file));
+
+	const promises = [];
+	for (let name in json.data) {
+		const iconData = json.data[name];
+		const pathData = iconData.path;
+		const ltr = !!iconData.ltr;
+		const acc = iconData.acc;
+
+		const content = acc ? iconAccTemplate(name, pathData, ltr, acc, json.collection, json.packageName) : iconTemplate(name, pathData, ltr, json.collection, json.packageName);
+
+		promises.push(fs.writeFile(path.join(destDir, `${name}.js`), content));
+		promises.push(fs.writeFile(path.join(destDir, `${name}.svg`), svgTemplate(pathData)));
+
+		if (json.version) {
+			promises.push(fs.writeFile(path.join(path.normalize("dist/"), `${name}.js`), collectionTemplate(name)));
+		}
+	}
+
+	return Promise.all(promises);
+};
+
+createIcons(srcFile).then(() => {
+	console.log("Icons created.");
+});