extension 1.6.0 → 1.7.0-beta.0

package/README.md

@@ -14,15 +14,18 @@
 
 # Extension.js [![npm][npm-image]][npm-url] [![fossa][fossa-image]][fossa-url] [![workflow][action-image]][action-url] [![downloads][downloads-image]][downloads-url] [![PR's welcome][prs]][prs-url]
 
-> Plug-and-play, zero-config, cross-browser extension development tool.
+<!-- > Plug-and-play, zero-config, cross-browser extension development tool. -->
 
-<img alt="Extension.js with all the browser runners open" src="https://github.com/cezaraugusto/extension.js/assets/4672033/f0f5bbfc-e873-4856-9fdd-db2b42d9ab96">
+> Make it very easy to develop cross-browser extensions.
 
+<img alt="Extension.js with all the browser runners open" src="https://github.com/cezaraugusto/extension.js/assets/4672033/f0f5bbfc-e873-4856-9fdd-db2b42d9ab96"> 
 <hr>
 
 <img alt="Logo" align="right" src="https://user-images.githubusercontent.com/4672033/102850460-4d22aa80-43f8-11eb-82db-9efce586f73e.png" width="25%" />
 
-**Create cross-browser extensions with no build configuration.**
+<!-- **Create cross-browser extensions with no build configuration.** -->
+
+> Create cross-browser extensions with no build configuration.
 
 - [Create A New Extension](#create-a-new-extension) — How to create a new extension.
 - [Get Started Immediately](#get-started-immediately) — Get work done in no time.
@@ -32,7 +35,7 @@ Extension.js is a plug-and-play, zero-config, cross-browser extension developmen
 
 ## Create A New Extension
 
-```sh
+```bash
 npx extension create my-extension
 cd my-extension
 npm run dev
@@ -56,85 +59,63 @@ For a preview of extensions running these technologies, see documentation about
 
 ## Get Started Immediately
 
-## Kickstart Any Sample from Chrome Extension Samples
-
-Dive right into development by starting with a sample from the Chrome Extension Samples repository. It's a great way to get acquainted with best practices and save time:
+### Use Chrome to start developing an extension from Chrome Extension Samples
 
-1. Open your terminal.
-2. Navigate to the directory where you want your project.
-3. Run the command:
-   ```bash
-   npx extension dev <sample-name>
-   ```
-   Replace `<sample-name>` with the name of the sample you wish to use from [Chrome Extension Samples](https://github.com/GoogleChrome/chrome-extensions-samples).
+> See the example below where we request the sample [page-redder](https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/functional-samples/sample.page-redder) from [Google Chrome Extension Samples](https://github.com/GoogleChrome/chrome-extensions-samples).
 
-See the example below where we request the sample [page-redder](https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/functional-samples/sample.page-redder) from [Google Chrome Extension Samples](https://github.com/GoogleChrome/chrome-extensions-samples).
-
-```sh
+```bash
 npx extension dev https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/functional-samples/sample.page-redder --browser=edge
 ```
 
 https://github.com/cezaraugusto/extension/assets/4672033/ee221a94-6ec7-4e04-8553-8812288927f1
 
-### Use `Microsoft Edge` to kickstart any sample from [chrome-extesions-sample](https://github.com/GoogleChrome/chrome-extensions-samples/)
-
-Extension.js supports a variety of browsers, including Microsoft Edge. To start an Edge-compatible extension, simply:
+</details>
 
-1. Open your terminal.
-2. Navigate to your desired project directory.
-3. Execute:
-   ```bash
-   npx extension dev  <sample-name> --browser=edge
-   ```
-   Tailor your command by replacing `<sample-name>` with the specific sample you're interested in.
+<details>
+   <summary>   
+   🔥 Use Edge to start developing an extension from Chrome Extension Samples 
+   </summary>
 
-> See the example below where we request the sample [magic8ball](https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/api-samples/topSites/magic8ball) from from [Google Chrome Extension Samples](https://github.com/GoogleChrome/chrome-extensions-samples) using Edge as the runtime browser.
+> See the example below where we request the sample [magic8ball](https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/api-samples/topSites/magic8ball) from from [Google Chrome Extension Samples](https://github.com/GoogleChrome/chrome-extensions-samples) with Edge as the runtime browser.
 
-```sh
+```bash
 npx extension dev https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/api-samples/topSites/magic8ball --browser=edge
 ```
 
 https://github.com/cezaraugusto/extension/assets/4672033/2db2a1f6-3110-4380-9a49-dc9d034146aa
 
-### Run Mozilla Add-Ons Using Edge
-
-Bridge the gap between Firefox and Edge by running Mozilla Add-Ons using Edge:
+</details>
 
-1. Navigate to your project directory.
-2. Use the command:
-   ```bash
-   npx extension dev <addon-name> --browser=edge --polyfill=true
-   ```
-   This will fetch a Mozilla Add-On and adapt it for Edge.
+<details>
+   <summary>
+   🔥🔥 Use Edge to start developing a Mozilla Add-On from MDN WebExtensions Examples
+   </summary>
 
 > See the example below where we request the sample [Apply CSS](https://github.com/mdn/webextensions-examples/tree/main/apply-css) from [MDN WebExtensions Examples](https://github.com/mdn/webextensions-examples) using Edge as the runtime browser.
 
-```sh
+```bash
 npx extension dev https://github.com/mdn/webextensions-examples/tree/main/apply-css --browser=edge --polyfill=true
 ```
 
 https://github.com/cezaraugusto/extension/assets/4672033/130cb430-1567-419c-8c90-23fddcf20f00
 
-### Run Mozilla Add-Ons On Firefox And Chrome
-
-Need to run Firefox and Chrome at once? _Sem problemas_.
+</details>
 
-1. Navigate to your project directory.
-2. Use the command:
-   ```bash
-   # Ensure you either have a polyfill installed or --polyfill is set.
-   npx extension dev <addon-name> --browser=chrome,firefox --polyfill=true
-   ```
-   This will fetch a Mozilla Add-On and adapt it for Chrome, or vice-versa.
+<details>
+   <summary>
+   🔥🔥🔥 Use Chrome and Firefox to start developing a Mozilla Add-On from MDN WebExtensions Examples
+   </summary>
 
 > See the example below where we request the sample [firefox-code-search](https://github.com/mdn/webextensions-examples/tree/main/firefox-code-search) from [MDN WebExtensions Examples](https://github.com/mdn/webextensions-examples) using Chrome and Firefox as the runtime browsers.
 
-```sh
+```bash
 npx extension dev https://github.com/mdn/webextensions-examples/tree/main/firefox-code-search --browser=chrome,firefox --polyfill=true
 ```
 
 https://github.com/cezaraugusto/extension.js/assets/4672033/ac94b608-c936-40df-bce7-63ffd7fe31c5
 
+</details>
+
 ## I have An Extension
 
 https://github.com/cezaraugusto/extension/assets/4672033/48694a23-b7f1-4098-9c5d-eff49983739c
@@ -143,7 +124,7 @@ If you have an existing extension which is using a package manager, you can inst
 
 **Step 1 - Install extension as a `devDependency`**
 
-```sh
+```bash
 npm install extension --save-dev
 ```
 

package/dist/cli.js

@@ -141,7 +141,7 @@ var package_default = {
     node: ">=18"
   },
   name: "extension",
-  version: "1.6.0",
+  version: "1.7.0-beta.0",
   description: "Create cross-browser extensions with no build configuration.",
   main: "./dist/cli.js",
   types: "./dist/cli.d.ts",
@@ -257,10 +257,10 @@ extensionJs.command("dev").arguments("[project-path|remote-url]").usage("dev [pr
   "-u, --user-data-dir <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>",
+  "-b, --browser <chrome | edge | firefox>",
   "specify a browser to run your extension in development mode"
 ).option(
-  "--polyfill <boolean>",
+  "--polyfill [boolean]",
   "whether or not to apply the cross-browser polyfill. Defaults to `true`"
 ).option(
   "-p, --port <number>",
@@ -278,10 +278,10 @@ extensionJs.command("start").arguments("[project-path|remote-url]").usage("start
   "-u, --user-data-dir <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>",
+  "-b, --browser <chrome | edge | firefox>",
   "specify a browser to run your extension in development mode"
 ).option(
-  "--polyfill <boolean>",
+  "--polyfill [boolean]",
   "whether or not to apply the cross-browser polyfill. Defaults to `true`"
 ).option(
   "-p, --port <number>",
@@ -296,11 +296,20 @@ extensionJs.command("start").arguments("[project-path|remote-url]").usage("start
   }
 });
 extensionJs.command("build").arguments("[project-name]").usage("build [path-to-remote-extension] [options]").description("Builds the extension for production").option(
-  "-b, --browser <chrome | edge>",
+  "-b, --browser <chrome | edge | firefox>",
   "specify a browser to run your extension in development mode"
 ).option(
-  "--polyfill <boolean>",
+  "--polyfill [boolean]",
   "whether or not to apply the cross-browser polyfill. Defaults to `false`"
+).option(
+  "--zip [boolean]",
+  "whether or not to compress the extension into a ZIP file. Defaults to `false`"
+).option(
+  "--zip-source [boolean]",
+  "whether or not to include the source files in the ZIP file. Defaults to `false`"
+).option(
+  "--zip-filename <string>",
+  "specify the name of the ZIP file. Defaults to the extension name and version"
 ).action(async function(pathOrRemoteUrl, { browser = "chrome", ...buildOptions }) {
   for (const vendor of vendors(browser)) {
     await (0, import_develop.extensionBuild)(pathOrRemoteUrl, {

package/package.json

@@ -9,7 +9,7 @@
     "node": ">=18"
   },
   "name": "extension",
-  "version": "1.6.0",
+  "version": "1.7.0-beta.0",
   "description": "Create cross-browser extensions with no build configuration.",
   "main": "./dist/cli.js",
   "types": "./dist/cli.d.ts",
@@ -67,4 +67,4 @@
     "tsup": "^8.0.1",
     "typescript": "5.3.3"
   }
-}
+}