Compare commits

..

10 Commits

Author SHA1 Message Date
GitHub Actions a3d409f250 chore(release): v0.8.2 2023-10-17 20:39:45 +00:00
Aaron b6758ca9fa fix(firefox): Stop extending AbortController to fix crash in content scripts (#176) 2023-10-17 15:33:55 -05:00
Aaron 2672308946 chore: Improve output consistency (#175) 2023-10-16 11:00:33 -05:00
GitHub Actions 7ac171ed3b chore(release): v0.8.1 2023-10-16 14:33:06 +00:00
Aaron Klinker 6a93f20bb3 fix: Output action.browser_style correctly 2023-10-16 09:20:40 -05:00
Aaron Klinker 921af6a5a1 Rename jobs 2023-10-15 15:08:34 -05:00
Aaron Klinker 21ebeacd20 chore(deps): Revert node 20 upgrade due to OOM errors in CI 2023-10-15 14:51:36 -05:00
Aaron 527600031f docs: Generate full API docs with typedoc (#174) 2023-10-14 22:03:23 -05:00
Aaron Klinker 91a804c492 Update changelog 2023-10-14 10:40:36 -05:00
Aaron Klinker 54f3785063 Upgrade templates to use v0.8 2023-10-14 10:40:10 -05:00
37 changed files with 305 additions and 387 deletions
+1 -1
View File
@@ -24,7 +24,7 @@ jobs:
- name: Setup NodeJS
uses: actions/setup-node@v3
with:
node-version: 20
node-version: 18
cache: 'pnpm'
- name: Install dependencies
+29 -9
View File
@@ -7,13 +7,9 @@ on:
- main
jobs:
wxt:
name: WXT
strategy:
fail-fast: false
matrix:
os: [ubuntu-latest, windows-latest]
runs-on: ${{ matrix.os }}
checks:
name: Checks
runs-on: ubuntu-22.04
steps:
- name: Checkout
uses: actions/checkout@v3
@@ -26,7 +22,7 @@ jobs:
- name: Setup NodeJS
uses: actions/setup-node@v3
with:
node-version: 20
node-version: 18
cache: 'pnpm'
- name: Install dependencies
@@ -56,6 +52,30 @@ jobs:
env:
CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
windows-tests:
name: Windows Tests
runs-on: windows-latest
steps:
- name: Checkout
uses: actions/checkout@v3
- name: Setup PNPM
uses: pnpm/action-setup@v2
with:
version: 8
- name: Setup NodeJS
uses: actions/setup-node@v3
with:
node-version: 18
cache: 'pnpm'
- name: Install dependencies
run: pnpm install
- name: Tests
run: pnpm test:coverage --reporter=default --reporter=hanging-process
project-templates:
name: Project Templates
runs-on: ubuntu-22.04
@@ -71,7 +91,7 @@ jobs:
- name: Setup NodeJS
uses: actions/setup-node@v3
with:
node-version: 20
node-version: 18
cache: 'pnpm'
- name: Install dependencies
+1 -2
View File
@@ -17,7 +17,6 @@ web-ext.config.ts
templates/*/pnpm-lock.yaml
templates/*/yarn.lock
templates/*/package-lock.json
docs/api/config.md
docs/api/cli.md
docs/api
stats.html
.tool-versions
+25 -1
View File
@@ -1,5 +1,29 @@
# Changelog
## v0.8.2
[compare changes](https://github.com/wxt-dev/wxt/compare/v0.8.1...v0.8.2)
### 🩹 Fixes
- **firefox:** Stop extending `AbortController` to fix crash in content scripts ([#176](https://github.com/wxt-dev/wxt/pull/176))
### 🏡 Chore
- Improve output consistency ([#175](https://github.com/wxt-dev/wxt/pull/175))
## v0.8.1
[compare changes](https://github.com/wxt-dev/wxt/compare/v0.8.0...v0.8.1)
### 🩹 Fixes
- Output `action.browser_style` correctly ([6a93f20](https://github.com/wxt-dev/wxt/commit/6a93f20))
### 📖 Documentation
- Generate full API docs with typedoc ([#174](https://github.com/wxt-dev/wxt/pull/174))
## v0.8.0
[compare changes](https://github.com/wxt-dev/wxt/compare/v0.7.5...v0.8.0)
@@ -18,7 +42,7 @@
#### ⚠️ Breaking Changes
- ⚠️ Use `defineUnlistedScript` to define unlisted scripts ([#167](https://github.com/wxt-dev/wxt/pull/167))
- ⚠️ Unlisted scripts must now `export default defineUnlistedScript(...)` ([#167](https://github.com/wxt-dev/wxt/pull/167))
- ⚠️ Rename `BackgroundScriptDefintition` to `BackgroundDefinition` ([446f265](https://github.com/wxt-dev/wxt/commit/446f265))
### ❤️ Contributors
+20 -8
View File
@@ -1,6 +1,19 @@
import { defineConfig } from 'vitepress';
import { generateConfigDocs } from './plugins/generate-config-docs';
import { DefaultTheme, defineConfig } from 'vitepress';
import { generateCliDocs } from './plugins/generate-cli-docs';
import typedocSidebar from '../api/typedoc-sidebar.json';
const filteredTypedocSidebar = typedocSidebar.filter(
(item) => item.text !== 'API',
);
// Typedoc's markdown theme adds collapse: true to all our items, event ones without any children,
// so they need to be removed.
function removeCollapsedWithNoItems(items: DefaultTheme.SidebarItem[]) {
for (const item of items) {
if (item.items) removeCollapsedWithNoItems(item.items);
else delete item.collapsed;
}
}
removeCollapsedWithNoItems(filteredTypedocSidebar);
const title = 'Next-gen Web Extension Framework';
const titleSuffix = ' WXT';
@@ -18,7 +31,7 @@ export default defineConfig({
description,
vite: {
clearScreen: false,
plugins: [generateConfigDocs(), generateCliDocs()],
plugins: [generateCliDocs()],
},
lastUpdated: true,
sitemap: {
@@ -120,11 +133,10 @@ export default defineConfig({
{
items: [
{ text: 'CLI', link: '/api/cli.md' },
{ text: 'Config', link: '/api/config.md' },
{ text: 'wxt', link: '/api/wxt.md' },
{ text: 'wxt/browser', link: '/api/wxt-browser.md' },
{ text: 'wxt/client', link: '/api/wxt-client.md' },
{ text: 'wxt/sandbox', link: '/api/wxt-sandbox.md' },
{
text: 'Modules',
items: filteredTypedocSidebar,
},
],
},
],
+1 -1
View File
@@ -8,7 +8,7 @@ let hasGenerated = false;
const cliDir = resolve('src/cli/commands');
const cliDirGlob = resolve(cliDir, '**');
const cliTemplatePath = resolve('docs/api/cli.tpl.md');
const cliTemplatePath = resolve('docs/.vitepress/plugins/cli.tpl.md');
const cliPath = resolve('docs/api/cli.md');
const PREFACE = `<!--
@@ -1,145 +0,0 @@
import { relative, resolve } from 'node:path';
import { Project, ts, Type, Node, JSDocableNode } from 'ts-morph';
import { readFileSync, writeFileSync } from 'node:fs';
import { format } from 'prettier';
import consola from 'consola';
let hasGenerated = false;
const externalTypesPath = resolve('src/core/types/external.ts');
const configTemplatePath = resolve('docs/api/config.tpl.md');
const configPath = resolve('docs/api/config.md');
const PREFACE = `<!--
DO NOT EDIT
Generated by \`wxt/docs/.vitepress/plugins/generate-config-docs.ts\`
To make changes to the config reference, update the JSDoc in \`src/core/types/external.ts\`.
-->`;
/**
* Custom property paths that should not be recursively inspected. Usually 3rd party types.
*/
const LEAF_PATHS = ['imports', 'vite', 'server'];
/**
* Override any types that resolve to `import(...)` instead of their type names when calling
* `type.getText()`.
*
* This also stops any further type inspection for objects, meaning the object will be documented,
* not it's properties.
*/
const CUSTOM_TYPES = {
manifest:
'Manifest | Promise<Manifest> | () => Manifest | () => Promise<Manifest>',
imports: "false | Partial<import('unimport').UnimportOptions>",
vite: "Omit<import('vite').UserConfig, 'root' | 'configFile' | 'mode'>",
};
export function generateConfigDocs() {
writeFileSync(configPath, '');
const generateDocs = async () => {
consola.info(`Generating ${relative(process.cwd(), configPath)}`);
try {
const project = new Project({
tsConfigFilePath: resolve('tsconfig.json'),
});
// Load file containing "UserConfig"
const externalTypesFile = project.addSourceFileAtPath(externalTypesPath);
project.resolveSourceFileDependencies();
const inlineConfigInterface =
externalTypesFile.getInterfaceOrThrow('InlineConfig');
const getDocsFor = (path: string[], node: Node<ts.Node>): string[] => {
const pathStr = path.join('.');
let type: Type<ts.Type>;
if (node.isKind(ts.SyntaxKind.InterfaceDeclaration)) {
type = node.getType();
} else if (node.isKind(ts.SyntaxKind.PropertySignature)) {
type = node.getTypeNodeOrThrow()?.getType();
} else if (node.isKind(ts.SyntaxKind.MethodSignature)) {
type = node.getType();
} else {
throw Error('Unsupported type node: ' + node.getKindName());
}
if (type.isObject() && !type.isArray() && !CUSTOM_TYPES[pathStr]) {
return type.getProperties().flatMap((property) => {
const childPath = [...path, property.getName()];
return getDocsFor(childPath, property.getDeclarations()[0]);
});
}
if ('getJsDocs' in node) {
const lines: string[] = [];
const docs = (node as unknown as JSDocableNode).getJsDocs();
let typeText: string;
if (CUSTOM_TYPES[pathStr]) {
typeText = CUSTOM_TYPES[pathStr];
} else if (type.isUnion() && !type.isBoolean()) {
typeText = type
.getUnionTypes()
.map((type) => type.getText())
.join(' | ');
} else {
typeText = type.getText();
}
const defaultValue = docs
.flatMap((doc) => doc.getTags())
.find((tag) => tag.getTagName() === 'default')
?.getCommentText();
lines.push(
'',
`## ${pathStr}`,
'',
`- **Type**: \`${typeText}\``,
`- **Default**: \`${defaultValue}\``,
...docs.flatMap((doc) => doc.getDescription()),
);
return lines;
}
return [];
};
const lines = getDocsFor([], inlineConfigInterface);
const text = await format(
PREFACE +
'\n\n' +
readFileSync(configTemplatePath, 'utf-8').replace(
'{{ DOCS }}',
lines.join('\n'),
),
{ parser: 'markdown' },
);
writeFileSync(configPath, text);
consola.success(`Generated ${relative(process.cwd(), configPath)}`);
} catch (err) {
consola.fail(`Failed to generate ${relative(process.cwd(), configPath)}`);
consola.error(err.message);
}
};
return {
name: 'docs:generate-config-docs',
async config() {
if (!hasGenerated) {
hasGenerated = true;
await generateDocs();
}
},
configureServer(server: any) {
server.watcher.add(externalTypesPath);
},
async handleHotUpdate(ctx: { file: string }) {
if ([externalTypesPath, configTemplatePath].includes(ctx.file)) {
await generateDocs();
}
},
};
}
-5
View File
@@ -1,5 +0,0 @@
# Config Reference
All the options you can use in your `wxt.config.ts` file.
{{ DOCS }}
-10
View File
@@ -1,10 +0,0 @@
# `wxt/browser` Reference
:::warning 🚧&ensp;Under construction
This documentation does not exist yet. All APIs are documented with JSDoc, so for now, you can view the documentation in your editor.
```ts
import { browser } from 'wxt/browser';
```
:::
-14
View File
@@ -1,14 +0,0 @@
# `wxt/client` Reference
:::warning 🚧&ensp;Under construction
This documentation does not exist yet. All APIs are documented with JSDoc, so for now, you can view the documentation in your editor.
```ts
import {
createContentScriptUi,
defineBackground,
defineContentScript,
} from 'wxt/client';
```
:::
-12
View File
@@ -1,12 +0,0 @@
# `wxt/sandbox` Reference
The `wxt/sandbox` module contains exports that do not use the `browser` global (ie: a "sandboxed" environment).
:::warning 🚧&ensp;Under construction
This documentation does not exist yet. All APIs are documented with JSDoc, so for now, you can view the documentation in your editor.
```ts
import { defineUnlistedScript } from 'wxt/sandbox';
```
:::
-17
View File
@@ -1,17 +0,0 @@
# `wxt` Reference
:::warning 🚧&ensp;Under construction
This documentation does not exist yet. All APIs are documented with JSDoc, so for now, you can view the documentation in your editor.
```ts
import {
build,
clean,
createServer,
defineConfig,
defineRunnerConfig,
version,
} from 'wxt';
```
:::
+1 -1
View File
@@ -5,7 +5,7 @@ WXT can build CSS entrypoints individually. CSS entrypoints are always unlisted.
See [Content Script CSS](/entrypoints/content-scripts#css) documentation for the recomended approach to include CSS with a content script.
:::info
If the recommended approach doesn't work for your use case, you can use any of the filename patterns below to build the styles separate from the JS and use the [`transformManifest` hook](/api/config#transformmanifest) to manually add your CSS file to the manifest.
If the recommended approach doesn't work for your use case, you can use any of the filename patterns below to build the styles separate from the JS and use the [`transformManifest` hook](/api/wxt/interfaces/InlineConfig#transformmanifest) to manually add your CSS file to the manifest.
:::
## Filenames
+6 -6
View File
@@ -10,13 +10,13 @@ To setup your test environment for auto-imports, see [Testing](/guide/testing).
Some WXT APIs can be used without importing them:
- [`browser`](/api/wxt-browser#browser) from `wxt/browser`, a small wrapper around `webextension-polyfill`
- [`defineContentScript`](/api/wxt-client#defiencontentscript) from `wxt/client`
- [`defineBackground`](/api/wxt-client#definebackground) from `wxt/client`
- [`createContentScriptUi`](/api/wxt-client#createcontentscriptui) from `wxt/client`
- [`defineUnlistedScript`](/api/wxt-sandbox#defineunlistedscript) from `wxt/sandbox`
- [`browser`](/api/wxt/browser/variables/browser) from `wxt/browser`, a small wrapper around `webextension-polyfill`
- [`defineContentScript`](/api/wxt/client/functions/defineContentScript) from `wxt/client`
- [`defineBackground`](/api/wxt/client/functions/defineBackground) from `wxt/client`
- [`createContentScriptUi`](/api/wxt/client/functions/createContentScriptUi) from `wxt/client`
- [`defineUnlistedScript`](/api/wxt/sandbox/functions/defineUnlistedScript) from `wxt/sandbox`
And more. All [`wxt/client`](/api/wxt-client) APIs can be used without imports.
And more. All `wxt/*` APIs can be used without imports.
## Project Auto-imports
+1 -1
View File
@@ -15,7 +15,7 @@ export default defineConfig({
```
:::info
See the [Config reference](/api/config) for a full list of options.
See the [Config reference](/api/wxt/interfaces/InlineConfig) for a full list of options.
:::
## Directory Config
+1 -1
View File
@@ -15,7 +15,7 @@ WXT's main goal is providing the best DX it possibly can. When running your exte
## Configure Browser Startup
WXT uses [`web-ext` by Mozilla](https://github.com/mozilla/web-ext) to automatically open a browser with the extension installed. You can configure the runner's behavior via the [`runner`](/api/config#runner.disabled) option, or in a separate gitignored file, `web-ext.config.ts`.
WXT uses [`web-ext` by Mozilla](https://github.com/mozilla/web-ext) to automatically open a browser with the extension installed. You can configure the runner's behavior via the [`runner`](/api/wxt/interfaces/InlineConfig#runner) option, or in a separate gitignored file, `web-ext.config.ts`.
:::code-group
+2 -1
View File
@@ -2,7 +2,8 @@
# https://docs.netlify.com/routing/redirects/
# Old URLs -> New URLs
/config.html /api/config.html
/config.html /api/wxt/interfaces/InlineConfig.html
/api/config.html /api/wxt/interfaces/InlineConfig.html
/entrypoints /entrypoints/background.html
/get-started/assets.html /guide/assets.html
/get-started/build-targets.html /guide/multiple-browsers.html
+15
View File
@@ -0,0 +1,15 @@
{
"entryPoints": [
"../src",
"../src/client",
"../src/client/browser.ts",
"../src/client/sandbox"
],
"plugin": ["typedoc-plugin-markdown", "typedoc-vitepress-theme"],
"out": "./api",
"githubPages": false,
"excludePrivate": true,
"excludeProtected": true,
"excludeInternal": true,
"readme": "none"
}
+8 -5
View File
@@ -1,7 +1,7 @@
{
"name": "wxt",
"type": "module",
"version": "0.8.0",
"version": "0.8.2",
"description": "Next gen framework for developing web extensions",
"engines": {
"node": ">=18",
@@ -63,9 +63,10 @@
"test:coverage": "vitest run --coverage.enabled --coverage.exclude=e2e --coverage.exclude=src/testing",
"prepare": "simple-git-hooks",
"prepublish": "pnpm -s build",
"docs:dev": "vitepress dev docs",
"docs:build": "vitepress build docs",
"docs:preview": "vitepress preview docs",
"docs:gen": "typedoc --options docs/typedoc.json",
"docs:dev": "pnpm -s docs:gen && vitepress dev docs",
"docs:build": "pnpm -s docs:gen && vitepress build docs",
"docs:preview": "pnpm -s docs:gen && vitepress preview docs",
"sync-releases": "pnpx changelogen@latest gh release"
},
"dependencies": {
@@ -113,9 +114,11 @@
"npm-run-all": "^4.1.5",
"prettier": "^3.0.1",
"simple-git-hooks": "^2.9.0",
"ts-morph": "^20.0.0",
"tsup": "^7.1.0",
"tsx": "^3.12.7",
"typedoc": "^0.25.2",
"typedoc-plugin-markdown": "4.0.0-next.23",
"typedoc-vitepress-theme": "1.0.0-next.3",
"typescript": "^5.2.2",
"vitepress": "1.0.0-rc.10",
"vitest": "^0.34.6",
+49 -41
View File
@@ -135,15 +135,21 @@ importers:
simple-git-hooks:
specifier: ^2.9.0
version: 2.9.0
ts-morph:
specifier: ^20.0.0
version: 20.0.0
tsup:
specifier: ^7.1.0
version: 7.2.0(typescript@5.2.2)
tsx:
specifier: ^3.12.7
version: 3.12.8
typedoc:
specifier: ^0.25.2
version: 0.25.2(typescript@5.2.2)
typedoc-plugin-markdown:
specifier: 4.0.0-next.23
version: 4.0.0-next.23(typedoc@0.25.2)
typedoc-vitepress-theme:
specifier: 1.0.0-next.3
version: 1.0.0-next.3(typedoc-plugin-markdown@4.0.0-next.23)
typescript:
specifier: ^5.2.2
version: 5.2.2
@@ -978,15 +984,6 @@ packages:
engines: {node: '>= 10'}
dev: true
/@ts-morph/common@0.21.0:
resolution: {integrity: sha512-ES110Mmne5Vi4ypUKrtVQfXFDtCsDXiUiGxF6ILVlE90dDD4fdpC1LSjydl/ml7xJWKSDZwUYD2zkOePMSrPBA==}
dependencies:
fast-glob: 3.3.1
minimatch: 7.4.6
mkdirp: 2.1.6
path-browserify: 1.0.1
dev: true
/@types/chai-subset@1.3.3:
resolution: {integrity: sha512-frBecisrNGz+F4T6bcc+NLeolfiojh5FxW2klu669+8BARtyQv2C/GkNW6FUodVe4BroGMP/wER/YDGc7rEllw==}
dependencies:
@@ -1719,10 +1716,6 @@ packages:
wrap-ansi: 7.0.0
dev: false
/code-block-writer@12.0.0:
resolution: {integrity: sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w==}
dev: true
/color-convert@1.9.3:
resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
dependencies:
@@ -3232,6 +3225,10 @@ packages:
dependencies:
yallist: 4.0.0
/lunr@2.3.9:
resolution: {integrity: sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow==}
dev: true
/magic-string@0.30.2:
resolution: {integrity: sha512-lNZdu7pewtq/ZvWUp9Wpf/x7WzMTsR26TWV03BRZrXFsv+BI6dy8RAiKgm1uM/kyR0rCfUcqvOlXKG66KhIGug==}
engines: {node: '>=12'}
@@ -3260,6 +3257,12 @@ packages:
resolution: {integrity: sha512-1I+1qpDt4idfgLQG+BNWmrqku+7/2bi5nLf4YwF8y8zXvmfiTBY3PV3ZibfrjBueCByROpuBjLLFCajqkgYoLQ==}
dev: true
/marked@4.3.0:
resolution: {integrity: sha512-PRsaiG84bK+AMvxziE/lCFss8juXjNaWzVbN5tXAm4XjeaS9NAHhop+PjQxz2A9h8Q4M/xGmzP8vqNwy6JeK0A==}
engines: {node: '>= 12'}
hasBin: true
dev: true
/marky@1.2.5:
resolution: {integrity: sha512-q9JtQJKjpsVxCRVgQ+WapguSbKC3SQ5HEzFGPAJMStgh3QjCawp00UKv3MTTAArTmGmmPUvllHZoNbZ3gs0I+Q==}
dev: false
@@ -3320,19 +3323,11 @@ packages:
dependencies:
brace-expansion: 1.1.11
/minimatch@7.4.6:
resolution: {integrity: sha512-sBz8G/YjVniEz6lKPNpKxXwazJe4c19fEfV2GDMX6AjFz+MX9uDWIZW8XreVhkFW3fkIdTv/gxWr/Kks5FFAVw==}
engines: {node: '>=10'}
dependencies:
brace-expansion: 2.0.1
dev: true
/minimatch@9.0.3:
resolution: {integrity: sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==}
engines: {node: '>=16 || 14 >=14.17'}
dependencies:
brace-expansion: 2.0.1
dev: false
/minimist@1.2.8:
resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
@@ -3376,12 +3371,6 @@ packages:
hasBin: true
dev: false
/mkdirp@2.1.6:
resolution: {integrity: sha512-+hEnITedc8LAtIP9u3HJDFIdcLV2vXP33sqLLIzkv1Db1zO/1OxbvYf0Y1OC/S/Qo5dxHXepofhmxL02PsKe+A==}
engines: {node: '>=10'}
hasBin: true
dev: true
/mlly@1.4.0:
resolution: {integrity: sha512-ua8PAThnTwpprIaU47EPeZ/bPUVp2QYBbWMphUQpVdBI3Lgqzm5KZQ45Agm3YJedHXaIHl6pBGabaLSUPPSptg==}
dependencies:
@@ -3668,10 +3657,6 @@ packages:
entities: 4.5.0
dev: true
/path-browserify@1.0.1:
resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==}
dev: true
/path-is-absolute@1.0.1:
resolution: {integrity: sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==}
engines: {node: '>=0.10.0'}
@@ -4561,13 +4546,6 @@ packages:
resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
dev: true
/ts-morph@20.0.0:
resolution: {integrity: sha512-JVmEJy2Wow5n/84I3igthL9sudQ8qzjh/6i4tmYCm6IqYyKFlNbJZi7oBdjyqcWSWYRu3CtL0xbT6fS03ESZIg==}
dependencies:
'@ts-morph/common': 0.21.0
code-block-writer: 12.0.0
dev: true
/tslib@2.6.0:
resolution: {integrity: sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==}
dev: false
@@ -4656,6 +4634,36 @@ packages:
resolution: {integrity: sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==}
dev: false
/typedoc-plugin-markdown@4.0.0-next.23(typedoc@0.25.2):
resolution: {integrity: sha512-bKD0LnrQxUTbuDRiJfCWYLlzyERuskWldJ5eWKKuNY38xBOyBhSN8P+vD5KxlJoAifTOm76MK58sNrl4wgOoWg==}
peerDependencies:
typedoc: '>=0.25.0'
dependencies:
typedoc: 0.25.2(typescript@5.2.2)
dev: true
/typedoc-vitepress-theme@1.0.0-next.3(typedoc-plugin-markdown@4.0.0-next.23):
resolution: {integrity: sha512-MPVXYNu+pU3KgB7he3gdKfhEj1CD44uEwIxSp+ojaVG6jN1Iwo7/D2tNwmzszM3Yocz6IBvNb9EVfZBXzyWG/w==}
peerDependencies:
typedoc-plugin-markdown: '>=4.0.0-next.19'
dependencies:
typedoc-plugin-markdown: 4.0.0-next.23(typedoc@0.25.2)
dev: true
/typedoc@0.25.2(typescript@5.2.2):
resolution: {integrity: sha512-286F7BeATBiWe/qC4PCOCKlSTwfnsLbC/4cZ68oGBbvAqb9vV33quEOXx7q176OXotD+JdEerdQ1OZGJ818lnA==}
engines: {node: '>= 16'}
hasBin: true
peerDependencies:
typescript: 4.6.x || 4.7.x || 4.8.x || 4.9.x || 5.0.x || 5.1.x || 5.2.x
dependencies:
lunr: 2.3.9
marked: 4.3.0
minimatch: 9.0.3
shiki: 0.14.3
typescript: 5.2.2
dev: true
/typescript@5.2.2:
resolution: {integrity: sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==}
engines: {node: '>=14.17'}
+3
View File
@@ -1,3 +1,6 @@
/**
* @module wxt/browser
*/
import originalBrowser, { Browser, Runtime, I18n } from 'webextension-polyfill';
export interface AugmentedBrowser extends Browser {
+44 -41
View File
@@ -7,7 +7,7 @@ import { ContentScriptContext } from '.';
* Utility for mounting content script UI's with isolated styles. Automatically removed from the DOM
* when the content script's context is invalidated.
*
* See <https://wxt.dev/entrypoints/content-scripts.html#ui> for full documentation.
* See https://wxt.dev/entrypoints/content-scripts.html#ui for full documentation.
*
* @example
* // entrypoints/example-ui.content/index.ts
@@ -31,10 +31,10 @@ import { ContentScriptContext } from '.';
* }
* })
*/
export async function createContentScriptUi<T>(
export async function createContentScriptUi<TApp>(
ctx: ContentScriptContext,
options: ContentScriptUiOptions<T>,
): Promise<ContentScriptUi<T>> {
options: ContentScriptUiOptions<TApp>,
): Promise<ContentScriptUi<TApp>> {
const css = [options.css ?? ''];
if (ctx.options?.cssInjectionMode === 'ui') {
css.push(await loadCss());
@@ -62,7 +62,7 @@ export async function createContentScriptUi<T>(
return resolved ?? undefined;
};
let mounted: T;
let mounted: TApp;
const mount = () => {
const anchor = getAnchor();
@@ -173,7 +173,7 @@ async function loadCss(): Promise<string> {
}
}
export interface ContentScriptUi<T> {
export interface ContentScriptUi<TApp> {
/**
* The `HTMLElement` hosting the shadow root used to isolate the UI's styles. This is the element
* that get's added to the DOM. This element's style is not isolated from the webpage.
@@ -191,7 +191,7 @@ export interface ContentScriptUi<T> {
/**
* Custom data returned from the `options.mount` function.
*/
mounted: T;
mounted: TApp;
/**
* Function that mounts or remounts the UI on the page.
*/
@@ -202,7 +202,7 @@ export interface ContentScriptUi<T> {
remove: () => void;
}
interface BaseContentScriptUiOptions<T> {
interface BaseContentScriptUiOptions<TApp> {
/**
* The name of the custom component used to host the ShadowRoot. Must be kebab-case.
*/
@@ -234,50 +234,53 @@ interface BaseContentScriptUiOptions<T> {
*
* Optionally return a value that can be accessed at `ui.mounted` or in the `onRemove` callback.
*/
mount: (container: Element) => T;
mount: (container: Element) => TApp;
/**
* Callback called when the UI is removed from the webpage. Use to cleanup your UI, like
* unmounting your vue or react apps.
*/
onRemove?: (mounted: T) => void;
onRemove?: (mounted: TApp) => void;
/**
* Custom CSS text to apply to the UI. If your content script imports/generates CSS and you've
* set `cssInjectionMode: "ui"`, the imported CSS will be included automatically. You do not need
* to pass those styles in here. This is for any additional styles not in the imported CSS.
*
* See <https://wxt.dev/entrypoints/content-scripts.html#ui> for more info.
* See https://wxt.dev/entrypoints/content-scripts.html#ui for more info.
*/
css?: string;
}
export type OverlayContentScriptUiOptions<T> = BaseContentScriptUiOptions<T> & {
type: 'overlay';
/**
* When using `type: "overlay"`, the mounted element is 0px by 0px in size. Alignment specifies
* which corner is aligned with that 0x0 pixel space.
*
* @default "top-left"
*/
alignment?: ContentScriptUiOverlayAlignment;
/**
* The `z-index` used on the `shadowHost`. Set to a positive number to show your UI over website
* content.
*/
zIndex?: number;
};
export type OverlayContentScriptUiOptions<TApp> =
BaseContentScriptUiOptions<TApp> & {
type: 'overlay';
/**
* When using `type: "overlay"`, the mounted element is 0px by 0px in size. Alignment specifies
* which corner is aligned with that 0x0 pixel space.
*
* @default "top-left"
*/
alignment?: ContentScriptUiOverlayAlignment;
/**
* The `z-index` used on the `shadowHost`. Set to a positive number to show your UI over website
* content.
*/
zIndex?: number;
};
export type ModalContentScriptUiOptions<T> = BaseContentScriptUiOptions<T> & {
type: 'modal';
/**
* The `z-index` used on the `shadowHost`. Set to a positive number to show your UI over website
* content.
*/
zIndex?: number;
};
export type ModalContentScriptUiOptions<TApp> =
BaseContentScriptUiOptions<TApp> & {
type: 'modal';
/**
* The `z-index` used on the `shadowHost`. Set to a positive number to show your UI over website
* content.
*/
zIndex?: number;
};
export type InlineContentScriptUiOptions<T> = BaseContentScriptUiOptions<T> & {
type: 'inline';
};
export type InlineContentScriptUiOptions<TApp> =
BaseContentScriptUiOptions<TApp> & {
type: 'inline';
};
export type ContentScriptUiOverlayAlignment =
| 'top-left'
@@ -292,7 +295,7 @@ export type ContentScriptAppendMode =
| 'before'
| 'after';
export type ContentScriptUiOptions<T> =
| OverlayContentScriptUiOptions<T>
| ModalContentScriptUiOptions<T>
| InlineContentScriptUiOptions<T>;
export type ContentScriptUiOptions<TApp> =
| OverlayContentScriptUiOptions<TApp>
| ModalContentScriptUiOptions<TApp>
| InlineContentScriptUiOptions<TApp>;
+3
View File
@@ -1,3 +1,6 @@
/**
* @module wxt/client
*/
export * from './defineContentScript';
export * from './defineBackground';
export * from './createContentScriptUi';
+3
View File
@@ -1 +1,4 @@
/**
* @module wxt/sandbox
*/
export * from './defineUnlistedScript';
+14 -5
View File
@@ -3,23 +3,23 @@ import { browser } from '../browser';
import { logger } from './logger';
/**
* Extends [`AbortController`](https://developer.mozilla.org/en-US/docs/Web/API/AbortController).
* Implements [`AbortController`](https://developer.mozilla.org/en-US/docs/Web/API/AbortController).
* Used to detect and stop content script code when the script is invalidated.
*
* It also provides several utilities like `ctx.setTimeout` and `ctx.setInterval` that should be used in
* content scripts instead of `window.setTimeout` or `window.setInterval`.
*/
export class ContentScriptContext extends AbortController {
static SCRIPT_STARTED_MESSAGE_TYPE = 'wxt:content-script-started';
export class ContentScriptContext implements AbortController {
private static SCRIPT_STARTED_MESSAGE_TYPE = 'wxt:content-script-started';
#isTopFrame = window.self === window.top;
#abortController: AbortController;
constructor(
private readonly contentScriptName: string,
public readonly options?: Omit<ContentScriptDefinition, 'main'>,
) {
super();
this.#abortController = new AbortController();
if (this.#isTopFrame) {
this.#stopOldScripts();
}
@@ -29,6 +29,14 @@ export class ContentScriptContext extends AbortController {
});
}
get signal() {
return this.#abortController.signal;
}
abort(reason?: any): void {
return this.#abortController.abort(reason);
}
get isInvalid(): boolean {
if (browser.runtime.id == null) {
this.notifyInvalidated(); // Sets `signal.aborted` to true
@@ -150,6 +158,7 @@ export class ContentScriptContext extends AbortController {
}
/**
* @internal
* Abort the abort controller and execute all `onInvalidated` listeners.
*/
notifyInvalidated() {
+34 -34
View File
@@ -38,11 +38,10 @@ export async function findEntrypoints(
relativePaths.sort();
const pathGlobs = Object.keys(PATH_GLOB_TO_TYPE_MAP);
const existingNames: Record<string, Entrypoint | undefined> = {};
const entrypoints: Entrypoint[] = [];
let hasBackground = false;
await Promise.all(
// TODO: This parallelization is bad
const possibleEntrypoints: Array<Entrypoint | undefined> = await Promise.all(
relativePaths.map(async (relativePath) => {
const path = resolve(config.entrypointsDir, relativePath);
const matchingGlob = pathGlobs.find((glob) =>
@@ -50,41 +49,35 @@ export async function findEntrypoints(
);
if (matchingGlob == null) {
return config.logger.warn(
config.logger.warn(
`${relativePath} does not match any known entrypoint. Known entrypoints:\n${JSON.stringify(
PATH_GLOB_TO_TYPE_MAP,
null,
2,
)}`,
);
return;
}
const type = PATH_GLOB_TO_TYPE_MAP[matchingGlob];
if (type === 'ignored') return;
let entrypoint: Entrypoint;
switch (type) {
case 'popup':
entrypoint = await getPopupEntrypoint(config, path);
break;
return await getPopupEntrypoint(config, path);
case 'options':
entrypoint = await getOptionsEntrypoint(config, path);
break;
return await getOptionsEntrypoint(config, path);
case 'background':
entrypoint = await getBackgroundEntrypoint(config, path);
hasBackground = true;
break;
return await getBackgroundEntrypoint(config, path);
case 'content-script':
entrypoint = await getContentScriptEntrypoint(config, path);
break;
return await getContentScriptEntrypoint(config, path);
case 'unlisted-page':
entrypoint = await getUnlistedPageEntrypoint(config, path);
break;
return await getUnlistedPageEntrypoint(config, path);
case 'unlisted-script':
entrypoint = await getUnlistedScriptEntrypoint(config, path);
break;
return await getUnlistedScriptEntrypoint(config, path);
case 'content-script-style':
entrypoint = {
return {
type,
name: getEntrypointName(config.entrypointsDir, path),
inputPath: path,
@@ -94,9 +87,8 @@ export async function findEntrypoints(
exclude: undefined,
},
};
break;
default:
entrypoint = {
return {
type,
name: getEntrypointName(config.entrypointsDir, path),
inputPath: path,
@@ -107,22 +99,30 @@ export async function findEntrypoints(
},
};
}
const withSameName = existingNames[entrypoint.name];
if (withSameName) {
throw Error(
`Multiple entrypoints with the name "${
entrypoint.name
}" detected, but only one is allowed: ${[
relative(config.root, withSameName.inputPath),
relative(config.root, entrypoint.inputPath),
].join(', ')}`,
);
}
entrypoints.push(entrypoint);
existingNames[entrypoint.name] = entrypoint;
}),
);
const entrypoints = possibleEntrypoints.filter(
(entry) => !!entry,
) as Entrypoint[];
// Report duplicate entrypoint names
const existingNames: Record<string, Entrypoint | undefined> = {};
entrypoints.forEach((entrypoint) => {
const withSameName = existingNames[entrypoint.name];
if (withSameName) {
throw Error(
`Multiple entrypoints with the name "${
entrypoint.name
}" detected, but only one is allowed: ${[
relative(config.root, withSameName.inputPath),
relative(config.root, entrypoint.inputPath),
].join(', ')}`,
);
}
existingNames[entrypoint.name] = entrypoint;
});
if (config.command === 'serve' && !hasBackground) {
entrypoints.push(
await getBackgroundEntrypoint(config, VIRTUAL_NOOP_BACKGROUND_MODULE_ID),
+3
View File
@@ -8,6 +8,9 @@ import pc from 'picocolors';
* Remove generated/temp files from the directory.
*
* @param root The directory to look for generated/temp files in. Defaults to `process.cwd()`. Can be relative to `process.cwd()` or absolute.
*
* @example
* await clean();
*/
export async function clean(root = process.cwd()) {
consola.info('Cleaning Project');
+10 -10
View File
@@ -110,12 +110,12 @@ export interface InlineConfig {
*
* Available template variables:
*
* - `{name}` - The project's name converted to kebab-case
* - `{version}` - The version_name or version from the manifest
* - `{browser}` - The target browser from the `--browser` CLI flag
* - `{manifestVersion}` - Either "2" or "3"
* - `{{name}}` - The project's name converted to kebab-case
* - `{{version}}` - The version_name or version from the manifest
* - `{{browser}}` - The target browser from the `--browser` CLI flag
* - `{{manifestVersion}}` - Either "2" or "3"
*
* @default "{name}-{version}-{browser}.zip"
* @default "{{name}}-{{version}}-{{browser}}.zip"
*/
artifactTemplate?: string;
/**
@@ -123,12 +123,12 @@ export interface InlineConfig {
*
* Available template variables:
*
* - `{name}` - The project's name converted to kebab-case
* - `{version}` - The version_name or version from the manifest
* - `{browser}` - The target browser from the `--browser` CLI flag
* - `{manifestVersion}` - Either "2" or "3"
* - `{{name}}` - The project's name converted to kebab-case
* - `{{version}}` - The version_name or version from the manifest
* - `{{browser}}` - The target browser from the `--browser` CLI flag
* - `{{manifestVersion}}` - Either "2" or "3"
*
* @default "{name}-{version}-sources.zip"
* @default "{{name}}-{{version}}-sources.zip"
*/
sourcesTemplate?: string;
/**
+5 -8
View File
@@ -217,6 +217,7 @@ function addEntrypoints(
const options: Manifest.ActionManifest = {
default_icon: popup.options.defaultIcon,
default_title: popup.options.defaultTitle,
browser_style: popup.options.browserStyle,
};
if (manifest.manifest_version === 3) {
manifest.action = {
@@ -323,14 +324,10 @@ function addEntrypoints(
const newContentScripts = Array.from(hashToEntrypointsMap.entries()).map(
([, scripts]) => ({
...mapWxtOptionsToContentScript(scripts[0].options, config),
// TOOD: Sorting css and js arrays here so we get consistent test results... but we
// shouldn't have to. Where is the inconsistency coming from?
css: getContentScriptCssFiles(scripts, cssMap)?.sort(),
js: scripts
.map((entry) =>
getEntrypointBundlePath(entry, config.outDir, '.js'),
)
.sort(),
css: getContentScriptCssFiles(scripts, cssMap),
js: scripts.map((entry) =>
getEntrypointBundlePath(entry, config.outDir, '.js'),
),
}),
);
if (newContentScripts.length >= 0) {
+6 -1
View File
@@ -12,7 +12,12 @@ import { printFileList } from './log/printFileList';
* Zip the extension for distribution. Does not build, just zips the output that should exist for
* the given config.
*
* Returns a list of ZIP files that were created.
* @returns A list of ZIP files that were created.
*
* @example
* const config: InlineConfig = {};
* const result = await build(config);
* await zipExtension(config, result);
*/
export async function zipExtension(
config: InternalConfig,
+15 -2
View File
@@ -1,3 +1,6 @@
/**
* @module wxt
*/
import { BuildOutput, WxtDevServer, InlineConfig } from './core/types';
import { getInternalConfig } from './core/utils/getInternalConfig';
import pc from 'picocolors';
@@ -22,6 +25,11 @@ export * from './core/utils/defineRunnerConfig';
/**
* Bundles the extension for production. Returns a promise of the build result.
*
* @example
* const res = await build({
* // Enter config...
* })
*/
export async function build(config: InlineConfig): Promise<BuildOutput> {
const internalConfig = await getInternalConfig(config, 'build');
@@ -29,8 +37,13 @@ export async function build(config: InlineConfig): Promise<BuildOutput> {
}
/**
* Creates a dev server, pre-builds all the files that need to exist to load the extension, and open
* the browser with the extension installed.
* Creates a dev server and pre-builds all the files that need to exist before loading the extension.
*
* @example
* const server = await wxt.createServer({
* // Enter config...
* });
* await server.start();
*/
export async function createServer(
config?: InlineConfig,
+1 -1
View File
@@ -23,6 +23,6 @@
"@types/react-dom": "^18.2.6",
"@vitejs/plugin-react": "^4.0.3",
"typescript": "^5.1.6",
"wxt": "^0.7.0"
"wxt": "^0.8.0"
}
}
+1 -1
View File
@@ -20,6 +20,6 @@
"devDependencies": {
"typescript": "^5.1.6",
"vite-plugin-solid": "^2.7.0",
"wxt": "^0.7.0"
"wxt": "^0.8.0"
}
}
+1 -1
View File
@@ -20,6 +20,6 @@
"svelte-check": "^3.4.6",
"tslib": "^2.6.0",
"typescript": "^5.1.6",
"wxt": "^0.7.0"
"wxt": "^0.8.0"
}
}
+1 -1
View File
@@ -16,6 +16,6 @@
},
"devDependencies": {
"typescript": "^5.1.6",
"wxt": "^0.7.0"
"wxt": "^0.8.0"
}
}
+1 -1
View File
@@ -21,6 +21,6 @@
"@vitejs/plugin-vue": "^4.2.3",
"typescript": "^5.1.6",
"vue-tsc": "^1.8.4",
"wxt": "^0.7.0"
"wxt": "^0.8.0"
}
}