npm - extension-develop - Versions diffs - 2.0.0-alpha.28 → 2.0.0-alpha.29 - Mend

extension-develop 2.0.0-alpha.28 → 2.0.0-alpha.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (26) hide show

package/dist/extensions/gecko-based-manager-extension/pages/welcome.html ADDED Viewed

@@ -0,0 +1,49 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>Welcome!</title>
+    <meta charset="UTF-8" />
+    <link
+      rel="icon"
+      href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🧩</text></svg>"
+    />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="./sakura.css" media="screen" />
+    <link
+      rel="stylesheet"
+      href="./sakura-dark.css"
+      media="screen and (prefers-color-scheme: dark)"
+    />
+    <style>
+      .center-middle {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        height: 100vh;
+        padding: 0;
+        margin: 0;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="center-middle">
+      <h1 style="font-size: 4.2em">
+        Gecko-based Add-on<br />
+        <a href="#"><span id="extensionName"></span></a><br />
+        ready.
+      </h1>
+      <p id="extensionDescription"></p>
+      <p>
+        <a target="_blank" href="https://github.com/cezaraugusto/extension"
+          >🧩 Extension.js</a
+        >
+        is a development tool for browser extensions with built-in support for
+        TypeScript, WebAssembly, React, and modern JavaScript.
+      </p>
+      <button id="learnMore">
+        🧩 Learn more about developing cross-browser extensions
+      </button>
+    </div>
+    <script src="welcome.js"></script>
+  </body>
+</html>

package/dist/extensions/gecko-based-manager-extension/pages/welcome.js ADDED Viewed

@@ -0,0 +1,34 @@
+async function getUserAddon() {
+  const allAddons = await browser.management.getAll()
+  return allAddons.filter((extension) => {
+    return (
+      // Do not include itself
+      extension.id !== browser.runtime.id &&
+      // Reload extension
+      extension.id !== 'reload@extension-js' &&
+      // Show only unpackaged extensions
+      extension.installType === 'development'
+    )
+  })
+}
+async function onStartup() {
+  const userExtension = await getUserAddon()
+  const extensionName = document.getElementById('extensionName')
+  const extensionDescription = document.getElementById('extensionDescription')
+  extensionName.innerText = userExtension[0].name
+  extensionName.title = `• Name: ${userExtension[0].name}
+• ID: ${userExtension[0].id}
+• Version: ${userExtension[0].version}`
+  extensionDescription.innerText = userExtension[0].description
+  const learnMore = document.getElementById('learnMore')
+  learnMore.addEventListener('click', () => {
+    browser.tabs.create({url: 'https://extension.js.org/'})
+  })
+}
+onStartup().catch(console.error)

package/dist/extensions/gecko-based-manager-extension/public/logo.png ADDED Viewed

Binary file

package/dist/extensions/gecko-based-manager-extension/reload-service.js ADDED Viewed

@@ -0,0 +1,130 @@
+let webSocket = null
+export async function connect() {
+  if (webSocket) {
+    // If already connected, do nothing
+    return
+  }
+  webSocket = new WebSocket('wss://127.0.0.1:8002')
+  webSocket.onerror = (event) => {
+    console.error(`[Reload Service] Connection error: ${JSON.stringify(event)}`)
+    webSocket.close()
+  }
+  webSocket.onopen = () => {
+    console.info(`[Reload Service] Connection opened.`)
+  }
+  webSocket.onmessage = async (event) => {
+    const message = JSON.parse(event.data)
+    if (message.status === 'serverReady') {
+      console.info('[Reload Service] Connection ready.')
+      await requestInitialLoadData()
+    }
+    if (message.changedFile) {
+      console.info(
+        `[Reload Service] Changes detected on ${message.changedFile}. Reloading extension...`
+      )
+      await messageAllExtensions(message.changedFile)
+    }
+  }
+  webSocket.onclose = () => {
+    console.info('[Reload Service] Connection closed.')
+    webSocket = null
+  }
+}
+export function disconnect() {
+  if (webSocket) {
+    webSocket.close()
+  }
+}
+async function getDevExtensions() {
+  const allExtensions = await browser.management.getAll()
+  return allExtensions.filter((extension) => {
+    return (
+      // Do not include itself
+      extension.id !== browser.runtime.id &&
+      // Manager extension
+      extension.name !== 'Add-On Manager' &&
+      // Show only unpackaged extensions
+      extension.installType === 'development'
+    )
+  })
+}
+async function messageAllExtensions(changedFile) {
+  // Check if the external extension is ready
+  const isExtensionReady = await checkExtensionReadiness()
+  if (isExtensionReady) {
+    const devExtensions = await getDevExtensions()
+    for (const extension of devExtensions) {
+      try {
+        await browser.runtime.sendMessage(extension.id, {changedFile})
+        console.info('[Reload Service] Add-On reloaded and ready.')
+      } catch (error) {
+        console.error(
+          `Error sending message to ${extension.id}: ${error.message}`
+        )
+      }
+    }
+  } else {
+    console.info('[Reload Service] External extension is not ready.')
+  }
+}
+async function requestInitialLoadData() {
+  const devExtensions = await getDevExtensions()
+  const responses = await Promise.all(
+    devExtensions.map(async (extension) => {
+      try {
+        const result = await browser.runtime.sendMessage(extension.id, {
+          initialLoadData: true
+        })
+        return result
+      } catch (error) {
+        console.error(
+          `Error sending message to ${extension.id}: ${error.message}`
+        )
+        return null
+      }
+    })
+  )
+  // We received the info from the use extension.
+  // All good, client is ready. Inform the server.
+  if (webSocket && webSocket.readyState === WebSocket.OPEN) {
+    const message = JSON.stringify({
+      status: 'clientReady',
+      data: responses.find((response) => response !== null)
+    })
+    webSocket.send(message)
+  }
+}
+async function checkExtensionReadiness() {
+  // Delay for 1 second
+  await delay(1000)
+  // Assume the extension is ready
+  return true
+}
+async function delay(ms) {
+  return await new Promise((resolve) => setTimeout(resolve, ms)).catch(
+    (error) => {
+      console.error(`Error delaying: ${error.message}`)
+    }
+  )
+}

package/dist/inject-content-css-during-dev.js CHANGED Viewed

@@ -1,10 +1,10 @@
-"use strict";var D=Object.create;var m=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var L=(e,n)=>{for(var r in n)m(e,r,{get:n[r],enumerable:!0})},y=(e,n,r,i)=>{if(n&&typeof n=="object"||typeof n=="function")for(let t of I(n))!C.call(e,t)&&t!==r&&m(e,t,{get:()=>n[t],enumerable:!(i=R(n,t))||i.enumerable});return e};var a=(e,n,r)=>(r=e!=null?D(k(e)):{},y(n||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),A=e=>y(m({},"__esModule",{value:!0}),e);var K={};L(K,{default:()=>M});module.exports=A(K);var x=a(require("path")),w=require("loader-utils"),S=require("schema-utils");var g=a(require("path")),q=a(require("fs")),B=require("child_process"),z=require("package-manager-detector");var W=a(require("path")),o=require("@colors/colors/safe");var v=a(require("path")),P=v.default.join(process.cwd(),"node_modules/extension-develop/dist/certs"),b=["chrome","edge"],U=["firefox"],Q=[...b,...U];function E(e){return e.replace(/\\/g,"/")}function h(e,n={}){if(!n)return!1;let r=g.default.normalize(E(e));return Object.values(n).some(t=>typeof t!="string"?!1:E(t).includes(r))}function N(e,n){let r=g.default.relative(g.default.dirname(e),n);return!r.startsWith(".")&&!r.startsWith("..")&&(r="./"+r),r}var $=a(require("fs")),_=a(require("path"));function F(e,n){return(Array.isArray(e)?e||[]:e?[e]:[]).filter(t=>{let l=$.default.existsSync(t)&&!h(t,n),s=_.default.extname(t);return l&&(s===".js"||s===".mjs"||s===".jsx"||s===".ts"||s===".tsx")})}function j(e,n){return(Array.isArray(e)?e||[]:e?[e]:[]).filter(t=>$.default.existsSync(t)&&!h(t,n)&&(t.endsWith(".css")||t.endsWith(".scss")||t.endsWith(".sass")||t.endsWith(".less")))}var V={type:"object",properties:{test:{type:"string"},manifestPath:{type:"string"},includeList:{type:"object"},excludeList:{type:"object"}}},G=`/**
+"use strict";var D=Object.create;var m=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var L=(e,n)=>{for(var r in n)m(e,r,{get:n[r],enumerable:!0})},y=(e,n,r,i)=>{if(n&&typeof n=="object"||typeof n=="function")for(let t of I(n))!C.call(e,t)&&t!==r&&m(e,t,{get:()=>n[t],enumerable:!(i=R(n,t))||i.enumerable});return e};var a=(e,n,r)=>(r=e!=null?D(k(e)):{},y(n||!e||!e.__esModule?m(r,"default",{value:e,enumerable:!0}):r,e)),A=e=>y(m({},"__esModule",{value:!0}),e);var K={};L(K,{default:()=>M});module.exports=A(K);var x=a(require("path")),w=require("loader-utils"),S=require("schema-utils");var g=a(require("path")),q=a(require("fs")),B=require("child_process"),z=require("package-manager-detector");var W=a(require("path")),o=require("@colors/colors/safe");var v=a(require("path")),P=v.default.join(process.cwd(),"node_modules/extension-develop/dist/certs"),b=["chrome","edge"],U=["firefox"],Q=[...b,...U];function E(e){return e.replace(/\\/g,"/")}function h(e,n={}){if(!n)return!1;let r=g.default.normalize(E(e));return Object.values(n).some(t=>typeof t!="string"?!1:E(t).includes(r))}function N(e,n){let r=g.default.relative(g.default.dirname(e),n);return!r.startsWith(".")&&!r.startsWith("..")&&(r="./"+r),r}var $=a(require("fs")),F=a(require("path"));function _(e,n){return(Array.isArray(e)?e||[]:e?[e]:[]).filter(t=>{let l=$.default.existsSync(t)&&!h(t,n),s=F.default.extname(t);return l&&(s===".js"||s===".mjs"||s===".jsx"||s===".ts"||s===".tsx")})}function j(e,n){return(Array.isArray(e)?e||[]:e?[e]:[]).filter(t=>$.default.existsSync(t)&&!h(t,n)&&(t.endsWith(".css")||t.endsWith(".scss")||t.endsWith(".sass")||t.endsWith(".less")))}var V={type:"object",properties:{test:{type:"string"},manifestPath:{type:"string"},includeList:{type:"object"},excludeList:{type:"object"}}},G=`/**
  * Welcome to to your content_scripts CSS file during development!
  * To speed up the development process, your styles
  * are being injected directly into the head of the webpage,
  * and will be removed when you build your application, along
  * with this file. If you are seeing this file in a production build,
  * it means that something is wrong with your build configuration.
- */`;function M(e){let n=this.getOptions();(0,S.validate)(V,n,{name:"scripts:inject-content-css-during-dev",baseDataPath:"options"});let r=n.includeList||{},i=[],t=Object.entries(r).filter(([s,u])=>s.startsWith("content")&&u);if(!t.length)return e;for(let s of t){let[u,d]=s,c=[...F(d,n.excludeList||{})],p=j(d,n.excludeList||{});if(p.length&&!c.length){let f=x.default.resolve(__dirname,"minimum-content-file.mjs");c.push(f)}i.push({feature:u,scriptPath:c[0],cssImports:p.map(f=>N(c[0],f))})}let l=(0,w.urlToRequest)(this.resourcePath);return i.forEach(({feature:s,scriptPath:u,cssImports:d})=>{if(l.includes(u)){let c=d.map(p=>{let[,f]=s.split("/"),O=f.split("-")[1],T=x.default.basename(p);return`import(/* webpackChunkName: "${`web_accessible_resources/resource-${O}/${T.replace(".","_")}`}" */ '${p}').then(css => console.info('content_script.css loaded', css)).catch(err => console.error(err));`}).join(`
+ */`;function M(e){let n=this.getOptions();(0,S.validate)(V,n,{name:"scripts:inject-content-css-during-dev",baseDataPath:"options"});let r=n.includeList||{},i=[],t=Object.entries(r).filter(([s,u])=>s.startsWith("content")&&u);if(!t.length)return e;for(let s of t){let[u,d]=s,c=[..._(d,n.excludeList||{})],p=j(d,n.excludeList||{});if(p.length&&!c.length){let f=x.default.resolve(__dirname,"minimum-content-file.mjs");c.push(f)}i.push({feature:u,scriptPath:c[0],cssImports:p.map(f=>N(c[0],f))})}let l=(0,w.urlToRequest)(this.resourcePath);return i.forEach(({feature:s,scriptPath:u,cssImports:d})=>{if(l.includes(u)){let c=d.map(p=>{let[,f]=s.split("/"),O=f.split("-")[1],T=x.default.basename(p);return`import(/* webpackChunkName: "${`web_accessible_resources/resource-${O}/${T.replace(".","_")}`}" */ '${p}').then(css => console.info('content_script.css loaded', css)).catch(err => console.error(err));`}).join(`
 `);this.emitFile(`${s}.css`,G),e=`${c}
 ${e}`}}),e}

package/dist/module.d.ts CHANGED Viewed

@@ -1,9 +1,8 @@
 import { Configuration } from 'webpack';
 interface DevOptions {
-    browser: 'chrome' | 'edge' | 'firefox';
+    browser: 'chrome' | 'edge' | 'firefox' | 'chromium-based' | 'gecko-based';
     mode: 'development' | 'production' | 'none' | undefined;
-    port?: number;
     noOpen?: boolean;
     userDataDir?: string;
     profile?: string;
@@ -11,6 +10,8 @@ interface DevOptions {
     browserFlags?: string[];
     startingUrl?: string;
     polyfill?: boolean;
+    chromiumBinary?: string;
+    geckoBinary?: string;
 }
 declare function extensionDev(pathOrRemoteUrl: string | undefined, devOptions: DevOptions): Promise<void>;
@@ -23,23 +24,24 @@ interface BuildOptions {
 }
 declare function extensionBuild(pathOrRemoteUrl: string | undefined, buildOptions?: BuildOptions): Promise<void>;
-interface PreviewOptions {
-    browser: DevOptions['browser'];
-    userDataDir?: string;
+interface PreviewOptions extends DevOptions {
 }
 declare function extensionPreview(pathOrRemoteUrl: string | undefined, previewOptions: PreviewOptions): Promise<void>;
-interface StartOptions {
-    mode: 'development' | 'production';
-    browser: DevOptions['browser'];
-    port?: number;
-    noOpen?: boolean;
-    userDataDir?: string;
-    polyfill?: boolean;
+interface StartOptions extends DevOptions {
 }
 declare function extensionStart(pathOrRemoteUrl: string | undefined, startOptions: StartOptions): Promise<void>;
 interface FileConfig {
+    browser: {
+        chrome: Pick<DevOptions, 'noOpen' | 'profile' | 'preferences' | 'browserFlags' | 'startingUrl' | 'chromiumBinary' | 'geckoBinary'>;
+    };
+    commands: {
+        dev: Pick<DevOptions, 'browser' | 'profile' | 'preferences' | 'polyfill'>;
+        start: Pick<StartOptions, 'browser' | 'profile' | 'preferences' | 'polyfill'>;
+        preview: Pick<PreviewOptions, 'browser' | 'profile' | 'preferences' | 'polyfill'>;
+        build: Pick<BuildOptions, 'browser' | 'zipFilename' | 'zip' | 'zipSource' | 'polyfill'>;
+    };
     config: (config: Configuration) => Configuration;
 }