@hubspot/ui-extensions-dev-server 0.2.0 → 0.3.0

package/package.json

@@ -1,51 +1,53 @@
 {
   "name": "@hubspot/ui-extensions-dev-server",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "",
   "main": "index.js",
   "scripts": {
-    "test": "echo 'test'"
+    "test": "jest",
+    "jest": "jest --watch"
   },
   "publishConfig": {
     "access": "public"
   },
   "files": [
-    "README.md",
-    "build.js",
-    "cli.js",
-    "config.js",
-    "constants.js",
-    "dev.js",
-    "logger.js",
-    "run.js",
-    "utils.js",
-    "tests/runTests.js",
-    "tests/testBuild.js",
-    "tests/testDevServer.js",
-    "tests/utils.js",
-    "plugins/*",
+    "cli/logger.js",
+    "cli/run.js",
+    "cli/userInput.js",
+    "cli/utils.js",
+    "lib/plugins/*",
+    "lib/build.js",
+    "lib/config.js",
+    "lib/constants.js",
+    "lib/dev.js",
+    "lib/extensions.js",
+    "lib/server.js",
+    "lib/utils.js",
     "index.js",
-    "server.js"
+    "README.md"
   ],
   "license": "MIT",
   "dependencies": {
-    "axios": "^1.4.0",
     "command-line-args": "^5.2.1",
     "command-line-usage": "^7.0.1",
     "console-log-colors": "^0.4.0",
     "cors": "^2.8.5",
     "express": "^4.18.2",
-    "process": "^0.11.10",
     "prompts": "^2.4.2",
-    "vite": "^4.0.4",
+    "vite": "^4.0.4"
+  },
+  "devDependencies": {
+    "axios": "^1.4.0",
+    "jest": "^29.5.0",
     "ws": "^8.13.0"
   },
   "bin": {
-    "hs-ui-extensions-dev-server": "run.js"
+    "hs-ui-extensions-dev-server": "./cli/run.js"
   },
   "eslintConfig": {
     "env": {
-      "node": true
+      "node": true,
+      "jest": true
     }
   },
   "engines": {
@@ -59,5 +61,5 @@
       "optional": true
     }
   },
-  "gitHead": "ab7ad192e9d98163d2613d77f68677e3b48898aa"
+  "gitHead": "0b20c005a9564bbde58c22ce21959c713f354607"
 }

package/build.js

@@ -1,60 +0,0 @@
-const { build } = require('vite');
-const { ROLLUP_OPTIONS } = require('./constants');
-const manifestPlugin = require('./plugins/manifestPlugin');
-
-async function buildAllExtensions(config, outputDir) {
-  const extensionKeys = Object.keys(config);
-  for (let i = 0; i < extensionKeys.length; ++i) {
-    const { data } = config[extensionKeys[i]];
-
-    await buildSingleExtension({
-      file: data?.module.file,
-      outputFileName: data?.output,
-      outputDir,
-      emptyOutDir: i === 0,
-      plugins: {
-        rollup: [manifestPlugin({ output: data?.output })],
-      },
-    });
-  }
-}
-
-async function buildSingleExtension({
-  file,
-  outputFileName,
-  outputDir,
-  emptyOutDir = true,
-  plugins = { rollup: [], vite: [] },
-  minify = false,
-  root = process.cwd(), // This is the vite default, so using that as our default
-}) {
-  await build({
-    root,
-    define: {
-      'process.env.NODE_ENV': JSON.stringify(
-        process.env.NODE_ENV || 'production'
-      ),
-    },
-    build: {
-      lib: {
-        entry: file,
-        name: outputFileName,
-        formats: ['iife'],
-        fileName: () => outputFileName,
-      },
-      rollupOptions: {
-        ...ROLLUP_OPTIONS,
-        plugins: [...(ROLLUP_OPTIONS.plugins || []), ...plugins?.rollup],
-      },
-      outDir: outputDir,
-      emptyOutDir,
-      minify,
-      plugins: plugins?.vite,
-    },
-  });
-}
-
-module.exports = {
-  buildAllExtensions,
-  buildSingleExtension,
-};

package/config.js

@@ -1,129 +0,0 @@
-const prompts = require('prompts');
-const logger = require('./logger');
-const path = require('path');
-const { MAIN_APP_CONFIG } = require('./constants');
-const { getUrlSafeFileName } = require('./utils');
-
-async function getExtensionConfig(configuration, extension) {
-  const extensionOptions = Object.keys(configuration);
-
-  if (
-    (extension && configuration[extension]) ||
-    extensionOptions.length === 1
-  ) {
-    const extensionToRun = extension || extensionOptions[0];
-    const { data } = configuration[extensionToRun];
-    return {
-      key: extensionToRun,
-      name: data.title,
-      file: data?.module?.file,
-      output: data?.output,
-      appName: data?.appName,
-    };
-  }
-
-  const response = await prompts(
-    [
-      {
-        type: 'select',
-        name: 'extension',
-        message: 'Which extension would you like to run?',
-        choices: extensionOptions.map(option => {
-          const { data } = configuration[option];
-          return {
-            title: option,
-            value: {
-              key: option,
-              name: data?.title,
-              file: data?.module?.file,
-              output: data?.output,
-              appName: data?.appName,
-            },
-          };
-        }),
-      },
-    ],
-    {
-      onCancel: () => {
-        process.exit(0); // When the user cancels interaction, exit the script
-      },
-    }
-  );
-  return response.extension;
-}
-
-function _loadRequiredConfigFile(filePath) {
-  let config;
-  try {
-    config = require(filePath);
-  } catch (e) {
-    logger.error(
-      `Unable to load ${filePath} file.  Please make sure you are running the command from the src/app/extensions directory and that ${filePath} exists`
-    );
-    process.exit(1);
-  }
-  return config;
-}
-
-function loadConfig() {
-  // app.json is one level up from the extensions directory, which is where these commands
-  // will need to be ran from, the extensions directory
-  const configPath = path.join(process.cwd(), `../${MAIN_APP_CONFIG}`);
-
-  const mainAppConfig = _loadRequiredConfigFile(configPath);
-
-  const crmCardsSubConfigFiles = mainAppConfig?.extensions?.crm?.cards;
-  if (!crmCardsSubConfigFiles) {
-    logger.error(
-      `The "extensions.crm.cards" array in ${configPath} is missing, it is a required configuration property`
-    );
-    process.exit(1);
-  } else if (crmCardsSubConfigFiles.length === 0) {
-    logger.error(
-      `The "extensions.crm.cards" array in ${configPath} is empty, it is a required configuration property.`
-    );
-    process.exit(1);
-  }
-
-  const outputConfig = {};
-
-  crmCardsSubConfigFiles.forEach(card => {
-    const extensionsRemoved = card.file.replace('extensions/', '');
-    const cardConfigPath = path.join(process.cwd(), extensionsRemoved);
-    // Get the path to the config file relative to the extensions directory
-    const configPathRelativeToExtensions = path.parse(extensionsRemoved)?.dir;
-
-    try {
-      const cardConfig = require(cardConfigPath);
-
-      // Join the two relative paths
-      const entryPointPath = path.join(
-        configPathRelativeToExtensions,
-        cardConfig.data?.module?.file
-      );
-
-      cardConfig.data.module.file = entryPointPath;
-
-      outputConfig[entryPointPath] = cardConfig;
-      outputConfig[entryPointPath].data.output = getUrlSafeFileName(
-        entryPointPath
-      );
-      outputConfig[entryPointPath].data.appName = mainAppConfig.name;
-    } catch (e) {
-      let errorMessage = e?.message;
-      if (e?.code === 'MODULE_NOT_FOUND') {
-        errorMessage = `Unable to load "${cardConfigPath}" file. \nPlease make sure you are running the command from the src/app/extensions directory and that your card JSON config exists within it.`;
-      }
-
-      logger.error(errorMessage);
-      process.exit(1);
-    }
-  });
-
-  return outputConfig;
-}
-
-module.exports = {
-  loadConfig,
-  getExtensionConfig,
-};

package/dev.js

@@ -1,64 +0,0 @@
-const { createServer } = require('vite');
-const { getExtensionConfig } = require('./config');
-const startDevServer = require('./server');
-const devBuildPlugin = require('./plugins/devBuildPlugin');
-
-async function _createViteDevServer(
-  outputDir,
-  extensionConfig,
-  websocketPort,
-  baseMessage
-) {
-  return await createServer({
-    appType: 'custom',
-    mode: 'development',
-    server: {
-      middlewareMode: true,
-      hmr: {
-        port: websocketPort,
-      },
-      watch: {
-        ignored: ['**/src/app/extensions/dist/**/*'],
-      },
-    },
-    build: {
-      rollupOptions: {
-        input: extensionConfig?.file,
-        output: extensionConfig.output,
-      },
-    },
-    plugins: [devBuildPlugin({ extensionConfig, outputDir, baseMessage })],
-  });
-}
-
-async function startDevMode(
-  config,
-  outputDir,
-  expressPort,
-  webSocketPort,
-  extension
-) {
-  const extensionConfig = await getExtensionConfig(config, extension);
-  const baseMessage = Object.freeze({
-    appName: extensionConfig?.appName,
-    title: extensionConfig?.name,
-    callback: `http://hslocal.net:${expressPort}/${extensionConfig?.output}`,
-  });
-  const viteDevServer = await _createViteDevServer(
-    outputDir,
-    extensionConfig,
-    webSocketPort,
-    baseMessage
-  );
-  startDevServer(
-    outputDir,
-    expressPort,
-    webSocketPort,
-    baseMessage,
-    viteDevServer
-  );
-}
-
-module.exports = {
-  startDevMode,
-};

package/run.js

@@ -1,41 +0,0 @@
-#!/usr/bin/env node
-
-const { startDevMode } = require('./dev');
-const { loadConfig } = require('./config');
-const { buildAllExtensions, buildSingleExtension } = require('./build');
-const {
-  VITE_DEFAULT_PORT,
-  OUTPUT_DIR,
-  WEBSOCKET_PORT,
-} = require('./constants');
-const { parseArgs, showHelp } = require('./cli');
-const { getUrlSafeFileName } = require('./utils');
-const manifestPlugin = require('./plugins/manifestPlugin');
-
-const { DEV_MODE, BUILD_MODE, extension, help } = parseArgs();
-
-if (help || !(DEV_MODE || BUILD_MODE)) {
-  showHelp(OUTPUT_DIR);
-}
-
-if (DEV_MODE) {
-  startDevMode(
-    loadConfig(),
-    OUTPUT_DIR,
-    VITE_DEFAULT_PORT,
-    WEBSOCKET_PORT,
-    extension
-  );
-} else if (BUILD_MODE) {
-  if (extension) {
-    const output = getUrlSafeFileName(extension);
-    buildSingleExtension({
-      file: extension,
-      outputFileName: output,
-      outputDir: OUTPUT_DIR,
-      plugins: { rollup: [manifestPlugin({ output })] },
-    });
-  } else {
-    buildAllExtensions(loadConfig(), OUTPUT_DIR);
-  }
-}

package/tests/runTests.js

@@ -1,50 +0,0 @@
-#!/usr/bin/env node
-
-const { testBuild } = require('./testBuild');
-const { testDevServer } = require('./testDevServer');
-const logger = require('../logger');
-const { generateSpec } = require('./utils');
-
-let devServerProcess;
-
-// Overwrite console.debug to only log when in DEBUG mode
-console.debug = (...args) => {
-  if (process.env.DEBUG) {
-    console.log(...args);
-  }
-};
-
-function handleFailure() {
-  if (devServerProcess) {
-    devServerProcess.kill();
-  }
-}
-
-process.on('SIGINT', handleFailure);
-process.on('SIGTERM', handleFailure);
-
-process.on('uncaughtException', e => {
-  console.error(e);
-  handleFailure();
-});
-
-// eslint-disable-next-line no-floating-promise/no-floating-promise
-(async () => {
-  try {
-    const spec = generateSpec();
-
-    logger.warn(
-      `Running tests for the following entrypoints: [\n\t${spec.build.entrypoints.join(
-        ',\n\t'
-      )}\n]`
-    );
-
-    await testBuild(logger, spec.build);
-    testDevServer(logger, devServerProcess, spec.dev);
-  } catch (e) {
-    console.error(e.message);
-    logger.error('Tests failed 😭');
-    handleFailure();
-    process.exit(1);
-  }
-})();

package/tests/testBuild.js

@@ -1,82 +0,0 @@
-const { execSync } = require('child_process');
-const fs = require('fs');
-const path = require('path');
-const assert = require('assert');
-const { generateManifestOutputPair, verifyFileContents } = require('./utils');
-
-function _testHelper(command, outputDirFiles) {
-  if (command) {
-    execSync(command);
-  }
-
-  // Make sure the files are getting generated in the dist dir
-  const distDir = path.join(process.cwd(), 'dist');
-  const filesInOutputDir = fs.readdirSync(distDir);
-  assert.deepStrictEqual(filesInOutputDir, outputDirFiles);
-
-  // Spot check the file contents to make sure they seem ok
-  filesInOutputDir.forEach(file => {
-    const fileContents = fs.readFileSync(path.join(distDir, file)).toString();
-    verifyFileContents(file, fileContents);
-  });
-}
-
-function testBuildAll(logger, entrypoints) {
-  const expected = entrypoints
-    .reduce((acc, cur) => {
-      return acc.concat(generateManifestOutputPair(cur));
-    }, [])
-    .sort();
-  logger.warn('- Test build all extensions started 🤞');
-  _testHelper('hs-ui-extensions-dev-server build', expected);
-  logger.info('- Test build all extensions passed 🚀');
-}
-
-function testBuildSingle(logger, entrypoints) {
-  entrypoints.forEach(entrypoint => {
-    logger.warn(
-      `- Test build single extension started for entrypoint ${entrypoint} 🤞`
-    );
-    _testHelper(
-      `hs-ui-extensions-dev-server build --extension ${entrypoint}`,
-      generateManifestOutputPair(entrypoint)
-    );
-    logger.info(
-      `- Test build single extension passed for entrypoint ${entrypoint} 🚀`
-    );
-  });
-}
-
-async function testBuildRemote(logger, entrypoints) {
-  const { remoteBuild } = require('../index');
-  for (let i = 0; i < entrypoints.length; ++i) {
-    const entrypoint = entrypoints[i];
-    logger.warn(
-      `- Test remoteBuild function started for entrypoint ${entrypoint} 🤞`
-    );
-
-    await remoteBuild(process.cwd(), entrypoint, 'dist');
-    _testHelper(null, generateManifestOutputPair(entrypoint));
-
-    logger.info(
-      `- Test remoteBuild function passed for entrypoint ${entrypoint} 🚀`
-    );
-  }
-}
-
-async function testBuild(logger, buildSpec) {
-  const { entrypoints } = buildSpec;
-
-  logger.warn('\nBuild Tests started - External Devs 🤞');
-  testBuildAll(logger, entrypoints);
-  testBuildSingle(logger, entrypoints);
-  logger.info('Build Tests passed - External Devs🚀');
-
-  logger.warn('\nBuild Tests started - Remote 🤞');
-  await testBuildRemote(logger, entrypoints);
-  logger.info('Build Tests passed - Remote 🚀');
-}
-
-module.exports = {
-  testBuild,
-};