extension-create 0.5.1 → 0.5.2

package/README.md

@@ -39,7 +39,7 @@ You are done. Time to hack on your extension!
 
 ### Kickstart any sample from Chrome Extension Samples
 
-The [chrome-extesions-sample](https://github.com/GoogleChrome/chrome-extensions-samples/) project is a great way to kickstart developing your extension.
+The [chrome-extensions-sample](https://github.com/GoogleChrome/chrome-extensions-samples/) project is a great way to kickstart developing your extension.
 
 If we go to the samples repository and look for an extension sample to work, let's say the [make_page_red](https://github.com/GoogleChrome/chrome-extensions-samples/blob/main/mv2-archive/api/browserAction/make_page_red/) sample, all we need is to copy and paste it's URL as an argument for the start command:
 

package/create/README.md

@@ -31,20 +31,18 @@ const createExtensionCLI = require('@extension-create/create')
 
 const yourCreateProgram = program
 
-yourCreateProgram
-  .version(packageJson.version)
+yourCreateProgram.version(packageJson.version)
 
 createExtensionCLI(yourCreateProgram)
 
-yourCreateProgram
-  .parse(process.argv)
+yourCreateProgram.parse(process.argv)
 ```
 
 ## Program options table
 
-| Flag             | Argument                                                 | What it does |
-|------------------|----------------------------------------------------------|--------------|
-| -t, --template   | Path to the template used to bootstrap your extension    | Bootstrap your extension using a template |
+| Flag           | Argument                                              | What it does                              |
+| -------------- | ----------------------------------------------------- | ----------------------------------------- |
+| -t, --template | Path to the template used to bootstrap your extension | Bootstrap your extension using a template |
 
 ## Contributing
 

package/create/cli.js

@@ -17,12 +17,12 @@ const packageJson = require('./package.json')
 let projectName
 let templateName
 
-function createExtensionCLI (clientProgram = program) {
+function createExtensionCLI(clientProgram = program) {
   clientProgram
     .version(packageJson.version)
     .command('create', {isDefault: true})
     .usage('create <project-directory> [options]')
-    .action((cmd) => {
+    .action((_, cmd) => {
       const {args, template} = cmd
 
       projectName = args[0]

package/create/cli.test.js

@@ -16,11 +16,9 @@ describe('`create` command line interface', () => {
 
   it('creates an extension with specified project name', async () => {
     expect.assertions(1)
-    spawn.sync(
-      'node',
-      [createExtensionCLI, 'my-extension-home'],
-      {stdio: 'inherit'}
-    )
+    spawn.sync('node', [createExtensionCLI, 'my-extension-home'], {
+      stdio: 'inherit'
+    })
 
     const pathStat = await fs.stat(outputpath)
     const isDirectory = pathStat.isDirectory()

package/create/createExtension.js

@@ -14,9 +14,15 @@ const messages = require('./messages')
 const abortAndClean = require('./steps/abortProjectAndClean')
 const cleanTemplateFolder = require('./steps/cleanTemplateFolder')
 
-process.on('unhandledRejection', (error) => { throw error })
+process.on('unhandledRejection', (error) => {
+  throw error
+})
 
-module.exports = async function (workingDir, projectName, template) {
+module.exports = async function createExtension(
+  workingDir,
+  projectName,
+  template
+) {
   try {
     await createDirectory(workingDir, projectName)
 

package/create/messages/directoryHasConflicts.js

@@ -10,27 +10,25 @@ const path = require('path')
 const fs = require('fs-extra')
 const {log} = require('log-md')
 
-module.exports = async function (projectPath, conflictingFiles) {
+module.exports = async function directoryHasConflicts(
+  projectPath,
+  conflictingFiles
+) {
   const projectName = path.basename(projectPath)
 
-  log(
-    `Conflict! Directory \`${(projectName)}/\` includes conflicting files:`,
-    {gutter: true}
-  )
+  log(`Conflict! Directory \`${projectName}/\` includes conflicting files:`, {
+    gutter: true
+  })
 
   for (const file of conflictingFiles) {
     const stats = await fs.lstat(path.join(projectPath, file))
 
-    log(
-      stats.isDirectory()
-        ? `   📁 - ${file}/`
-        : `       📄 - ${file}`
-    )
+    log(stats.isDirectory() ? `   📁 - ${file}/` : `       📄 - ${file}`)
   }
 
   log(
     'You need to either rename/remove the files listed above,\n' +
-    'or choose a new directory name for your extension.',
+      'or choose a new directory name for your extension.',
     {gutter: true}
   )
 

package/create/messages/programHelp.js

@@ -7,7 +7,7 @@
 
 const {log} = require('log-md')
 
-module.exports = function () {
+module.exports = function programHelp() {
   log(`
     # Help center for the \`create\` command
 

package/create/messages/successfullInstall.js

@@ -9,7 +9,7 @@ const path = require('path')
 
 const {log} = require('log-md')
 
-module.exports = function (workingDir, projectName) {
+module.exports = function successfullInstall(workingDir, projectName) {
   const projectPath = path.join(workingDir, projectName)
   const relativePath = path.relative(workingDir, projectPath)
 

package/create/steps/abortProjectAndClean.js

@@ -10,7 +10,11 @@ const path = require('path')
 const fs = require('fs-extra')
 const {log} = require('log-md')
 
-module.exports = async function (error, workingDir, projectName) {
+module.exports = async function abortProjectAndClean(
+  error,
+  workingDir,
+  projectName
+) {
   const projectPath = path.resolve(workingDir, projectName)
 
   log('😑👎 Aborting installation.')
@@ -24,10 +28,9 @@ module.exports = async function (error, workingDir, projectName) {
       🚨 Unexpected creation error. This is a bug.
     `)
     log(`Please report: "${error}"`)
-    log(
-      'https://github.com/cezaraugusto/extension-create/issues/',
-      {gutter: true}
-    )
+    log('https://github.com/cezaraugusto/extension-create/issues/', {
+      gutter: true
+    })
   }
 
   log('🧹 - Removing files generated from project in:')

package/create/steps/cleanTemplateFolder.js

@@ -10,7 +10,7 @@ const {log} = require('log-md')
 
 const getTemplatePath = require('./getTemplatePath')
 
-module.exports = async function (template) {
+module.exports = async function createTemplateFolder(template) {
   // We don't want to delete local templates
   if (!template) {
     return

package/create/steps/createDirectory.js

@@ -12,16 +12,12 @@ const {log} = require('log-md')
 
 const messages = require('../messages')
 
-const allowlist = [
-  'LICENSE',
-  'node_modules'
-]
-
-module.exports = async function (workingDir, projectName) {
-  log(
-    `👍 Starting a new browser extension named **${projectName}**`,
-    {gutter: true}
-  )
+const allowlist = ['LICENSE', 'node_modules']
+
+module.exports = async function createDirectory(workingDir, projectName) {
+  log(`👍 Starting a new browser extension named **${projectName}**`, {
+    gutter: true
+  })
   const projectPath = path.resolve(workingDir, projectName)
 
   log(`🤞 - Checking if \`${workingDir}\` exists...`)
@@ -31,11 +27,11 @@ module.exports = async function (workingDir, projectName) {
   const currentDir = await fs.readdir(projectPath)
   const conflictingFiles = currentDir
     // .gitignore, .DS_Store, etc
-    .filter(file => !file.startsWith('.'))
+    .filter((file) => !file.startsWith('.'))
     // Logs of yarn/npm
-    .filter(file => !file.endsWith('.log'))
+    .filter((file) => !file.endsWith('.log'))
     // Whatever we think is appropriate
-    .filter(file => !allowlist.includes(file))
+    .filter((file) => !allowlist.includes(file))
 
   // If directory has conflicting files, abort
   if (conflictingFiles.length) {

package/create/steps/getTemplatePath.js

@@ -10,7 +10,7 @@ const path = require('path')
 const templatesDir = path.resolve(__dirname, '../templates')
 const templateTempDir = (template) => `__temp__${template}`
 
-module.exports = function (template) {
+module.exports = function getTemplatePath(template) {
   let thisTemplate
 
   if (template) {

package/create/steps/importExternalTemplate.js

@@ -13,29 +13,30 @@ const {log} = require('log-md')
 
 const templatesDir = path.resolve(__dirname, '../templates')
 
-module.exports = async function (workingDir, projectName, template) {
+module.exports = async function importExternalTemplate(
+  workingDir,
+  projectName,
+  template
+) {
   const projectPath = path.resolve(workingDir, projectName)
   const templateName = template
 
   try {
-    const tempTemplatePath = path
-      .join(templatesDir, `__temp__${templateName}`)
+    const tempTemplatePath = path.join(templatesDir, `__temp__${templateName}`)
 
     log(`⚙️  - Importing template \`${template}\` as requested...`)
     const {name, version} = await pacote.manifest(templateName)
 
-    await pacote
-      .extract(`${name}@${version}`, tempTemplatePath)
+    await pacote.extract(`${name}@${version}`, tempTemplatePath)
 
-    log((`🧰 - Installing **${projectName}** from template \`${templateName}\``))
+    log(`🧰 - Installing **${projectName}** from template \`${templateName}\``)
     const templateDirPath = path.join(tempTemplatePath, 'template')
 
     await fs.copy(templateDirPath, projectPath)
   } catch (error) {
-    log(
-      `😕❓ Can't find template __${templateName}__. ${error}`,
-      {gutter: true}
-    )
+    log(`😕❓ Can't find template __${templateName}__. ${error}`, {
+      gutter: true
+    })
     process.exit(1)
   }
 }

package/create/steps/importLocalTemplate.js

@@ -13,10 +13,9 @@ const {log} = require('log-md')
 const templatesDir = path.resolve(__dirname, '../templates')
 const defaultTemplate = 'standard'
 
-module.exports = async function (workingDir, projectName) {
+module.exports = async function importLocalTemplate(workingDir, projectName) {
   const projectPath = path.resolve(workingDir, projectName)
-  const templateDirPath = path
-    .join(templatesDir, defaultTemplate, 'template')
+  const templateDirPath = path.join(templatesDir, defaultTemplate, 'template')
 
   const templateName = path.basename(templateDirPath)
 
@@ -24,10 +23,9 @@ module.exports = async function (workingDir, projectName) {
     log(`🧰 - Installing **${projectName}** from standard template...`)
     await fs.copy(templateDirPath, projectPath)
   } catch (error) {
-    log(
-      `😕❓ Can't copy template __${templateName}__: ${error}`,
-      {gutter: true}
-    )
+    log(`😕❓ Can't copy template __${templateName}__: ${error}`, {
+      gutter: true
+    })
     process.exit(1)
   }
 }

package/create/steps/installDependencies.js

@@ -13,7 +13,7 @@ const {log} = require('log-md')
 
 const abortProjectAndClean = require('./abortProjectAndClean')
 
-module.exports = async function (workingDir, projectName) {
+module.exports = async function installDependencies(workingDir, projectName) {
   const projectPath = path.resolve(workingDir, projectName)
   const projectPackageJson = path.join(projectPath, 'package.json')
   const packageMetadata = require(projectPackageJson)
@@ -21,10 +21,7 @@ module.exports = async function (workingDir, projectName) {
   const dependencies = packageMetadata.dependencies || []
   const devDependencies = packageMetadata.devDependencies || []
 
-  if (
-    dependencies.length === 0 &&
-    devDependencies.length === 0
-  ) {
+  if (dependencies.length === 0 && devDependencies.length === 0) {
     log('⏭  - No dependencies. Skipping install step...')
 
     return

package/create/steps/writePackageJson.js

@@ -20,16 +20,16 @@ const packageJsonScripts = {
   start: 'extension-create start'
 }
 
-module.exports = async function (workingDir, projectName, template) {
+module.exports = async function writePackageJson(
+  workingDir,
+  projectName,
+  template
+) {
   const projectPath = path.resolve(workingDir, projectName)
 
-  const templatePath = path.resolve(
-    templatesDir,
-    getTemplatePath(template)
-  )
+  const templatePath = path.resolve(templatesDir, getTemplatePath(template))
 
-  const templateJsonPath = path
-    .resolve(templatePath, 'template.json')
+  const templateJsonPath = path.resolve(templatePath, 'template.json')
 
   const templateJson = require(templateJsonPath)
 

package/create/templates/standard/template/manifest.json

@@ -3,29 +3,25 @@
   "version": "1.0",
   "name": "Welcome Extension",
   "description": "An extension to welcome you!",
-	"icons": {
-		"16": "public/icon/test_16.png",
-		"32": "public/icon/test_32.png",
-		"48": "public/icon/test_48.png",
-		"64": "public/icon/test_64.png"
-	},
-	"permissions": [
-		"tabs"
-	],
-	"web_accessible_resources": [
-		"public/*"
-	],
-	"browser_action": {
-		"default_icon": {
-			"16": "public/icon/test_16.png",
-			"32": "public/icon/test_32.png",
-			"48": "public/icon/test_48.png",
-			"64": "public/icon/test_64.png"
-		},
-		"default_popup": "popup/popup.html",
-		"default_title": "Welcome Extension"
-	},
-	"chrome_url_overrides": {
-		"newtab": "newtab/newtab.html"
-	}
+  "icons": {
+    "16": "public/icon/test_16.png",
+    "32": "public/icon/test_32.png",
+    "48": "public/icon/test_48.png",
+    "64": "public/icon/test_64.png"
+  },
+  "permissions": ["tabs"],
+  "web_accessible_resources": ["public/*"],
+  "browser_action": {
+    "default_icon": {
+      "16": "public/icon/test_16.png",
+      "32": "public/icon/test_32.png",
+      "48": "public/icon/test_48.png",
+      "64": "public/icon/test_64.png"
+    },
+    "default_popup": "popup/popup.html",
+    "default_title": "Welcome Extension"
+  },
+  "chrome_url_overrides": {
+    "newtab": "newtab/newtab.html"
+  }
 }

package/create/templates/standard/template/newtab/newtab.html

@@ -1,16 +1,19 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="UTF-8">
+    <meta charset="UTF-8" />
     <title>New tab page</title>
-    <link rel="preconnect" href="https://fonts.gstatic.com">
-    <link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,900&display=swap" rel="stylesheet">
-    <link rel="stylesheet" href="./styles.css">
+    <link rel="preconnect" href="https://fonts.gstatic.com" />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,900&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="./styles.css" />
   </head>
   <body>
     <div class="hello-box">
       <header>
-        <img src="../public/puzzle.png" alt="A puzzle icon">
+        <img src="../public/puzzle.png" alt="A puzzle icon" />
         <h1>Welcome to your extension</h1>
         <p class="description loading">Browser extensions are 🙌🙌🙌</p>
       </header>

package/create/templates/standard/template/newtab/styles.css

@@ -16,7 +16,8 @@ body {
   max-width: 600px;
   padding: 40px;
   margin: auto;
-  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
+    0 2px 4px -1px rgba(0, 0, 0, 0.06);
 }
 
 img {
@@ -31,7 +32,6 @@ h1 {
   color: #00214d;
 }
 
-
 p {
   font-family: 'Courier New';
   font-size: 1.25rem;

package/create/templates/standard/template/popup/popup.css

@@ -17,10 +17,10 @@ main {
 h1 {
   font-size: 2.5rem;
   line-height: 1;
-  color: #27FBB7;
+  color: #27fbb7;
   margin: auto;
 }
 
 div {
   font-size: 4rem;
-}
+}

package/create/templates/standard/template/popup/popup.html

@@ -1,9 +1,9 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="UTF-8">
+    <meta charset="UTF-8" />
     <title>Popup page</title>
-    <link rel="stylesheet" href="./popup.css">
+    <link rel="stylesheet" href="./popup.css" />
   </head>
   <body>
     <main>

package/create/templates/standard/template.json

@@ -1,6 +1,5 @@
 {
   "package": {
-    "devDependencies": {
-    }
+    "devDependencies": {}
   }
 }

package/develop/README.md

@@ -31,20 +31,18 @@ const startExtensionCLI = require('@extension-create/start')
 
 const yourCreateProgram = program
 
-yourCreateProgram
-  .version(packageJson.version)
+yourCreateProgram.version(packageJson.version)
 
 startExtensionCLI(yourCreateProgram)
 
-yourCreateProgram
-  .parse(process.argv)
+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 |
+| Flag           | Argument  | What it does                                              |
+| -------------- | --------- | --------------------------------------------------------- |
+| -m, --manifest | file path | Specify a custom path for your extensions's manifest file |
 
 ## Contributing
 

package/develop/module.js

@@ -11,6 +11,6 @@ const {program} = require('commander')
 
 const startCLI = require('./start/cli')
 
-module.exports = function (clientProgram = program) {
+module.exports = function develop(clientProgram = program) {
   startCLI(clientProgram)
 }