extension-create 0.5.1 → 1.0.0

package/develop/CONTRIBUTING.md

@@ -1,47 +0,0 @@
-# Contributing to @webextension/start
-
-## Getting started
-
-```
-git clone git@github.com:cezaraugusto/extension-create.git
-cd extension-create/develop/start
-yarn install
-```
-
-## Creating an extension
-
-`yarn dev:start my-hello-extension` is equivalent of running `npx @webextension/start my-hello-extension`
-
-## Running tests
-
-`cli.test.js` is an evergrowing list of tests covering functionalities exposed to the client. For file testing, see **unit testing**.
-
-```
-yarn test
-```
-
-### Unit testing
-
-Unit tests are welcome and should live in the same folder as the file it is testing, having one created in case of no tests, suffixed with `.test.js`.
-
-For example:
-
-**Before**
-
-```
-folder/
-  method1.js
-  method2.js
-  method3.js
-```
-
-**After**
-
-```
-folder/
-  method1/
-    method1.js
-    method1.spec.js
-  method2.js
-  method3.js
-```

package/develop/README.md

@@ -1,55 +0,0 @@
-# @extension-create/develop
-
-> The `start` part of `extension-create` available as a standalone package.
-
-This package stores all logic needed by `extension-create` to start new projects.
-
-## Installation
-
-```
-npm i @extension-create/develop
-```
-
-## Usage
-
-There are two ways of using it:
-
-### Standalone Executable
-
-```
-# Will start a new browser instance with my-extension-hello loaded.
-npx @extension-create/start my-extension-hello
-```
-
-### Imported CLI
-
-Alternatively, if you're using [commander](https://github.com/tj/commander.js), you can use `@extension-create/start` to extend you CLI. This is what `extension-create` does.
-
-```js
-const {program} = require('commander')
-const startExtensionCLI = require('@extension-create/start')
-
-const yourCreateProgram = program
-
-yourCreateProgram
-  .version(packageJson.version)
-
-startExtensionCLI(yourCreateProgram)
-
-yourCreateProgram
-  .parse(process.argv)
-```
-
-## Program options table
-
-| Flag             | Argument                                                 | What it does |
-|------------------|----------------------------------------------------------|--------------|
-| -m, --manifest   | file path | Specify a custom path for your extensions's manifest file |
-
-## Contributing
-
-See [CONTRIBUTING.md](CONTRIBUTING.md)
-
-## License
-
-MIT (c) Cezar Augusto.

package/develop/module.js

@@ -1,16 +0,0 @@
-#!/usr/bin/env node
-
-// ██████╗ ███████╗██╗   ██╗███████╗██╗      ██████╗ ██████╗
-// ██╔══██╗██╔════╝██║   ██║██╔════╝██║     ██╔═══██╗██╔══██╗
-// ██║  ██║█████╗  ██║   ██║█████╗  ██║     ██║   ██║██████╔╝
-// ██║  ██║██╔══╝  ╚██╗ ██╔╝██╔══╝  ██║     ██║   ██║██╔═══╝
-// ██████╔╝███████╗ ╚████╔╝ ███████╗███████╗╚██████╔╝██║
-// ╚═════╝ ╚══════╝  ╚═══╝  ╚══════╝╚══════╝ ╚═════╝ ╚═╝
-
-const {program} = require('commander')
-
-const startCLI = require('./start/cli')
-
-module.exports = function (clientProgram = program) {
-  startCLI(clientProgram)
-}

package/develop/package.json

@@ -1,44 +0,0 @@
-{
-  "license": "MIT",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/cezaraugusto/extension-create.git",
-    "directory": "develop"
-  },
-  "engines": {
-    "node": ">=10"
-  },
-  "name": "@extension-create/develop",
-  "version": "0.0.0",
-  "description": "The develop step of extension-create",
-  "main": "./module.js",
-  "bin": "./module.js",
-  "author": "Cezar Augusto <boss@cezaraugusto.net> (https://twitter.com/cezaraugusto)",
-  "scripts": {
-    "dev:start": "node ./module.js",
-    "test": "jest"
-  },
-  "dependencies": {
-    "@rbarilani/remove-source-map-url-webpack-plugin": "^0.1.0",
-    "chrome-launcher": "^0.13.4",
-    "commander": "^6.2.0",
-    "copy-webpack-plugin": "^6.2.1",
-    "fs-extra": "^9.0.1",
-    "go-git-it": "github:cezaraugusto/go-git-it#174168d12a31791a08c777b92650f98470d45674",
-    "log-md": "^0.2.0",
-    "semver": "^7.3.2",
-    "string-replace-loader": "^2.3.0",
-    "symlink-dir": "^4.1.0",
-    "webextension-polyfill": "^0.6.0",
-    "webpack": "^5.6.0",
-    "webpack-cli": "^4.1.0",
-    "webpack-dev-server": "^3.11.0",
-    "webpack-resolve-background-script": "^1.0.0",
-    "webpack-run-chrome-extension": "^0.3.0",
-    "webpack-run-edge-extension": "^0.3.0"
-  },
-  "devDependencies": {
-    "cross-spawn": "^7.0.3",
-    "jest": "^26.6.1"
-  }
-}

package/develop/start/cli.js

@@ -1,47 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const {program} = require('commander')
-
-const startExtension = require('./startExtension')
-const messages = require('./messages')
-const packageJson = require('../package.json')
-
-let browserVendor
-
-function startExtensionCLI (clientProgram = program) {
-  clientProgram
-    .version(packageJson.version)
-    .command('start')
-    .usage('start [path-to-extension-folder] [options]')
-    .action((cmd) => {
-      const {browser} = cmd
-
-      browserVendor = browser
-    })
-    .description('start the development server')
-    .option(
-      '-b, --browser <browser-vendor>',
-      'specify a browser to run your extension'
-    )
-    .on('--help', () => messages.programHelp())
-    .parse(process.argv)
-
-  const projectDir = process.cwd()
-  const commands = clientProgram.commands[0]
-  const customPath = commands.args[1] || ''
-
-  startExtension(projectDir, {customPath, browserVendor})
-}
-
-// If the module was called from the cmd line, execute it
-if (require.main === module) {
-  startExtensionCLI()
-}
-
-// Export as a module so it can be reused
-module.exports = startExtensionCLI

package/develop/start/cli.test.js

@@ -1,45 +0,0 @@
-/* global describe, it */
-const path = require('path')
-
-const fs = require('fs-extra')
-
-const boringManifestFile = {
-  manifest_version: 2,
-  name: 'Your browser extension',
-  version: '1.0',
-  background: {
-    scripts: [
-      './background.js'
-    ]
-  }
-}
-
-/* eslint-disable no-unused-vars */
-async function createTmpExtension () {
-  // Write a fake bg script
-  await fs.writeFile(
-    path.join(process.cwd(), 'background.js'),
-    'console.log("hello")'
-  )
-  // Write a fake manifest file
-  await fs.writeFile(
-    path.join(process.cwd(), 'manifest.json'),
-    JSON.stringify(boringManifestFile)
-  )
-}
-
-describe('`start` command line interface', () => {
-  it.todo('starts extension from local path with arguments')
-  it.todo('starts extension from local path without arguments')
-  it.todo('starts extension from local path - manifest in src/')
-  it.todo('starts extension from local path - manifest in public/')
-  it.todo('starts extension from remote (URL) path')
-  it.todo('starts extension from remote (URL) path - manifest in src/')
-  it.todo('starts extension from remote (URL) path - manifest in public/')
-  describe('--browser flag', () => {
-    it.todo('accepts and starts `chrome` as flag')
-    it.todo('accepts and starts `edge` as flag')
-    it.todo('accepts and `all` browsers as flag')
-    it.todo('accepts and starts chrome as default')
-  })
-})

package/develop/start/config/browserSwitch.js

@@ -1,31 +0,0 @@
-const RunChromeExtension = require('webpack-run-chrome-extension')
-const RunEdgeExtension = require('webpack-run-edge-extension')
-
-module.exports = function (projectDir, browserVendor) {
-  switch (browserVendor) {
-    case 'chrome':
-      return new RunChromeExtension({extensionPath: projectDir})
-
-    case 'edge':
-      return new RunEdgeExtension({extensionPath: projectDir})
-
-    case 'all':
-      return {
-        apply: (compiler) => {
-          new RunChromeExtension({
-            extensionPath: projectDir,
-            port: 8081
-          }).apply(compiler)
-
-          new RunEdgeExtension({
-            extensionPath: projectDir,
-            port: 8082
-          }).apply(compiler)
-        }
-      }
-
-    default:
-      // TODO: Should be the user default browser, not Chrome
-      return new RunChromeExtension({extensionPath: projectDir})
-  }
-}

package/develop/start/config/compiler.js

@@ -1,47 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const webpack = require('webpack')
-
-const browserSwitch = require('./browserSwitch')
-
-process.on('unhandledRejection', (error) => { throw error })
-
-module.exports = (projectDir, {browserVendor}) => {
-  const config = {
-    mode: 'development',
-    // https://github.com/webpack/webpack/issues/2145
-    devtool: 'inline-cheap-module-source-map',
-    plugins: [
-      // Polyfill `browser` namespace for unspported browsers (FF).
-      // TODO: Do not add this plugin when developing for those vendors
-      new webpack.ProvidePlugin({browser: require.resolve('webextension-polyfill')}),
-      // Browser lists loaded conditionally based on user choice
-      browserSwitch(projectDir, browserVendor)
-    ],
-    resolve: {
-      extensions: ['js', '.json']
-    },
-    module: {
-      // Adapted from
-      // https://github.com/webextension-toolbox/webextension-toolbox
-      // Relased under MIT license. Copyright 2018 Henrik Wenz
-      rules: [{
-        test: /webextension-polyfill[\\/]+dist[\\/]+browser-polyfill\.js$/,
-        loader: require.resolve('string-replace-loader'),
-        options: {
-          search: 'typeof browser === "undefined"',
-          replace: 'typeof window.browser === "undefined" || Object.getPrototypeOf(window.browser) !== Object.prototype'
-        }
-      }]
-    }
-  }
-
-  return {
-    ...config
-  }
-}

package/develop/start/config/server.js

@@ -1,17 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-module.exports = {
-  clientLogLevel: 'none',
-  compress: true,
-  overlay: true,
-  quiet: true,
-  watchContentBase: true,
-  watchOptions: {
-    ignored: 'node_modules'
-  }
-}

package/develop/start/messages/index.js

@@ -1,14 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const manifestNotFound = require('./manifestNotFound')
-const programHelp = require('./programHelp')
-
-module.exports = {
-  manifestNotFound,
-  programHelp
-}

package/develop/start/messages/manifestNotFound.js

@@ -1,22 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const {log} = require('log-md')
-
-module.exports = function () {
-  log(`
-    # Error! Can't find the project's manifest file.
-
-    By default, extension-create scans the root folder and the paths to
-    \`src/\`, and \`public/\` looking for a manifest file, but none was found.
-
-    The argument after \`start\` needs to point to a folder where the
-    manifest is available within one of the paths above.
-
-    \`extension-create start\` <path-to-extension-folder>
-  `)
-}

package/develop/start/messages/programHelp.js

@@ -1,49 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const {log} = require('log-md')
-
-module.exports = function () {
-  log(`
-    # Help center for the \`start\` command
-
-    ## The \`--remote\` _<github-url>_ flag
-
-    If you want to get up and running with an existing extension
-    available remotely on GitHub, you can specify its path as an
-    argument to the \`--remote\` flag.
-
-    The path can be any GitHub URL subdirectory. If a GitHub URL is provided,
-    the directory is downloaded to the current working directory.
-
-    For example:
-
-    \`extension-create start --remote https://github.com/user/repo/\`
-    will download \`repo\` in the current working directory and
-    kick off a new browser instance with \`repo\` loaded as an extension.
-
-    Works with subdirectories as well, like https://github.com/user/repo/subdirs
-
-    ## The \`--manifest\` _<github-url>_ flag
-
-    You can specify a custom path to your manifest file. By default
-    \`extension-create\` will look for your project's root
-    path and **public/** directory, failing if no manifest is found.
-
-    ## The \`--browser\` _<browser-vendor>_ flag
-
-    A browser vendor name can be provided to run your extension on a specific browser.
-    One of:
-
-    - \`--browser\`=chrome (default)
-    - \`--browser\`=edge
-    - \`--browser\`=all (runs all available browsers)
-
-    Feels something is wrong? Help by reporting a bug:
-    https://github.com/cezaraugusto/extension-create/issues/new
-  `)
-}

package/develop/start/resolve/resolveExtensionPath.js

@@ -1,45 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const path = require('path')
-
-const fs = require('fs-extra')
-
-const message = require('../messages')
-
-module.exports = async function (workingDir, manifestFile) {
-  // Defaults to user-defined path
-  let manifestFilePath = manifestFile
-
-  try {
-    // Try manifest path provided by user
-    await fs.access(manifestFilePath)
-
-    return manifestFilePath
-  } catch (error) {
-    try {
-      // User didn't provide a manifest file, check in public/
-      manifestFilePath = path.join(workingDir, 'public', 'manifest.json')
-      await fs.access(manifestFilePath)
-
-      return manifestFilePath
-    } catch (error) {
-      try {
-        // Nothing found in public/, try the root directory
-        manifestFilePath = path.join(workingDir, 'manifest.json')
-        await fs.access(manifestFilePath)
-
-        return manifestFilePath
-      } catch (error) {
-        // Nothing found neither in public/ or path, and user did not
-        // provide a --manifest option. Manifests are required so we exit.
-        message.manifestNotFound()
-        process.exit(1)
-      }
-    }
-  }
-}

package/develop/start/startExtension.js

@@ -1,69 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const path = require('path')
-
-const fs = require('fs-extra')
-const {log} = require('log-md')
-const goGitIt = require('go-git-it')
-
-const resoleManifest = require('./steps/resolveManifest')
-const startWebpack = require('./steps/startWebpack')
-
-function setWorkingDirFromRemote (workingDir, customPath) {
-  if (new URL(customPath).hostname !== 'github.com') {
-    log(`
-      The remote extension URL must be stored on GitHub.
-    `)
-    process.exit(1)
-  }
-
-  goGitIt(customPath)
-
-  return path.join(workingDir, path.basename(customPath))
-}
-
-async function setWorkingDirFromLocal (workingDir, customPath) {
-  const currentPath = path.resolve(workingDir, customPath)
-  const extensionPath = await fs.stat(currentPath)
-
-  if (!extensionPath.isDirectory()) {
-    log(`
-      The local extension path must be a directory.
-    `)
-    process.exit(1)
-  }
-
-  return currentPath
-}
-
-module.exports = async function (workingDir, {customPath, browserVendor}) {
-  let currentworkingDir
-
-  try {
-    if (!customPath) {
-      // No user arguments, default to cwd
-      currentworkingDir = workingDir
-    } else if (customPath.startsWith('http')) {
-      currentworkingDir = setWorkingDirFromRemote(workingDir, customPath)
-    } else {
-      currentworkingDir = await setWorkingDirFromLocal(workingDir, customPath)
-    }
-
-    const resolvedManifest = await resoleManifest(currentworkingDir)
-
-    startWebpack(currentworkingDir, {
-      manifestPath: resolvedManifest,
-      browserVendor
-    })
-  } catch (error) {
-    log(`
-      Error while starting the extension: ${error}
-    `)
-    process.exit(1)
-  }
-}

package/develop/start/steps/resolveManifest.js

@@ -1,44 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const path = require('path')
-
-const fs = require('fs-extra')
-
-const message = require('../messages')
-
-module.exports = async function (workingDir) {
-  let manifestFilePath
-
-  // Iterate over common paths looking for the manifest file.
-  try {
-    // Start from usual suspects, check src/
-    await fs.access(path.join(workingDir, 'src', 'manifest.json'))
-
-    return manifestFilePath
-  } catch (error) {
-    try {
-      // Check in public/
-      manifestFilePath = path.join(workingDir, 'public', 'manifest.json')
-      await fs.access(manifestFilePath)
-
-      return manifestFilePath
-    } catch (error) {
-      try {
-        // Check the root directory
-        manifestFilePath = path.join(workingDir, 'manifest.json')
-        await fs.access(manifestFilePath)
-
-        return manifestFilePath
-      } catch (error) {
-        // Nothing found. Manifests are required so we exit.
-        message.manifestNotFound()
-        process.exit(1)
-      }
-    }
-  }
-}

package/develop/start/steps/startWebpack.js

@@ -1,46 +0,0 @@
-// ███████╗████████╗ █████╗ ██████╗ ████████╗
-// ██╔════╝╚══██╔══╝██╔══██╗██╔══██╗╚══██╔══╝
-// ███████╗   ██║   ███████║██████╔╝   ██║
-// ╚════██║   ██║   ██╔══██║██╔══██╗   ██║
-// ███████║   ██║   ██║  ██║██║  ██║   ██║
-// ╚══════╝   ╚═╝   ╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝
-
-const path = require('path')
-
-const webpack = require('webpack')
-const {log} = require('log-md')
-const WebpackDevServer = require('webpack-dev-server')
-
-const compilerConfig = require('../config/compiler.js')
-const serverConfig = require('../config/server.js')
-
-function closeAll (devServer) {
-  devServer.close()
-  process.exit()
-}
-
-module.exports = function (projectDir, {manifestPath, browserVendor}) {
-  const serverOptions = {
-    // Tell the server where to serve content from
-    contentBase: path.dirname(manifestPath)
-  }
-
-  const webpackConfig = compilerConfig(projectDir, {
-    manifestPath,
-    browserVendor
-  })
-
-  const compiler = webpack(webpackConfig)
-  const server = {...serverConfig, ...serverOptions}
-  const devServer = new WebpackDevServer(compiler, server)
-
-  const PORT = 3001
-  const HOST = '127.0.0.1'
-
-  devServer.listen(PORT, HOST, (error) => {
-    if (error) return log(`Error in the extension runner: ${error}`)
-  })
-
-  process.on('SIGINT', () => closeAll(devServer))
-  process.on('SIGTERM', () => closeAll(devServer))
-}