refactor(cli): improve code typing and directory structure

Move all cli files to the `cli` directory.

Replace `takeWhile.d.ts` with jsdoc types for `takeWhile` function.

Fix types.

Remove the ability to call cli functions directly (e.g. calling `node copy.js`). Now the same-named functions from cli commands are exported, and all commands can be called via `cli.js`.

And some other improvements.

Author: nakrovati

cli.js

@@ -1,3 +1,4 @@
+// @ts-check
 import { program } from "commander";
 
 import {
@@ -6,43 +7,67 @@ import {
   configureStyles,
   copyProjectToDist,
   createFrameworkZipArchive,
-  updateLockfilesOfAllFrameworks,
+  updateFrameworkLockfiles,
+  rebuildAllFrameworks,
+  rebuildSingleFramework,
 } from "./cli/index.js";
 
-program.command("zip").action(createFrameworkZipArchive);
+program.command("zip").description("Create a zip archive of frameworks").action(createFrameworkZipArchive);
 
-program.command("copy").action(copyProjectToDist);
+program.command("copy").description("Copy project to dist directory").action(copyProjectToDist);
 
 program
   .command("check-obsolete")
+  .description("Check for obsolete frameworks in the frameworks directory")
   .option("--debug [boolean]", "", false)
   .action((options) => {
     checkObsoleteFrameworks(options);
   });
 
 program
   .command("cleanup")
+  .description(
+    "Clean all framework directories of package-lock.json, yarn-lock and the elm-stuff, node-modules, bower-components and dist directories"
+  )
   .option("--frameworks-dir-path [string]", "", "frameworks")
-  .option("--frameworks-types [Array<string>]", "", ["keyed", "non-keyed"])
+  .option("--frameworks-types [types...]", "", ["keyed", "non-keyed"])
   .action((options) => {
     cleanFrameworkDirectories(options);
   });
 
 program
   .command("update-lockfiles")
+  .description("Update lockfiles for all frameworks in the frameworks directory")
   .option("--frameworks-dir-path [string]", "", "frameworks")
-  .option("--frameworks-types [Array<string>]", "", ["keyed", "non-keyed"])
-  .option("--latest-lockfile-version [number]", "", 3)
+  .option("--frameworks-types [types...]", "", ["keyed", "non-keyed"])
+  .option("--latest-lockfile-version [number]", "", "3")
   .action((options) => {
-    updateLockfilesOfAllFrameworks(options);
+    updateFrameworkLockfiles(options);
   });
 
 program
   .command("configure-styles")
+  .description("Configure CSS styles for all frameworks in the frameworks directory")
   .option("--bootstrap [boolean]", "", false)
   .option("--minimal [boolean]", "", false)
   .action(async (options) => {
     await configureStyles(options);
   });
 
+program
+  .command("rebuild-all")
+  .option("--ci [boolean]", "", false)
+  .option("--restart-with-framework [string]", "", "")
+  .action((options) => {
+    rebuildAllFrameworks({ restartWithFramework: options.restartWithFramework, useCi: options.ci });
+  });
+
+program
+  .command("rebuild-single")
+  .option("--frameworks [frameworks...]", "", [])
+  .option("--ci [boolean]", "", false)
+  .action((options) => {
+    rebuildSingleFramework(options);
+  });
+
 program.parse();

cli/check-obsolete.js

@@ -1,9 +1,10 @@
+// @ts-check
 import JSON5 from "json5";
 import { execSync } from "node:child_process";
 import * as fs from "node:fs";
 import path from "node:path";
 
-import { getFrameworks } from "../utils/frameworks/index.js";
+import { getFrameworks } from "./helpers/frameworks.js";
 
 /**
  * @typedef {Object} Framework
@@ -81,8 +82,10 @@ const manualChecks = [];
  * @param {Object} options
  * @param {boolean} options.debug
  */
-function checkObsoleteFrameworks(options) {
-  const DEBUG = options.debug ?? false;
+export function checkObsoleteFrameworks({ debug }) {
+  console.log("Check obsolete frameworks", "debug", debug);
+
+  const DEBUG = debug;
 
   for (const { name, type } of frameworks) {
     const frameworkPath = path.join("frameworks", type, name);
@@ -132,5 +135,3 @@ function checkObsoleteFrameworks(options) {
   if (manualChecks.length > 0)
     console.warn("\nThe following frameworks must be checked manually\n" + manualChecks.join("\n"));
 }
-
-export { checkObsoleteFrameworks };

cli/cleanup.js

@@ -1,3 +1,4 @@
+// @ts-check
 import * as fs from "node:fs";
 import path from "node:path";
 
@@ -22,8 +23,14 @@ function deleteFrameworkFiles(frameworkPath, filesToDelete) {
  * @param {string} options.frameworksDirPath
  * @param {Array<string>} options.frameworksTypes
  */
-function cleanFrameworkDirectories(options) {
-  const { frameworksDirPath, frameworksTypes } = options;
+export function cleanFrameworkDirectories({ frameworksDirPath, frameworksTypes }) {
+  console.log(
+    "Clean framework directories",
+    "frameworksDirPath",
+    frameworksDirPath,
+    "frameworksTypes",
+    frameworksTypes
+  );
 
   for (const frameworkType of frameworksTypes) {
     const frameworkDir = path.resolve(frameworksDirPath, frameworkType);
@@ -36,5 +43,3 @@ function cleanFrameworkDirectories(options) {
     }
   }
 }
-
-export { cleanFrameworkDirectories };

cli/configure-styles.js

@@ -1,3 +1,4 @@
+// @ts-check
 import * as fs from "node:fs";
 import path from "node:path";
 
@@ -19,12 +20,12 @@ async function copyAndGenerateSharedStyles(sourceCss, mainCss) {
  * @param {Object} options
  * @param {boolean} options.bootstrap
  * @param {boolean} options.minimal
- * @returns
  */
-async function configureStyles(options) {
-  const { bootstrap, minimal } = options;
+export async function configureStyles({ bootstrap, minimal }) {
+  console.log("Configure styles", "bootstrap", bootstrap, "minimal", minimal);
 
   try {
+    // @ts-ignore
     if (bootstrap ^ minimal) {
       console.log("ERROR: You must either choose bootstrap or minimal");
       return;
@@ -43,5 +44,3 @@ async function configureStyles(options) {
     console.error("An error occurred:", error.message);
   }
 }
-
-export { configureStyles };

cli/copy.js

@@ -1,3 +1,4 @@
+// @ts-check
 import * as fs from "node:fs";
 import path from "node:path";
 
@@ -88,7 +89,9 @@ function processDirectories() {
  * Creates a dist directory, copies `table.html` from `webdriver-ts` and `index.html` into it,
  * and then starts copying the project folders recursively using `processDirectories()`.
  */
-function copyProjectToDist() {
+export function copyProjectToDist() {
+  console.log("Copying project to dist directory");
+
   fs.rmSync("dist", { force: true, recursive: true });
   fs.mkdirSync(path.join("dist", "webdriver-ts"), { recursive: true });
 
@@ -97,5 +100,3 @@ function copyProjectToDist() {
 
   processDirectories();
 }
-
-export { copyProjectToDist };

utils/frameworks/index.js renamed to cli/helpers/frameworks.js

@@ -1,3 +1,4 @@
+// @ts-check
 import * as fs from "node:fs";
 import path from "node:path";
 

cli/index.js

@@ -2,5 +2,7 @@ export { checkObsoleteFrameworks } from "./check-obsolete.js";
 export { cleanFrameworkDirectories } from "./cleanup.js";
 export { configureStyles } from "./configure-styles.js";
 export { copyProjectToDist } from "./copy.js";
-export { updateLockfilesOfAllFrameworks } from "./update-lockfiles.js";
+export { updateFrameworkLockfiles } from "./update-lockfiles.js";
 export { createFrameworkZipArchive } from "./zip.js";
+export { rebuildAllFrameworks } from "./rebuild-all-frameworks.js";
+export { rebuildSingleFramework } from "./rebuild-single-framework.js";

rebuild-all.js renamed to cli/rebuild-all-frameworks.js

@@ -1,11 +1,9 @@
+// @ts-check
 import { execSync } from "node:child_process";
 import * as fs from "node:fs";
 import path from "node:path";
-import yargs from "yargs";
 import { takeWhile } from "./utils/common/index.js";
-import { getFrameworks } from "./utils/frameworks/index.js";
-import { hideBin } from "yargs/helpers";
-import esMain from "es-main";
+import { getFrameworks } from "./helpers/frameworks.js";
 
 /*
 This script rebuilds all frameworks from scratch,
@@ -66,7 +64,7 @@ function deleteFrameworkFiles(frameworkPath, filesToDelete) {
  * @returns
  */
 function buildFramework(framework, useCi) {
-  console.log("Building framework:", framework);
+  console.log("Building framework:", "framework", framework, "ci", useCi);
 
   const { type, name } = framework;
   const frameworkPath = path.join("frameworks", type, name);
@@ -82,14 +80,9 @@ function buildFramework(framework, useCi) {
   // }
   // rsync(keyed,name);
 
-  const filesToDelete = [
-    "yarn-lock",
-    "dist",
-    "elm-stuff",
-    "bower_components",
-    "node_modules",
-    "output",
-  ].concat(useCi ? [] : ["package-lock.json"]);
+  const filesToDelete = ["yarn-lock", "dist", "elm-stuff", "bower_components", "node_modules", "output"].concat(
+    useCi ? [] : ["package-lock.json"]
+  );
 
   deleteFrameworkFiles(frameworkPath, filesToDelete);
 
@@ -101,10 +94,13 @@ function buildFramework(framework, useCi) {
 }
 
 /**
- * @param {string} restartWithFramework
- * @param {boolean} useCi
+ * @param {Object} options
+ * @param {string} options.restartWithFramework
+ * @param {boolean} options.useCi
  */
-function buildFrameworks(restartWithFramework, useCi) {
+export function rebuildAllFrameworks({ restartWithFramework, useCi }) {
+  console.log("Rebuild all frameworks", "ci", useCi, "restartWith", restartWithFramework);
+
   const frameworks = getFrameworks();
 
   const skippableFrameworks = takeWhile(frameworks, (framework) =>
@@ -120,21 +116,3 @@ function buildFrameworks(restartWithFramework, useCi) {
 
   console.log("All frameworks were built!");
 }
-
-if (esMain(import.meta)) {
-  const args = yargs(hideBin(process.argv))
-    .usage("$0 [--ci keyed/framework1 ... non-keyed/frameworkN]")
-    .help()
-    .boolean("ci")
-    .default("ci", false)
-    .default("restartWith", "")
-    .describe("ci", "Use npm ci or npm install?")
-    .parseSync();
-
-  const useCi = args.ci;
-  const restartWithFramework = args.restartWith;
-
-  console.log("ARGS", args, "ci", useCi, "restartWith", restartWithFramework);
-
-  buildFrameworks(restartWithFramework, useCi);
-}

cli/rebuild-build-single.js

@@ -1,3 +1,4 @@
+// @ts-check
 import { execSync } from "node:child_process";
 import * as fs from "node:fs";
 import path from "node:path";
@@ -27,6 +28,7 @@ function runCommand(command, cwd = undefined) {
       throw `working directory ${cwd} doesn't exist.`;
     }
   }
+
   execSync(command, { stdio: "inherit", cwd });
 }
 
@@ -58,20 +60,14 @@ function rebuildFramework(framework, useCi) {
   const [keyed, name] = components;
   const frameworkPath = path.join("frameworks", keyed, name);
 
-  const filesToDelete = [
-    "yarn-lock",
-    "dist",
-    "elm-stuff",
-    "bower_components",
-    "node_modules",
-    "output",
-  ].concat(useCi ? [] : ["package-lock.json"]);
+  const filesToDelete = ["yarn-lock", "dist", "elm-stuff", "bower_components", "node_modules", "output"].concat(
+    useCi ? [] : ["package-lock.json"]
+  );
 
   deleteFrameworkFiles(frameworkPath, filesToDelete);
 
   const installCmd = `npm ${useCi ? "ci" : "install"}`;
   runCommand(installCmd, frameworkPath);
-
   const buildCmd = "npm run build-prod";
   runCommand(buildCmd, frameworkPath);
 }
@@ -81,9 +77,9 @@ function rebuildFramework(framework, useCi) {
  * @param {boolean} useCi
  */
 export function rebuildFrameworks(frameworks, useCi) {
-  console.log("rebuild-build-single.js started: useCi", useCi, "frameworks", frameworks);
+  console.log("Rebuild build single: useCi", useCi, "frameworks", frameworks);
 
-  if (!frameworks.length) {
+  if (frameworks.length === 0) {
     console.log("ERROR: Missing arguments. Command: rebuild keyed/framework1 non-keyed/framework2 ...");
     process.exit(1);
   }
@@ -94,4 +90,3 @@ export function rebuildFrameworks(frameworks, useCi) {
 
   console.log("rebuild-build-single.js finished: Build finsished sucessfully!");
 }
-

cli/rebuild-check-single.js

@@ -1,3 +1,4 @@
+// @ts-check
 import { execSync } from "node:child_process";
 
 /*
@@ -23,10 +24,11 @@ function runCommand(command, cwd = undefined) {
 }
 
 /**
- * @param {string[]} frameworks
+ * @param {Object} options
+ * @param {Array<string>} options.frameworks
  */
-export function rebuildCheckSingle(frameworks) {
-  console.log("rebuild-check-single.js started: frameworks", frameworks);
+export function rebuildCheckSingle({ frameworks }) {
+  console.log("Rebuild check single:", "frameworks", frameworks);
 
   const frameworkNames = frameworks.join(" ");