fix: Inline WXT modules inside WxtVitest plugin

src/core/create-server.ts

@@ -6,7 +6,7 @@ import {
   WxtDevServer,
 } from '~/types';
 import * as vite from 'vite';
-import { Scripting } from 'webextension-polyfill';
+import type { Scripting } from 'webextension-polyfill';
 import {
   getEntrypointBundlePath,
   getEntrypointOutputFile,

src/core/utils/building/rebuild.ts

@@ -1,4 +1,4 @@
-import { Manifest } from 'webextension-polyfill';
+import type { Manifest } from 'webextension-polyfill';
 import { BuildOutput, EntrypointGroup, InternalConfig } from '~/types';
 import { findEntrypoints } from './find-entrypoints';
 import { generateTypesDir } from './generate-wxt-dir';

src/core/utils/content-scripts.ts

@@ -1,4 +1,4 @@
-import { Manifest } from 'webextension-polyfill';
+import type { Manifest } from 'webextension-polyfill';
 import { ContentScriptEntrypoint, InternalConfig } from '~/types';
 import { resolvePerBrowserOption } from './entrypoints';
 

src/core/utils/manifest.ts

@@ -1,4 +1,4 @@
-import { Manifest } from 'webextension-polyfill';
+import type { Manifest } from 'webextension-polyfill';
 import {
   Entrypoint,
   BackgroundEntrypoint,

src/core/utils/testing/fake-objects.ts

@@ -5,7 +5,7 @@ import { resolve } from 'path';
 import { faker } from '@faker-js/faker';
 import merge from 'lodash.merge';
 import { Rollup } from 'vite';
-import { Manifest } from 'webextension-polyfill';
+import type { Manifest } from 'webextension-polyfill';
 import {
   FsCache,
   InternalConfig,

src/core/vite-plugins/index.ts

@@ -10,3 +10,4 @@ export * from './cssEntrypoints';
 export * from './bundleAnalysis';
 export * from './globals';
 export * from './webextensionPolyfillAlias';
+export * from './webextensionPolyfillInlineDeps';

src/core/vite-plugins/webextensionPolyfillInlineDeps.ts

@@ -0,0 +1,24 @@
+import * as vite from 'vite';
+
+/**
+ * Add all deps that import `webextension-polyfill` to `test.server.deps.inline`.
+ *
+ * TODO: Auto-detect non-wxt dependencies via `npm list`.
+ */
+export function webextensionPolyfillInlineDeps(): vite.PluginOption {
+  return {
+    name: 'wxt:testing-inline-deps',
+    config() {
+      const wxtModules = ['wxt/browser', 'wxt/client'];
+      return {
+        test: {
+          server: {
+            deps: {
+              inline: [...wxtModules],
+            },
+          },
+        },
+      };
+    },
+  };
+}

src/testing/wxt-vitest-plugin.ts

@@ -5,6 +5,7 @@ import {
   tsconfigPaths,
   globals,
   webextensionPolyfillAlias,
+  webextensionPolyfillInlineDeps,
 } from '../core/vite-plugins';
 import { getInternalConfig } from '~/core/utils/building';
 import { InlineConfig } from '../types';
@@ -27,6 +28,7 @@ import { InlineConfig } from '../types';
 export function WxtVitest(inlineConfig?: InlineConfig): vite.PluginOption {
   return getInternalConfig(inlineConfig ?? {}, 'serve').then((config) => [
     webextensionPolyfillAlias(config),
+    webextensionPolyfillInlineDeps(),
     unimport(config),
     globals(config),
     download(config),