wxt 0.20.7 → 0.20.9

package/README.md

@@ -1,51 +1,33 @@
 <!-- DO NOT EDIT, THIS FILE WAS GENERATED BY '../../scripts/generate-readmes.sh' -->
-<h1 align="center">
-  <img align="top" width="44" src="https://raw.githubusercontent.com/wxt-dev/wxt/HEAD/docs/public/hero-logo.svg" alt="WXT Logo">
-  <span>WXT</span>
-</h1>
-
-<p align="center">
-  <a href="https://www.npmjs.com/package/wxt" target="_blank"><img alt="npm version" src="https://img.shields.io/npm/v/wxt?labelColor=black&color=%234fa048"></a>
-  <span> </span>
-  <a href="https://www.npmjs.com/package/wxt" target="_blank"><img alt="downloads" src="https://img.shields.io/npm/dm/wxt?labelColor=black&color=%234fa048"></a>
-  <span> </span>
-  <a href="https://github.com/wxt-dev/wxt/blob/main/LICENSE" target="_blank"><img alt="license | MIT" src="https://img.shields.io/npm/l/wxt?labelColor=black&color=%234fa048"></a>
-  <span> </span>
-  <a href="https://codecov.io/github/wxt-dev/wxt" target="_blank"><img alt="coverage" src="https://img.shields.io/codecov/c/github/wxt-dev/wxt?labelColor=black&color=%234fa048"></a>
-</p>
-
-<p align="center">
-  <span>Next-gen framework for developing web extensions.</span>
-  <br/>
-  <span>⚡</span>
-  <br/>
-  <q><i>It's like Nuxt, but for Web Extensions</i></q>
-</p>
-
-<p align="center">
-  <a href="https://wxt.dev/guide/installation.html" target="_blank">Get Started</a>
-  &bull;
-  <a href="https://wxt.dev/api/config.html" target="_blank">Configuration</a>
-  &bull;
-  <a href="https://wxt.dev/examples.html" target="_blank">Examples</a>
-  &bull;
-  <a href="https://github.com/wxt-dev/wxt/blob/main/packages/wxt/CHANGELOG.md" target="_blank">Changelog</a>
-  &bull;
-  <a href="https://discord.gg/ZFsZqGery9" target="_blank">Discord</a>
-</p>
+<div align="center">
+
+# <img align="top" width="44" src="https://raw.githubusercontent.com/wxt-dev/wxt/HEAD/docs/public/hero-logo.svg" alt="WXT Logo"> WXT
+
+[![npm version](https://img.shields.io/npm/v/wxt?labelColor=black&color=%234fa048)](https://www.npmjs.com/package/wxt)
+[![downloads](https://img.shields.io/npm/dm/wxt?labelColor=black&color=%234fa048)](https://www.npmjs.com/package/wxt)
+[![license | MIT](https://img.shields.io/npm/l/wxt?labelColor=black&color=%234fa048)](https://github.com/wxt-dev/wxt/blob/main/LICENSE)
+[![coverage](https://img.shields.io/codecov/c/github/wxt-dev/wxt?labelColor=black&color=%234fa048)](https://codecov.io/github/wxt-dev/wxt)
+
+Next-gen framework for developing web extensions.<br/>⚡<br/><q><i>It's like Nuxt, but for Web Extensions</i></q>
+
+[Get Started](https://wxt.dev/guide/installation.html) •
+[Configuration](https://wxt.dev/api/config.html) •
+[Examples](https://wxt.dev/examples.html) •
+[Changelog](https://github.com/wxt-dev/wxt/blob/main/packages/wxt/CHANGELOG.md) •
+[Discord](https://discord.gg/ZFsZqGery9)
+
+</div>
 
 ![Example CLI Output](https://raw.githubusercontent.com/wxt-dev/wxt/HEAD/docs/assets/cli-output.png)
 
 ## Demo
 
-https://github.com/wxt-dev/wxt/assets/10101283/4d678939-1bdb-495c-9c36-3aa281d84c94
+<https://github.com/wxt-dev/wxt/assets/10101283/4d678939-1bdb-495c-9c36-3aa281d84c94>
 
 ## Quick Start
 
 Bootstrap a new project:
 
-<!-- automd:pm-x version="latest" name="wxt" args="init" -->
-
 ```sh
 # npm
 npx wxt@latest init
@@ -57,8 +39,6 @@ pnpm dlx wxt@latest init
 bunx wxt@latest init
 ```
 
-<!-- /automd -->
-
 Or see the [installation guide](https://wxt.dev/guide/installation.html) to get started with WXT.
 
 ## Features
@@ -80,17 +60,11 @@ Or see the [installation guide](https://wxt.dev/guide/installation.html) to get
 
 WXT is a [MIT-licensed](https://github.com/wxt-dev/wxt/blob/main/LICENSE) open source project with its ongoing development made possible entirely by the support of these awesome backers. If you'd like to join them, please consider [sponsoring WXT's development](https://github.com/sponsors/wxt-dev).
 
-<a href="https://github.com/sponsors/wxt-dev"><img alt="WXT Sponsors" src="https://raw.githubusercontent.com/wxt-dev/static/refs/heads/main/sponsorkit/sponsors.svg"></a>
+[![WXT Sponsors](https://raw.githubusercontent.com/wxt-dev/static/refs/heads/main/sponsorkit/sponsors.svg)](https://github.com/sponsors/wxt-dev)
 
 ## Contributors
 
-<!-- automd:contributors author="aklinker1" license="MIT" github="wxt-dev/wxt" -->
-
 Published under the [MIT](https://github.com/wxt-dev/wxt/blob/main/LICENSE) license.
 Made by [@aklinker1](https://github.com/aklinker1) and [community](https://github.com/wxt-dev/wxt/graphs/contributors) 💛
-<br><br>
-<a href="https://github.com/wxt-dev/wxt/graphs/contributors">
-<img src="https://contrib.rocks/image?repo=wxt-dev/wxt" />
-</a>
 
-<!-- /automd -->
+[![WXT contributors](https://contrib.rocks/image?repo=wxt-dev/wxt)](https://github.com/wxt-dev/wxt/graphs/contributors)

package/dist/core/builders/vite/index.d.ts

@@ -1,3 +1,7 @@
 import { ResolvedConfig, WxtBuilder, WxtDevServer, WxtHooks } from '../../../types';
 import { Hookable } from 'hookable';
 export declare function createViteBuilder(wxtConfig: ResolvedConfig, hooks: Hookable<WxtHooks>, getWxtDevServer?: () => WxtDevServer | undefined): Promise<WxtBuilder>;
+/**
+ * Recursively remove all directories that are empty/
+ */
+export declare function removeEmptyDirs(dir: string): Promise<void>;

package/dist/core/builders/vite/index.mjs

@@ -9,7 +9,9 @@ import { ViteNodeServer } from "vite-node/server";
 import { ViteNodeRunner } from "vite-node/client";
 import { installSourcemapsSupport } from "vite-node/source-map";
 import { createExtensionEnvironment } from "../../utils/environments/index.mjs";
-import { relative } from "node:path";
+import { dirname, extname, join, relative } from "node:path";
+import fs from "fs-extra";
+import { normalizePath } from "../../utils/paths.mjs";
 export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
   const vite = await import("vite");
   const getBaseConfig = async (baseConfigOptions) => {
@@ -62,20 +64,16 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
     const plugins = [
       wxtPlugins.entrypointGroupGlobals(entrypoint)
     ];
+    const iifeReturnValueName = safeVarName(entrypoint.name);
     if (entrypoint.type === "content-script-style" || entrypoint.type === "unlisted-style") {
       plugins.push(wxtPlugins.cssEntrypoints(entrypoint, wxtConfig));
     }
-    const iifeReturnValueName = safeVarName(entrypoint.name);
-    const libMode = {
+    if (entrypoint.type === "content-script" || entrypoint.type === "unlisted-script") {
+      plugins.push(wxtPlugins.iifeFooter(iifeReturnValueName));
+    }
+    return {
       mode: wxtConfig.mode,
       plugins,
-      esbuild: {
-        // Add a footer with the returned value so it can return values to `scripting.executeScript`
-        // Footer is added a part of esbuild to make sure it's not minified. It
-        // get's removed if added to `build.rollupOptions.output.footer`
-        // See https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/scripting/executeScript#return_value
-        footer: iifeReturnValueName + ";"
-      },
       build: {
         lib: {
           entry,
@@ -109,7 +107,6 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
         "process.env.NODE_ENV": JSON.stringify(wxtConfig.mode)
       }
     };
-    return libMode;
   };
   const getMultiPageConfig = (entrypoints) => {
     const htmlEntrypoints = new Set(
@@ -117,10 +114,7 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
     );
     return {
       mode: wxtConfig.mode,
-      plugins: [
-        wxtPlugins.multipageMove(entrypoints, wxtConfig),
-        wxtPlugins.entrypointGroupGlobals(entrypoints)
-      ],
+      plugins: [wxtPlugins.entrypointGroupGlobals(entrypoints)],
       build: {
         rollupOptions: {
           input: entrypoints.reduce((input, entry) => {
@@ -238,7 +232,7 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
     async build(group) {
       let entryConfig;
       if (Array.isArray(group)) entryConfig = getMultiPageConfig(group);
-      else if (group.inputPath.endsWith(".css"))
+      else if (group.type === "content-script-style" || group.type === "unlisted-style")
         entryConfig = getCssConfig(group);
       else entryConfig = getLibModeConfig(group);
       const buildConfig = vite.mergeConfig(await getBaseConfig(), entryConfig);
@@ -248,9 +242,10 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
         buildConfig
       );
       const result = await vite.build(buildConfig);
+      const chunks = getBuildOutputChunks(result);
       return {
         entrypoints: group,
-        chunks: getBuildOutputChunks(result)
+        chunks: await moveHtmlFiles(wxtConfig, group, chunks)
       };
     },
     async createServer(info) {
@@ -315,3 +310,47 @@ function getRollupEntry(entrypoint) {
   }
   return entrypoint.inputPath;
 }
+async function moveHtmlFiles(config, group, chunks) {
+  if (!Array.isArray(group)) return chunks;
+  const entryMap = group.reduce((map, entry) => {
+    const a = normalizePath(relative(config.root, entry.inputPath));
+    map[a] = entry;
+    return map;
+  }, {});
+  const movedChunks = await Promise.all(
+    chunks.map(async (chunk) => {
+      if (!chunk.fileName.endsWith(".html")) return chunk;
+      const entry = entryMap[chunk.fileName];
+      const oldBundlePath = chunk.fileName;
+      const newBundlePath = getEntrypointBundlePath(
+        entry,
+        config.outDir,
+        extname(chunk.fileName)
+      );
+      const oldAbsPath = join(config.outDir, oldBundlePath);
+      const newAbsPath = join(config.outDir, newBundlePath);
+      await fs.ensureDir(dirname(newAbsPath));
+      await fs.move(oldAbsPath, newAbsPath, { overwrite: true });
+      return {
+        ...chunk,
+        fileName: newBundlePath
+      };
+    })
+  );
+  removeEmptyDirs(config.outDir);
+  return movedChunks;
+}
+export async function removeEmptyDirs(dir) {
+  const files = await fs.readdir(dir);
+  for (const file of files) {
+    const filePath = join(dir, file);
+    const stats = await fs.stat(filePath);
+    if (stats.isDirectory()) {
+      await removeEmptyDirs(filePath);
+    }
+  }
+  try {
+    await fs.rmdir(dir);
+  } catch {
+  }
+}

package/dist/core/builders/vite/plugins/devServerGlobals.mjs

@@ -6,7 +6,7 @@ export function devServerGlobals(config, server) {
       return {
         define: {
           __DEV_SERVER_ORIGIN__: JSON.stringify(
-            server.origin.replace(/^http(s):/, "ws$1:")
+            server.origin.replace(/^http(s?):/, "ws$1:")
           )
         }
       };

package/dist/core/builders/vite/plugins/iifeFooter.d.ts

@@ -0,0 +1,8 @@
+import type { Plugin } from 'vite';
+/**
+ * Add a footer with the returned value so it can return values to `scripting.executeScript`
+ * Footer is added a part of esbuild to make sure it's not minified. It
+ * get's removed if added to `build.rollupOptions.output.footer`
+ * See https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/scripting/executeScript#return_value
+ */
+export declare function iifeFooter(iifeReturnValueName: string): Plugin;

package/dist/core/builders/vite/plugins/iifeFooter.mjs

@@ -0,0 +1,12 @@
+export function iifeFooter(iifeReturnValueName) {
+  return {
+    name: "wxt:iife-footer",
+    generateBundle(_, bundle) {
+      for (const chunk of Object.values(bundle)) {
+        if (chunk.type === "chunk" && chunk.isEntry) {
+          chunk.code += `${iifeReturnValueName};`;
+        }
+      }
+    }
+  };
+}

package/dist/core/builders/vite/plugins/index.d.ts

@@ -1,7 +1,6 @@
 export * from './devHtmlPrerender';
 export * from './devServerGlobals';
 export * from './download';
-export * from './multipageMove';
 export * from './resolveVirtualModules';
 export * from './tsconfigPaths';
 export * from './noopBackground';
@@ -14,3 +13,4 @@ export * from './defineImportMeta';
 export * from './removeEntrypointMainFunction';
 export * from './wxtPluginLoader';
 export * from './resolveAppConfig';
+export * from './iifeFooter';

package/dist/core/builders/vite/plugins/index.mjs

@@ -1,7 +1,6 @@
 export * from "./devHtmlPrerender.mjs";
 export * from "./devServerGlobals.mjs";
 export * from "./download.mjs";
-export * from "./multipageMove.mjs";
 export * from "./resolveVirtualModules.mjs";
 export * from "./tsconfigPaths.mjs";
 export * from "./noopBackground.mjs";
@@ -14,3 +13,4 @@ export * from "./defineImportMeta.mjs";
 export * from "./removeEntrypointMainFunction.mjs";
 export * from "./wxtPluginLoader.mjs";
 export * from "./resolveAppConfig.mjs";
+export * from "./iifeFooter.mjs";

package/dist/core/create-server.mjs

@@ -73,8 +73,10 @@ async function createServerInternal() {
       });
       await buildAndOpenBrowser();
       const reloadOnChange = createFileReloader(server);
-      server.watcher.on("all", reloadOnChange);
-      keyboardShortcuts.start();
+      server.watcher.on("all", async (...args) => {
+        await reloadOnChange(args[0], args[1]);
+        keyboardShortcuts.start();
+      });
       keyboardShortcuts.printHelp({
         canReopenBrowser: !wxt.config.runnerConfig.config.disabled && !!runner.canOpen?.()
       });

package/dist/core/initialize.mjs

@@ -48,7 +48,7 @@ export async function initialize(options) {
   input.packageManager ??= options.packageManager;
   const isExists = await fs.pathExists(input.directory);
   if (isExists) {
-    const isEmpty = (await fs.readdir(input.directory)).length === 0;
+    const isEmpty = (await fs.readdir(input.directory)).filter((dir) => dir !== ".git").length === 0;
     if (!isEmpty) {
       consola.error(
         `The directory ${path.resolve(input.directory)} is not empty. Aborted.`

package/dist/core/keyboard-shortcuts.mjs

@@ -10,8 +10,7 @@ export function createKeyboardShortcuts(server) {
   };
   return {
     start() {
-      if (rl) return;
-      rl = readline.createInterface({
+      rl ??= readline.createInterface({
         input: process.stdin,
         terminal: false
         // Don't intercept ctrl+C, ctrl+Z, etc
@@ -19,8 +18,7 @@ export function createKeyboardShortcuts(server) {
       rl.on("line", handleInput);
     },
     stop() {
-      rl?.close();
-      rl = void 0;
+      rl?.removeListener("line", handleInput);
     },
     printHelp(flags) {
       if (flags.canReopenBrowser) {

package/dist/core/runners/web-ext.mjs

@@ -25,6 +25,7 @@ export function createWebExtRunner() {
         devtools: wxtUserConfig?.openDevtools,
         startUrl: wxtUserConfig?.startUrls,
         keepProfileChanges: wxtUserConfig?.keepProfileChanges,
+        chromiumPort: wxtUserConfig?.chromiumPort,
         ...wxt.config.browser === "firefox" ? {
           firefox: wxtUserConfig?.binaries?.firefox,
           firefoxProfile: wxtUserConfig?.firefoxProfile,

package/dist/core/utils/building/build-entrypoints.mjs

@@ -1,4 +1,4 @@
-import { getPublicFiles } from "../../utils/fs.mjs";
+import { getPublicFiles } from "../fs.mjs";
 import fs from "fs-extra";
 import { dirname, resolve } from "path";
 import pc from "picocolors";

package/dist/core/utils/minimatch-multiple.d.ts

@@ -0,0 +1,15 @@
+import { MinimatchOptions } from 'minimatch';
+/**
+ * Run [`minimatch`](https://npmjs.com/package/minimatch) against multiple
+ * patterns.
+ *
+ * Supports negated patterns, the order does not matter. If your `search` string
+ * matches any of the negative patterns, it will return `false`.
+ *
+ * @example
+ * ```ts
+ * minimatchMultiple('a.json', ['*.json', '!b.json']); // => true
+ * minimatchMultiple('b.json', ['*.json', '!b.json']); // => false
+ * ```
+ */
+export declare function minimatchMultiple(search: string, patterns: string[] | undefined, options?: MinimatchOptions): boolean;

package/dist/core/utils/minimatch-multiple.mjs

@@ -0,0 +1,17 @@
+import { minimatch } from "minimatch";
+export function minimatchMultiple(search, patterns, options) {
+  if (patterns == null) return false;
+  const negatePatterns = [];
+  const positivePatterns = [];
+  for (const pattern of patterns) {
+    if (pattern[0] === "!") negatePatterns.push(pattern.slice(1));
+    else positivePatterns.push(pattern);
+  }
+  if (negatePatterns.some(
+    (negatePattern) => minimatch(search, negatePattern, options)
+  ))
+    return false;
+  return positivePatterns.some(
+    (positivePattern) => minimatch(search, positivePattern, options)
+  );
+}