wxt 0.19.19 → 0.19.21

package/dist/client/content-scripts/ui/index.mjs

@@ -1,4 +1,9 @@
 import { browser } from "wxt/browser";
+import { waitElement } from "@1natsu/wait-element";
+import {
+  isExist as mountDetector,
+  isNotExist as removeDetector
+} from "@1natsu/wait-element/detectors";
 import { logger } from "../../../sandbox/utils/logger.mjs";
 import { createIsolatedElement } from "@webext-core/isolated-element";
 export * from "./types.mjs";
@@ -17,14 +22,20 @@ export function createIntegratedUi(ctx, options) {
     wrapper.remove();
     mounted = void 0;
   };
+  const mountFunctions = createMountFunctions(
+    {
+      mount,
+      remove
+    },
+    options
+  );
   ctx.onInvalidated(remove);
   return {
     get mounted() {
       return mounted;
     },
     wrapper,
-    mount,
-    remove
+    ...mountFunctions
   };
 }
 export function createIframeUi(ctx, options) {
@@ -44,6 +55,13 @@ export function createIframeUi(ctx, options) {
     wrapper.remove();
     mounted = void 0;
   };
+  const mountFunctions = createMountFunctions(
+    {
+      mount,
+      remove
+    },
+    options
+  );
   ctx.onInvalidated(remove);
   return {
     get mounted() {
@@ -51,8 +69,7 @@ export function createIframeUi(ctx, options) {
     },
     iframe,
     wrapper,
-    mount,
-    remove
+    ...mountFunctions
   };
 }
 export async function createShadowRootUi(ctx, options) {
@@ -87,13 +104,19 @@ export async function createShadowRootUi(ctx, options) {
       uiContainer.removeChild(uiContainer.lastChild);
     mounted = void 0;
   };
+  const mountFunctions = createMountFunctions(
+    {
+      mount,
+      remove
+    },
+    options
+  );
   ctx.onInvalidated(remove);
   return {
     shadow,
     shadowHost,
     uiContainer,
-    mount,
-    remove,
+    ...mountFunctions,
     get mounted() {
       return mounted;
     }
@@ -172,6 +195,81 @@ function mountUi(root, options) {
       break;
   }
 }
+function createMountFunctions(baseFunctions, options) {
+  let autoMountInstance = void 0;
+  const stopAutoMount = () => {
+    autoMountInstance?.stopAutoMount();
+    autoMountInstance = void 0;
+  };
+  const mount = () => {
+    baseFunctions.mount();
+  };
+  const unmount = baseFunctions.remove;
+  const remove = () => {
+    stopAutoMount();
+    baseFunctions.remove();
+  };
+  const autoMount = (autoMountOptions) => {
+    if (autoMountInstance) {
+      logger.warn("autoMount is already set.");
+    }
+    autoMountInstance = autoMountUi(
+      { mount, unmount, stopAutoMount },
+      {
+        ...options,
+        ...autoMountOptions
+      }
+    );
+  };
+  return {
+    mount,
+    remove,
+    autoMount
+  };
+}
+function autoMountUi(uiCallbacks, options) {
+  const abortController = new AbortController();
+  const EXPLICIT_STOP_REASON = "explicit_stop_auto_mount";
+  const _stopAutoMount = () => {
+    abortController.abort(EXPLICIT_STOP_REASON);
+    options.onStop?.();
+  };
+  let resolvedAnchor = typeof options.anchor === "function" ? options.anchor() : options.anchor;
+  if (resolvedAnchor instanceof Element) {
+    throw Error(
+      "autoMount and Element anchor option cannot be combined. Avoid passing `Element` directly or `() => Element` to the anchor."
+    );
+  }
+  async function observeElement(selector) {
+    let isAnchorExist = !!getAnchor(options);
+    while (!abortController.signal.aborted) {
+      try {
+        const changedAnchor = await waitElement(selector ?? "body", {
+          customMatcher: () => getAnchor(options) ?? null,
+          detector: isAnchorExist ? removeDetector : mountDetector,
+          signal: abortController.signal
+        });
+        isAnchorExist = !!changedAnchor;
+        if (isAnchorExist) {
+          uiCallbacks.mount();
+        } else {
+          uiCallbacks.unmount();
+          if (options.once) {
+            uiCallbacks.stopAutoMount();
+          }
+        }
+      } catch (error) {
+        if (abortController.signal.aborted && abortController.signal.reason === EXPLICIT_STOP_REASON) {
+          break;
+        } else {
+          throw error;
+        }
+      }
+    }
+  }
+  observeElement(resolvedAnchor);
+  return { stopAutoMount: _stopAutoMount };
+}
 async function loadCss() {
   const url = browser.runtime.getURL(
     `/content-scripts/${import.meta.env.ENTRYPOINT}.css`

package/dist/client/content-scripts/ui/types.d.ts

@@ -30,18 +30,7 @@ export interface ShadowRootContentScriptUi<TMounted> extends ContentScriptUi<TMo
      */
     shadow: ShadowRoot;
 }
-export interface ContentScriptUi<TMounted> {
-    /**
-     * Function that mounts or remounts the UI on the page.
-     */
-    mount: () => void;
-    /**
-     * Function that removes the UI from the webpage.
-     */
-    remove: () => void;
-    /**>
-     * Custom data returned from the `options.mount` function.
-     */
+export interface ContentScriptUi<TMounted> extends MountFunctions {
     mounted: TMounted | undefined;
 }
 export type ContentScriptUiOptions<TMounted> = ContentScriptPositioningOptions & ContentScriptAnchoredOptions & {
@@ -172,3 +161,36 @@ export interface ContentScriptAnchoredOptions {
      */
     append?: ContentScriptAppendMode | ((anchor: Element, ui: Element) => void);
 }
+export interface BaseMountFunctions {
+    /**
+     * Function that mounts or remounts the UI on the page.
+     */
+    mount: () => void;
+    /**
+     * Function that removes the UI from the webpage.
+     */
+    remove: () => void;
+}
+export interface MountFunctions extends BaseMountFunctions {
+    /**
+     * Call `ui.autoMount()` to automatically mount and remove the UI as the anchor is dynamically added/removed by the webpage.
+     */
+    autoMount: (options?: AutoMountOptions) => void;
+}
+export type AutoMountOptions = {
+    /**
+     * When true, only mount and unmount a UI once.
+     */
+    once?: boolean;
+    /**
+     * The callback triggered when `StopAutoMount` is called.
+     */
+    onStop?: () => void;
+};
+export type StopAutoMount = () => void;
+export interface AutoMount {
+    /**
+     * Stop watching the anchor element for changes, but keep the UI mounted.
+     */
+    stopAutoMount: StopAutoMount;
+}

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

@@ -9,6 +9,8 @@ import { importEntrypointFile } from "../../utils/building/index.mjs";
 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";
 export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
   const vite = await import("vite");
   const getBaseConfig = async (baseConfigOptions) => {
@@ -161,54 +163,96 @@ export async function createViteBuilder(wxtConfig, hooks, getWxtDevServer) {
       }
     };
   };
+  const createViteNodeImporter = async (paths) => {
+    const baseConfig = await getBaseConfig({
+      excludeAnalysisPlugin: true
+    });
+    baseConfig.optimizeDeps ??= {};
+    baseConfig.optimizeDeps.noDiscovery = true;
+    baseConfig.optimizeDeps.include = [];
+    const envConfig = {
+      plugins: paths.map(
+        (path) => wxtPlugins.removeEntrypointMainFunction(wxtConfig, path)
+      )
+    };
+    const config = vite.mergeConfig(baseConfig, envConfig);
+    const server = await vite.createServer(config);
+    await server.pluginContainer.buildStart({});
+    const node = new ViteNodeServer(
+      // @ts-ignore: Some weird type error...
+      server
+    );
+    installSourcemapsSupport({
+      getSourceMap: (source) => node.getSourceMap(source)
+    });
+    const runner = new ViteNodeRunner({
+      root: server.config.root,
+      base: server.config.base,
+      // when having the server and runner in a different context,
+      // you will need to handle the communication between them
+      // and pass to this function
+      fetchModule(id) {
+        return node.fetchModule(id);
+      },
+      resolveId(id, importer) {
+        return node.resolveId(id, importer);
+      }
+    });
+    return { runner, server };
+  };
+  const requireDefaultExport = (path, mod) => {
+    const relativePath = relative(wxtConfig.root, path);
+    if (mod?.default == null) {
+      const defineFn = relativePath.includes(".content") ? "defineContentScript" : relativePath.includes("background") ? "defineBackground" : "defineUnlistedScript";
+      throw Error(
+        `${relativePath}: Default export not found, did you forget to call "export default ${defineFn}(...)"?`
+      );
+    }
+  };
   return {
     name: "Vite",
     version: vite.version,
     async importEntrypoint(path) {
+      const env = createExtensionEnvironment();
       switch (wxtConfig.entrypointLoader) {
         default:
         case "jiti": {
-          return await importEntrypointFile(path);
+          return await env.run(() => importEntrypointFile(path));
         }
         case "vite-node": {
-          const baseConfig = await getBaseConfig({
-            excludeAnalysisPlugin: true
-          });
-          baseConfig.optimizeDeps ??= {};
-          baseConfig.optimizeDeps.noDiscovery = true;
-          baseConfig.optimizeDeps.include = [];
-          const envConfig = {
-            plugins: [wxtPlugins.removeEntrypointMainFunction(wxtConfig, path)]
-          };
-          const config = vite.mergeConfig(baseConfig, envConfig);
-          const server = await vite.createServer(config);
-          await server.pluginContainer.buildStart({});
-          const node = new ViteNodeServer(
-            // @ts-ignore: Some weird type error...
-            server
-          );
-          installSourcemapsSupport({
-            getSourceMap: (source) => node.getSourceMap(source)
-          });
-          const runner = new ViteNodeRunner({
-            root: server.config.root,
-            base: server.config.base,
-            // when having the server and runner in a different context,
-            // you will need to handle the communication between them
-            // and pass to this function
-            fetchModule(id) {
-              return node.fetchModule(id);
-            },
-            resolveId(id, importer) {
-              return node.resolveId(id, importer);
-            }
-          });
-          const res = await runner.executeFile(path);
+          const { runner, server } = await createViteNodeImporter([path]);
+          const res = await env.run(() => runner.executeFile(path));
           await server.close();
+          requireDefaultExport(path, res);
           return res.default;
         }
       }
     },
+    async importEntrypoints(paths) {
+      const env = createExtensionEnvironment();
+      switch (wxtConfig.entrypointLoader) {
+        default:
+        case "jiti": {
+          return await env.run(
+            () => Promise.all(paths.map(importEntrypointFile))
+          );
+        }
+        case "vite-node": {
+          const { runner, server } = await createViteNodeImporter(paths);
+          const res = await env.run(
+            () => Promise.all(
+              paths.map(async (path) => {
+                const mod = await runner.executeFile(path);
+                requireDefaultExport(path, mod);
+                return mod.default;
+              })
+            )
+          );
+          await server.close();
+          return res;
+        }
+      }
+    },
     async build(group) {
       let entryConfig;
       if (Array.isArray(group)) entryConfig = getMultiPageConfig(group);

package/dist/core/create-server.mjs

@@ -76,7 +76,9 @@ async function createServerInternal() {
       const reloadOnChange = createFileReloader(server);
       server.watcher.on("all", reloadOnChange);
       keyboardShortcuts.start();
-      keyboardShortcuts.printHelp();
+      keyboardShortcuts.printHelp({
+        canReopenBrowser: !wxt.config.runnerConfig.config.disabled && !!runner.canOpen?.()
+      });
     },
     async stop() {
       wasStopped = true;

package/dist/core/keyboard-shortcuts.d.ts

@@ -2,7 +2,9 @@ import { WxtDevServer } from '../types';
 export interface KeyboardShortcutWatcher {
     start(): void;
     stop(): void;
-    printHelp(): void;
+    printHelp(flags: {
+        canReopenBrowser: boolean;
+    }): void;
 }
 /**
  * Function that creates a keyboard shortcut handler for the extension.

package/dist/core/keyboard-shortcuts.mjs

@@ -28,8 +28,8 @@ export function createKeyboardShortcuts(server) {
       }
       isWatching = false;
     },
-    printHelp() {
-      if (!wxt.config.runnerConfig.config.disabled) {
+    printHelp(flags) {
+      if (flags.canReopenBrowser) {
         wxt.logger.info(
           `${pc.dim("Press")} ${pc.bold("o + enter")} ${pc.dim("to reopen the browser")}`
         );

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

@@ -4,6 +4,9 @@ import { wxt } from "../wxt.mjs";
 export function createWebExtRunner() {
   let runner;
   return {
+    canOpen() {
+      return true;
+    },
     async openBrowser() {
       const startTime = Date.now();
       if (wxt.config.browser === "firefox" && wxt.config.manifestVersion === 3) {

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

@@ -6,13 +6,15 @@ import JSON5 from "json5";
 import glob from "fast-glob";
 import {
   getEntrypointName,
+  isHtmlEntrypoint,
+  isJsEntrypoint,
   resolvePerBrowserOptions
 } from "../../utils/entrypoints.mjs";
 import { VIRTUAL_NOOP_BACKGROUND_MODULE_ID } from "../../utils/constants.mjs";
 import { CSS_EXTENSIONS_PATTERN } from "../../utils/paths.mjs";
 import pc from "picocolors";
 import { wxt } from "../../wxt.mjs";
-import { createExtensionEnvironment } from "../environments/index.mjs";
+import { camelCase } from "scule";
 export async function findEntrypoints() {
   await fs.mkdir(wxt.config.wxtDir, { recursive: true });
   try {
@@ -46,58 +48,60 @@ export async function findEntrypoints() {
   preventNoEntrypoints(entrypointInfos);
   preventDuplicateEntrypointNames(entrypointInfos);
   let hasBackground = false;
-  const env = createExtensionEnvironment();
-  const entrypointsWithoutSkipped = await env.run(
-    () => Promise.all(
-      entrypointInfos.map(async (info) => {
-        const { type } = info;
-        switch (type) {
-          case "popup":
-            return await getPopupEntrypoint(info);
-          case "sidepanel":
-            return await getSidepanelEntrypoint(info);
-          case "options":
-            return await getOptionsEntrypoint(info);
-          case "background":
-            hasBackground = true;
-            return await getBackgroundEntrypoint(info);
-          case "content-script":
-            return await getContentScriptEntrypoint(info);
-          case "unlisted-page":
-            return await getUnlistedPageEntrypoint(info);
-          case "unlisted-script":
-            return await getUnlistedScriptEntrypoint(info);
-          case "content-script-style":
-            return {
-              ...info,
-              type,
-              outputDir: resolve(wxt.config.outDir, CONTENT_SCRIPT_OUT_DIR),
-              options: {
-                include: void 0,
-                exclude: void 0
-              }
-            };
-          default:
-            return {
-              ...info,
-              type,
-              outputDir: wxt.config.outDir,
-              options: {
-                include: void 0,
-                exclude: void 0
-              }
-            };
-        }
-      })
-    )
+  const entrypointOptions = await importEntrypoints(entrypointInfos);
+  const entrypointsWithoutSkipped = await Promise.all(
+    entrypointInfos.map(async (info) => {
+      const { type } = info;
+      const options = entrypointOptions[info.inputPath] ?? {};
+      switch (type) {
+        case "popup":
+          return await getPopupEntrypoint(info, options);
+        case "sidepanel":
+          return await getSidepanelEntrypoint(info, options);
+        case "options":
+          return await getOptionsEntrypoint(info, options);
+        case "background":
+          hasBackground = true;
+          return await getBackgroundEntrypoint(info, options);
+        case "content-script":
+          return await getContentScriptEntrypoint(info, options);
+        case "unlisted-page":
+          return await getUnlistedPageEntrypoint(info, options);
+        case "unlisted-script":
+          return await getUnlistedScriptEntrypoint(info, options);
+        case "content-script-style":
+          return {
+            ...info,
+            type,
+            outputDir: resolve(wxt.config.outDir, CONTENT_SCRIPT_OUT_DIR),
+            options: {
+              include: options.include,
+              exclude: options.exclude
+            }
+          };
+        default:
+          return {
+            ...info,
+            type,
+            outputDir: wxt.config.outDir,
+            options: {
+              include: options.include,
+              exclude: options.exclude
+            }
+          };
+      }
+    })
   );
   if (wxt.config.command === "serve" && !hasBackground) {
     entrypointsWithoutSkipped.push(
-      await getBackgroundEntrypoint({
-        inputPath: VIRTUAL_NOOP_BACKGROUND_MODULE_ID,
-        name: "background",
-        type: "background"
-      })
+      await getBackgroundEntrypoint(
+        {
+          inputPath: VIRTUAL_NOOP_BACKGROUND_MODULE_ID,
+          name: "background",
+          type: "background"
+        },
+        {}
+      )
     );
   }
   const entrypoints = entrypointsWithoutSkipped.map((entry) => ({
@@ -119,6 +123,48 @@ export async function findEntrypoints() {
   await wxt.hooks.callHook("entrypoints:resolved", wxt, entrypoints);
   return entrypoints;
 }
+async function importEntrypoints(infos) {
+  const resMap = {};
+  const htmlInfos = infos.filter((info) => isHtmlEntrypoint(info));
+  const jsInfos = infos.filter((info) => isJsEntrypoint(info));
+  await Promise.all([
+    // HTML
+    ...htmlInfos.map(async (info) => {
+      const res = await importHtmlEntrypoint(info);
+      resMap[info.inputPath] = res;
+    }),
+    // JS
+    (async () => {
+      const res = await wxt.builder.importEntrypoints(
+        jsInfos.map((info) => info.inputPath)
+      );
+      res.forEach((res2, i) => {
+        resMap[jsInfos[i].inputPath] = res2;
+      });
+    })()
+    // CSS - never has options
+  ]);
+  return resMap;
+}
+async function importHtmlEntrypoint(info) {
+  const content = await fs.readFile(info.inputPath, "utf-8");
+  const { document } = parseHTML(content);
+  const metaTags = document.querySelectorAll("meta");
+  const res = {
+    title: document.querySelector("title")?.textContent || void 0
+  };
+  metaTags.forEach((tag) => {
+    const name = tag.name;
+    if (!name.startsWith("manifest.")) return;
+    const key = camelCase(name.slice(9));
+    try {
+      res[key] = JSON5.parse(tag.content);
+    } catch {
+      res[key] = tag.content;
+    }
+  });
+  return res;
+}
 function preventDuplicateEntrypointNames(files) {
   const namesToPaths = files.reduce(
     (map, { name, inputPath }) => {
@@ -154,181 +200,125 @@ function preventNoEntrypoints(files) {
     throw Error(`No entrypoints found in ${wxt.config.entrypointsDir}`);
   }
 }
-async function getPopupEntrypoint(info) {
-  const options = await getHtmlEntrypointOptions(
-    info,
+async function getPopupEntrypoint(info, options) {
+  const stictOptions = resolvePerBrowserOptions(
     {
-      browserStyle: "browser_style",
-      exclude: "exclude",
-      include: "include",
-      defaultIcon: "default_icon",
-      defaultTitle: "default_title",
-      mv2Key: "type"
+      browserStyle: options.browserStyle,
+      exclude: options.exclude,
+      include: options.include,
+      defaultIcon: options.defaultIcon,
+      defaultTitle: options.title,
+      mv2Key: options.type
     },
-    {
-      defaultTitle: (document) => document.querySelector("title")?.textContent || void 0
-    },
-    {
-      defaultTitle: (content) => content,
-      mv2Key: (content) => content === "page_action" ? "page_action" : "browser_action"
-    }
+    wxt.config.browser
   );
+  if (stictOptions.mv2Key && stictOptions.mv2Key !== "page_action")
+    stictOptions.mv2Key = "browser_action";
   return {
     type: "popup",
     name: "popup",
-    options: resolvePerBrowserOptions(options, wxt.config.browser),
+    options: stictOptions,
     inputPath: info.inputPath,
     outputDir: wxt.config.outDir
   };
 }
-async function getOptionsEntrypoint(info) {
-  const options = await getHtmlEntrypointOptions(
-    info,
-    {
-      browserStyle: "browser_style",
-      chromeStyle: "chrome_style",
-      exclude: "exclude",
-      include: "include",
-      openInTab: "open_in_tab"
-    }
-  );
+async function getOptionsEntrypoint(info, options) {
   return {
     type: "options",
     name: "options",
-    options: resolvePerBrowserOptions(options, wxt.config.browser),
+    options: resolvePerBrowserOptions(
+      {
+        browserStyle: options.browserStyle,
+        chromeStyle: options.chromeStyle,
+        exclude: options.exclude,
+        include: options.include,
+        openInTab: options.openInTab
+      },
+      wxt.config.browser
+    ),
     inputPath: info.inputPath,
     outputDir: wxt.config.outDir
   };
 }
-async function getUnlistedPageEntrypoint(info) {
-  const options = await getHtmlEntrypointOptions(info, {
-    exclude: "exclude",
-    include: "include"
-  });
+async function getUnlistedPageEntrypoint(info, options) {
   return {
     type: "unlisted-page",
     name: info.name,
     inputPath: info.inputPath,
     outputDir: wxt.config.outDir,
-    options
+    options: {
+      include: options.include,
+      exclude: options.exclude
+    }
   };
 }
-async function getUnlistedScriptEntrypoint({
-  inputPath,
-  name
-}) {
-  const defaultExport = await wxt.builder.importEntrypoint(inputPath);
-  if (defaultExport == null) {
-    throw Error(
-      `${name}: Default export not found, did you forget to call "export default defineUnlistedScript(...)"?`
-    );
-  }
-  const { main: _, ...options } = defaultExport;
+async function getUnlistedScriptEntrypoint({ inputPath, name }, options) {
   return {
     type: "unlisted-script",
     name,
     inputPath,
     outputDir: wxt.config.outDir,
-    options: resolvePerBrowserOptions(options, wxt.config.browser)
+    options: resolvePerBrowserOptions(
+      {
+        include: options.include,
+        exclude: options.exclude
+      },
+      wxt.config.browser
+    )
   };
 }
-async function getBackgroundEntrypoint({
-  inputPath,
-  name
-}) {
-  let options = {};
-  if (inputPath !== VIRTUAL_NOOP_BACKGROUND_MODULE_ID) {
-    const defaultExport = await wxt.builder.importEntrypoint(inputPath);
-    if (defaultExport == null) {
-      throw Error(
-        `${name}: Default export not found, did you forget to call "export default defineBackground(...)"?`
-      );
-    }
-    const { main: _, ...moduleOptions } = defaultExport;
-    options = moduleOptions;
-  }
+async function getBackgroundEntrypoint({ inputPath, name }, options) {
+  const strictOptions = resolvePerBrowserOptions(
+    {
+      include: options.include,
+      exclude: options.exclude,
+      persistent: options.persistent,
+      type: options.type
+    },
+    wxt.config.browser
+  );
   if (wxt.config.manifestVersion !== 3) {
-    delete options.type;
+    delete strictOptions.type;
   }
   return {
     type: "background",
     name,
     inputPath,
     outputDir: wxt.config.outDir,
-    options: resolvePerBrowserOptions(options, wxt.config.browser)
+    options: strictOptions
   };
 }
-async function getContentScriptEntrypoint({
-  inputPath,
-  name
-}) {
-  const defaultExport = await wxt.builder.importEntrypoint(inputPath);
-  if (defaultExport == null) {
-    throw Error(
-      `${name}: Default export not found, did you forget to call "export default defineContentScript(...)"?`
-    );
-  }
-  const { main: _, ...options } = defaultExport;
-  if (options == null) {
-    throw Error(
-      `${name}: Default export not found, did you forget to call "export default defineContentScript(...)"?`
-    );
-  }
+async function getContentScriptEntrypoint({ inputPath, name }, options) {
   return {
     type: "content-script",
     name,
     inputPath,
     outputDir: resolve(wxt.config.outDir, CONTENT_SCRIPT_OUT_DIR),
-    options: resolvePerBrowserOptions(options, wxt.config.browser)
+    options: resolvePerBrowserOptions(
+      options,
+      wxt.config.browser
+    )
   };
 }
-async function getSidepanelEntrypoint(info) {
-  const options = await getHtmlEntrypointOptions(
-    info,
-    {
-      browserStyle: "browser_style",
-      exclude: "exclude",
-      include: "include",
-      defaultIcon: "default_icon",
-      defaultTitle: "default_title",
-      openAtInstall: "open_at_install"
-    },
-    {
-      defaultTitle: (document) => document.querySelector("title")?.textContent || void 0
-    },
-    {
-      defaultTitle: (content) => content
-    }
-  );
+async function getSidepanelEntrypoint(info, options) {
   return {
     type: "sidepanel",
     name: info.name,
-    options: resolvePerBrowserOptions(options, wxt.config.browser),
+    options: resolvePerBrowserOptions(
+      {
+        browserStyle: options.browserStyle,
+        exclude: options.exclude,
+        include: options.include,
+        defaultIcon: options.defaultIcon,
+        defaultTitle: options.title,
+        openAtInstall: options.openAtInstall
+      },
+      wxt.config.browser
+    ),
     inputPath: info.inputPath,
     outputDir: wxt.config.outDir
   };
 }
-async function getHtmlEntrypointOptions(info, keyMap, queries, parsers) {
-  const content = await fs.readFile(info.inputPath, "utf-8");
-  const { document } = parseHTML(content);
-  const options = {};
-  const defaultQuery = (manifestKey) => document.querySelector(`meta[name='manifest.${manifestKey}']`)?.getAttribute("content");
-  Object.entries(keyMap).forEach(([_key, manifestKey]) => {
-    const key = _key;
-    const content2 = queries?.[key] ? queries[key](document, manifestKey) : defaultQuery(manifestKey);
-    if (content2) {
-      try {
-        options[key] = (parsers?.[key] ?? JSON5.parse)(content2);
-      } catch (err) {
-        wxt.logger.fatal(
-          `Failed to parse meta tag content. Usually this means you have invalid JSON5 content (content=${content2})`,
-          err
-        );
-      }
-    }
-  });
-  return options;
-}
 function isEntrypointSkipped(entry) {
   if (wxt.config.filterEntrypoints != null) {
     return !wxt.config.filterEntrypoints.has(entry.name);

package/dist/core/utils/entrypoints.d.ts

@@ -22,4 +22,10 @@ export declare function resolvePerBrowserOptions<T extends Record<string, any>,
  *
  * Naively just checking the file extension of the input path.
  */
-export declare function isHtmlEntrypoint(entrypoint: Entrypoint): boolean;
+export declare function isHtmlEntrypoint(entrypoint: Pick<Entrypoint, 'inputPath'>): boolean;
+/**
+ * Returns true when the entrypoint is a JS entrypoint.
+ *
+ * Naively just checking the file extension of the input path.
+ */
+export declare function isJsEntrypoint(entrypoint: Pick<Entrypoint, 'inputPath'>): boolean;

package/dist/core/utils/entrypoints.mjs

@@ -1,4 +1,4 @@
-import path, { relative, resolve } from "node:path";
+import path, { relative, resolve, extname } from "node:path";
 import { normalizePath } from "./paths.mjs";
 export function getEntrypointName(entrypointsDir, inputPath) {
   const relativePath = path.relative(entrypointsDir, inputPath);
@@ -27,5 +27,10 @@ export function resolvePerBrowserOptions(options, browser) {
   );
 }
 export function isHtmlEntrypoint(entrypoint) {
-  return entrypoint.inputPath.endsWith(".html");
+  const ext = extname(entrypoint.inputPath);
+  return [".html"].includes(ext);
+}
+export function isJsEntrypoint(entrypoint) {
+  const ext = extname(entrypoint.inputPath);
+  return [".js", ".jsx", ".ts", ".tsx"].includes(ext);
 }

package/dist/core/utils/manifest.d.ts

@@ -7,7 +7,7 @@ export declare function writeManifest(manifest: Manifest.WebExtensionManifest, o
 /**
  * Generates the manifest based on the config and entrypoints.
  */
-export declare function generateManifest(entrypoints: Entrypoint[], buildOutput: Omit<BuildOutput, 'manifest'>): Promise<{
+export declare function generateManifest(allEntrypoints: Entrypoint[], buildOutput: Omit<BuildOutput, 'manifest'>): Promise<{
     manifest: Manifest.WebExtensionManifest;
     warnings: any[][];
 }>;

package/dist/core/utils/manifest.mjs

@@ -20,7 +20,8 @@ export async function writeManifest(manifest, output) {
     fileName: "manifest.json"
   });
 }
-export async function generateManifest(entrypoints, buildOutput) {
+export async function generateManifest(allEntrypoints, buildOutput) {
+  const entrypoints = allEntrypoints.filter((entry) => !entry.skipped);
   const warnings = [];
   const pkg = await getPackageJson();
   let versionName = wxt.config.manifest.version_name ?? wxt.config.manifest.version ?? pkg?.version;

package/dist/core/utils/testing/fake-objects.d.ts

@@ -1,12 +1,12 @@
 import type { Manifest } from 'wxt/browser';
-import { ResolvedConfig, WxtDevServer, BackgroundEntrypoint, ContentScriptEntrypoint, GenericEntrypoint, OptionsEntrypoint, PopupEntrypoint, OutputChunk, OutputFile, OutputAsset, BuildOutput, BuildStepOutput, UserManifest, Wxt, SidepanelEntrypoint } from '../../../types';
+import { ResolvedConfig, WxtDevServer, BackgroundEntrypoint, ContentScriptEntrypoint, GenericEntrypoint, OptionsEntrypoint, PopupEntrypoint, OutputChunk, OutputFile, OutputAsset, BuildOutput, BuildStepOutput, UserManifest, Wxt, SidepanelEntrypoint, BaseEntrypoint } from '../../../types';
 type DeepPartial<T> = T extends object ? {
     [P in keyof T]?: DeepPartial<T[P]>;
 } : T;
 export declare function fakeFileName(): string;
 export declare function fakeFile(root?: string): string;
 export declare function fakeDir(root?: string): string;
-export declare const fakeEntrypoint: () => GenericEntrypoint | BackgroundEntrypoint | ContentScriptEntrypoint | PopupEntrypoint | OptionsEntrypoint;
+export declare const fakeEntrypoint: (options?: DeepPartial<BaseEntrypoint>) => GenericEntrypoint | BackgroundEntrypoint | ContentScriptEntrypoint | PopupEntrypoint | OptionsEntrypoint;
 export declare const fakeContentScriptEntrypoint: (overrides?: {
     type?: "content-script" | undefined;
     options?: {
@@ -8104,6 +8104,7 @@ export declare const fakeWxt: (overrides?: {
         name?: string | undefined;
         version?: string | undefined;
         importEntrypoint?: {} | undefined;
+        importEntrypoints?: {} | undefined;
         build?: {} | undefined;
         createServer?: {} | undefined;
     } | undefined;

package/dist/core/utils/testing/fake-objects.mjs

@@ -17,14 +17,14 @@ export function fakeFile(root = process.cwd()) {
 export function fakeDir(root = process.cwd()) {
   return resolve(root, faker.string.alphanumeric());
 }
-export const fakeEntrypoint = () => faker.helpers.arrayElement([
+export const fakeEntrypoint = (options) => faker.helpers.arrayElement([
   fakePopupEntrypoint,
   fakeGenericEntrypoint,
   fakeOptionsEntrypoint,
   fakeBackgroundEntrypoint,
   fakeContentScriptEntrypoint,
   fakeUnlistedScriptEntrypoint
-])();
+])(options);
 export const fakeContentScriptEntrypoint = fakeObjectCreator(() => ({
   type: "content-script",
   inputPath: fakeFile("src"),

package/dist/types.d.ts

@@ -927,9 +927,13 @@ export interface WxtBuilder {
      */
     version: string;
     /**
-     * Import the entrypoint file, returning the default export containing the options.
+     * Import a JS entrypoint file, returning the default export containing the options.
      */
     importEntrypoint<T>(path: string): Promise<T>;
+    /**
+     * Import a list of JS entrypoint files, returning their options.
+     */
+    importEntrypoints(paths: string[]): Promise<Record<string, unknown>[]>;
     /**
      * Build a single entrypoint group. This is effectively one of the multiple "steps" during the
      * build process.
@@ -1288,6 +1292,8 @@ export interface FsCache {
 export interface ExtensionRunner {
     openBrowser(): Promise<void>;
     closeBrowser(): Promise<void>;
+    /** Whether or not this runner actually opens the browser. */
+    canOpen?(): boolean;
 }
 export type EslintGlobalsPropValue = boolean | 'readonly' | 'readable' | 'writable' | 'writeable';
 export interface Eslintrc {

package/dist/version.mjs

@@ -1 +1 @@
-export const version = "0.19.19";
+export const version = "0.19.21";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wxt",
   "type": "module",
-  "version": "0.19.19",
+  "version": "0.19.21",
   "description": "Next gen framework for developing web extensions",
   "repository": {
     "type": "git",
@@ -70,6 +70,7 @@
     }
   },
   "dependencies": {
+    "@1natsu/wait-element": "^4.1.2",
     "@aklinker1/rollup-plugin-visualizer": "5.12.0",
     "@types/chrome": "^0.0.280",
     "@types/webextension-polyfill": "^0.12.1",