Update all commands and its flags

Author: cezaraugusto

programs/cli/cli.ts

@@ -1,11 +1,11 @@
 #!/usr/bin/env node
 
-//  ██████╗██╗     ██╗
-// ██╔════╝██║     ██║
-// ██║     ██║     ██║
-// ██║     ██║     ██║
-// ╚██████╗███████╗██║
-//  ╚═════╝╚══════╝╚═╝
+// ███████╗██╗  ██╗████████╗███████╗███╗   ██╗███████╗██╗ ██████╗ ███╗   ██╗        ██╗███████╗
+// ██╔════╝╚██╗██╔╝╚══██╔══╝██╔════╝████╗  ██║██╔════╝██║██╔═══██╗████╗  ██║        ██║██╔════╝
+// █████╗   ╚███╔╝    ██║   █████╗  ██╔██╗ ██║███████╗██║██║   ██║██╔██╗ ██║        ██║███████╗
+// ██╔══╝   ██╔██╗    ██║   ██╔══╝  ██║╚██╗██║╚════██║██║██║   ██║██║╚██╗██║   ██   ██║╚════██║
+// ███████╗██╔╝ ██╗   ██║   ███████╗██║ ╚████║███████║██║╚██████╔╝██║ ╚████║██╗╚█████╔╝███████║
+// ╚══════╝╚═╝  ╚═╝   ╚═╝   ╚══════╝╚═╝  ╚═══╝╚══════╝╚═╝ ╚═════╝ ╚═╝  ╚═══╝╚═╝ ╚════╝ ╚══════╝
 
 import {program} from 'commander'
 import {extensionCreate, type CreateOptions} from 'extension-create'
@@ -17,6 +17,7 @@ import {
   extensionBuild,
   type BuildOptions,
   extensionPreview,
+  type PreviewOptions,
   type FileConfig,
   type Manifest
 } from 'extension-develop'
@@ -32,12 +33,15 @@ checkUpdates(packageJson)
 
 const extensionJs = program
 
-// ███████╗██╗  ██╗████████╗███████╗███╗   ██╗███████╗██╗ ██████╗ ███╗   ██╗        ██╗███████╗
-// ██╔════╝╚██╗██╔╝╚══██╔══╝██╔════╝████╗  ██║██╔════╝██║██╔═══██╗████╗  ██║        ██║██╔════╝
-// █████╗   ╚███╔╝    ██║   █████╗  ██╔██╗ ██║███████╗██║██║   ██║██╔██╗ ██║        ██║███████╗
-// ██╔══╝   ██╔██╗    ██║   ██╔══╝  ██║╚██╗██║╚════██║██║██║   ██║██║╚██╗██║   ██   ██║╚════██║
-// ███████╗██╔╝ ██╗   ██║   ███████╗██║ ╚████║███████║██║╚██████╔╝██║ ╚████║██╗╚█████╔╝███████║
-// ╚══════╝╚═╝  ╚═╝   ╚═╝   ╚══════╝╚═╝  ╚═══╝╚══════╝╚═╝ ╚═════╝ ╚═╝  ╚═══╝╚═╝ ╚════╝ ╚══════╝
+//  ██████╗██╗     ██╗
+// ██╔════╝██║     ██║
+// ██║     ██║     ██║
+// ██║     ██║     ██║
+// ╚██████╗███████╗██║
+//  ╚═════╝╚══════╝╚═╝
+
+const vendors = (browser: BrowsersSupported) =>
+  browser === 'all' ? 'chrome,edge,firefox'.split(',') : browser.split(',')
 
 extensionJs
   .name(packageJson.name)
@@ -52,9 +56,6 @@ extensionJs
 // ╚██████╗██║  ██║███████╗██║  ██║   ██║   ███████╗
 //  ╚═════╝╚═╝  ╚═╝╚══════╝╚═╝  ╚═╝   ╚═╝   ╚══════╝
 
-const vendors = (browser: BrowsersSupported) =>
-  browser === 'all' ? 'chrome,edge,firefox'.split(',') : browser.split(',')
-
 extensionJs
   .command('create')
   .arguments('<project-name|project-path>')
@@ -90,17 +91,13 @@ extensionJs
   .arguments('[project-path|remote-url]')
   .usage('dev [project-path|remote-url] [options]')
   .description('Starts the development server (development mode)')
-  .option(
-    '-u, --user-data-dir <path-to-file | boolean>',
-    '[DEPRECATED - Use "--profile" instead] what path to use for the browser profile. A boolean value of false sets the profile to the default user profile. Defaults to a fresh profile'
-  )
   .option(
     '--profile <path-to-file | boolean>',
     'what path to use for the browser profile. A boolean value of false sets the profile to the default user profile. Defaults to a fresh profile'
   )
   .option(
-    '-b, --browser <chrome | edge | firefox>',
-    'specify a browser to run your extension in development mode'
+    '--browser <chrome | edge | firefox>',
+    'specify a browser to preview your extension in production mode. Defaults to `chrome`'
   )
   .option(
     '--chromium-binary <path-to-binary>',
@@ -112,26 +109,32 @@ extensionJs
   )
   .option(
     '--polyfill [boolean]',
-    'whether or not to apply the cross-browser polyfill. Defaults to `true`'
+    'whether or not to apply the cross-browser polyfill. Defaults to `false`'
   )
   .option(
-    '-p, --port <number>',
-    'what port should Extension.js WebSocket server run. Defaults to `8000`'
+    '--open [boolean]',
+    'whether or not to open the browser automatically. Defaults to `true`'
   )
   .option(
-    '-o, --open [boolean]',
-    'whether or not to open the browser automatically. Defaults to `true`'
+    '--starting-url <url>',
+    'specify the starting URL for the browser. Defaults to `undefined`'
   )
   .action(async function (
     pathOrRemoteUrl: string,
     {browser = 'chrome', ...devOptions}: DevOptions
   ) {
     for (const vendor of vendors(browser)) {
       await extensionDev(pathOrRemoteUrl, {
-        browser: vendor as DevOptions['browser'],
         ...devOptions,
+        profile: devOptions.profile,
+        browser: vendor as DevOptions['browser'],
+        chromiumBinary: devOptions.chromiumBinary,
+        geckoBinary: devOptions.geckoBinary,
         // @ts-expect-error open is a boolean
-        open: devOptions.open === 'false' ? false : true
+        polyfill: devOptions.polyfill === 'false' ? false : true,
+        // @ts-expect-error open is a boolean
+        open: devOptions.open === 'false' ? false : true,
+        startingUrl: devOptions.startingUrl
       })
     }
   })
@@ -148,17 +151,17 @@ extensionJs
   .arguments('[project-path|remote-url]')
   .usage('start [project-path|remote-url] [options]')
   .description('Starts the development server (production mode)')
-  .option(
-    '-u, --user-data-dir <path-to-file | boolean>',
-    '[DEPRECATED - Use "--profile" instead] what path to use for the browser profile. A boolean value of false sets the profile to the default user profile. Defaults to a fresh profile'
-  )
   .option(
     '--profile <path-to-file | boolean>',
     'what path to use for the browser profile. A boolean value of false sets the profile to the default user profile. Defaults to a fresh profile'
   )
   .option(
-    '-b, --browser <chrome | edge | firefox>',
-    'specify a browser to run your extension in development mode'
+    '--browser <chrome | edge | firefox>',
+    'specify a browser to preview your extension in production mode. Defaults to `chrome`'
+  )
+  .option(
+    '--polyfill [boolean]',
+    'whether or not to apply the cross-browser polyfill. Defaults to `true`'
   )
   .option(
     '--chromium-binary <path-to-binary>',
@@ -169,21 +172,21 @@ extensionJs
     'specify a path to the Gecko binary. This option overrides the --browser setting. Defaults to the system default'
   )
   .option(
-    '--polyfill [boolean]',
-    'whether or not to apply the cross-browser polyfill. Defaults to `true`'
-  )
-  .option(
-    '-p, --port <number>',
-    'what port should Extension.js run. Defaults to `3000`'
+    '--starting-url <url>',
+    'specify the starting URL for the browser. Defaults to `undefined`'
   )
   .action(async function (
     pathOrRemoteUrl: string,
     {browser = 'chrome', ...startOptions}: StartOptions
   ) {
     for (const vendor of vendors(browser)) {
       await extensionStart(pathOrRemoteUrl, {
+        mode: 'production',
+        profile: startOptions.profile,
         browser: vendor as StartOptions['browser'],
-        ...startOptions
+        chromiumBinary: startOptions.chromiumBinary,
+        geckoBinary: startOptions.geckoBinary,
+        startingUrl: startOptions.startingUrl
       })
     }
   })
@@ -199,7 +202,15 @@ extensionJs
   .command('preview')
   .arguments('[project-name]')
   .usage('preview [path-to-remote-extension] [options]')
-  .description('Builds the extension for production')
+  .description('Preview the extension in production mode')
+  .option(
+    '--profile <path-to-file | boolean>',
+    'what path to use for the browser profile. A boolean value of false sets the profile to the default user profile. Defaults to a fresh profile'
+  )
+  .option(
+    '--browser <chrome | edge | firefox>',
+    'specify a browser to preview your extension in production mode. Defaults to `chrome`'
+  )
   .option(
     '--chromium-binary <path-to-binary>',
     'specify a path to the Chromium binary. This option overrides the --browser setting. Defaults to the system default'
@@ -209,18 +220,21 @@ extensionJs
     'specify a path to the Gecko binary. This option overrides the --browser setting. Defaults to the system default'
   )
   .option(
-    '-b, --browser <chrome | edge | firefox>',
-    'specify a browser to preview your extension in production mode'
+    '--starting-url <url>',
+    'specify the starting URL for the browser. Defaults to `undefined`'
   )
   .action(async function (
     pathOrRemoteUrl: string,
-    {browser = 'chrome', ...previewOptions}: BuildOptions
+    {browser = 'chrome', ...previewOptions}: PreviewOptions
   ) {
     for (const vendor of vendors(browser)) {
       await extensionPreview(pathOrRemoteUrl, {
         mode: 'production',
-        browser: vendor as any,
-        ...previewOptions
+        profile: previewOptions.profile,
+        browser: vendor as PreviewOptions['browser'],
+        chromiumBinary: previewOptions.chromiumBinary,
+        geckoBinary: previewOptions.geckoBinary,
+        startingUrl: previewOptions.startingUrl
       })
     }
   })
@@ -238,8 +252,8 @@ extensionJs
   .usage('build [path-to-remote-extension] [options]')
   .description('Builds the extension for production')
   .option(
-    '-b, --browser <chrome | edge | firefox>',
-    'specify a browser to run your extension in development mode'
+    '--browser <chrome | edge | firefox>',
+    'specify a browser to preview your extension in production mode. Defaults to `chrome`'
   )
   .option(
     '--polyfill [boolean]',
@@ -257,14 +271,22 @@ extensionJs
     '--zip-filename <string>',
     'specify the name of the ZIP file. Defaults to the extension name and version'
   )
+  .option(
+    '--silent [boolean]',
+    'whether or not to open the browser automatically. Defaults to `false`'
+  )
   .action(async function (
     pathOrRemoteUrl: string,
     {browser = 'chrome', ...buildOptions}: BuildOptions
   ) {
     for (const vendor of vendors(browser)) {
       await extensionBuild(pathOrRemoteUrl, {
         browser: vendor as BuildOptions['browser'],
-        ...buildOptions
+        polyfill: buildOptions.polyfill,
+        zip: buildOptions.zip,
+        zipSource: buildOptions.zipSource,
+        zipFilename: buildOptions.zipFilename,
+        silent: buildOptions.silent
       })
     }
   })

programs/develop/build.spec.ts

@@ -48,7 +48,6 @@ function distFileExists(
   )
 
   if (filePath) {
-    console.log('3iuteghkgewktgdtqwegdhiq3thegd', path.join(templatePath, filePath))
     return fs.existsSync(path.join(templatePath, filePath))
   } else {
     // Check if any HTML file exists in the directory

programs/develop/commands/build.ts

@@ -13,17 +13,8 @@ import webpackConfig from '../webpack/webpack-config'
 import {getProjectPath} from './commands-lib/get-project-path'
 import * as messages from './commands-lib/messages'
 import {generateZip} from './commands-lib/generate-zip'
-import {loadExtensionConfig} from './commands-lib/get-extension-config'
-import {DevOptions} from './dev'
-
-export interface BuildOptions {
-  browser?: DevOptions['browser']
-  zipFilename?: string
-  zip?: boolean
-  zipSource?: boolean
-  polyfill?: boolean
-  silent?: boolean
-}
+import {loadCustomWebpackConfig} from './commands-lib/get-extension-config'
+import {BuildOptions} from './commands-lib/config-types'
 
 export async function extensionBuild(
   pathOrRemoteUrl: string | undefined,
@@ -56,7 +47,7 @@ export async function extensionBuild(
       )
     })
 
-    const userExtensionConfig = loadExtensionConfig(projectPath)
+    const userExtensionConfig = loadCustomWebpackConfig(projectPath)
     const userConfig = userExtensionConfig({
       ...baseConfig,
       plugins: allPluginsButBrowserRunners

programs/develop/commands/commands-lib/config-types.ts

@@ -1,18 +1,41 @@
 import {Configuration} from 'webpack'
-import {DevOptions} from '../dev'
-import {PreviewOptions} from '../preview'
-import {BuildOptions} from '../build'
-
-type BrowserConfig = Pick<
-  DevOptions,
-  | 'open'
-  | 'profile'
-  | 'preferences'
-  | 'browserFlags'
-  | 'startingUrl'
-  | 'chromiumBinary'
-  | 'geckoBinary'
->
+
+export interface BrowserOptions {
+  profile?: string
+  startingUrl?: string
+  browser: 'chrome' | 'edge' | 'firefox' | 'chromium-based' | 'gecko-based'
+  chromiumBinary?: string
+  geckoBinary?: string
+}
+
+export interface DevOptions extends BrowserOptions {
+  mode: 'development' | 'production'
+  open?: boolean
+  polyfill?: boolean
+}
+
+export interface BuildOptions {
+  browser: BrowserOptions['browser']
+  zipFilename?: string
+  zip?: boolean
+  zipSource?: boolean
+  polyfill?: boolean
+  silent?: boolean
+}
+
+export interface PreviewOptions extends BrowserOptions {
+  mode: 'production'
+}
+
+export interface StartOptions extends BrowserOptions {
+  mode: 'production'
+  polyfill?: boolean
+}
+
+export interface BrowserConfig extends BrowserOptions {
+  browserFlags?: string[]
+  preferences?: Record<string, unknown>
+}
 
 export interface FileConfig {
   browser?: {
@@ -23,11 +46,35 @@ export interface FileConfig {
     'gecko-based'?: BrowserConfig
   }
   commands?: {
-    dev?: Pick<DevOptions, 'browser' | 'profile' | 'preferences' | 'polyfill'>
+    dev?: Pick<
+      DevOptions,
+      | 'browser'
+      | 'profile'
+      | 'chromiumBinary'
+      | 'geckoBinary'
+      | 'open'
+      | 'polyfill'
+    > & {
+      browserFlags?: string[]
+      preferences?: Record<string, unknown>
+    }
+
+    start?: Pick<
+      StartOptions,
+      'browser' | 'profile' | 'chromiumBinary' | 'geckoBinary' | 'polyfill'
+    > & {
+      browserFlags?: string[]
+      preferences?: Record<string, unknown>
+    }
+
     preview?: Pick<
       PreviewOptions,
-      'browser' | 'profile' | 'preferences' | 'polyfill'
-    >
+      'browser' | 'profile' | 'chromiumBinary' | 'geckoBinary'
+    > & {
+      browserFlags?: string[]
+      preferences?: Record<string, unknown>
+    }
+
     build?: Pick<
       BuildOptions,
       'browser' | 'zipFilename' | 'zip' | 'zipSource' | 'polyfill'

programs/develop/commands/commands-lib/generate-zip.ts

@@ -4,7 +4,7 @@ import ignore from 'ignore'
 import glob from 'tiny-glob'
 import AdmZip from 'adm-zip'
 import slugify from 'slugify'
-import {type BuildOptions} from '../build'
+import {type BuildOptions} from '../commands-lib/config-types'
 import * as messages from './messages'
 
 function readFileSync(filePath: string): string {
@@ -76,7 +76,7 @@ export async function generateZip(
     const manifest: Record<string, string> = require(
       path.join(dataDir, 'manifest.json')
     )
-    const name = getPackageName(manifest, options)
+    const name = getPackageName(manifest, {browser, ...options})
     const ext = getExtensionExtension(browser)
     // Dist zips are stored in dist/[browser]/[name].zip
     const distZipPath = path.join(outputDir, `${name}.${ext}`)